-
Notifications
You must be signed in to change notification settings - Fork 33
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(Layout): release new Layout component
- Loading branch information
1 parent
98aaf3f
commit 848a8f6
Showing
114 changed files
with
583 additions
and
1,166 deletions.
There are no files selected for viewing
21 changes: 21 additions & 0 deletions
21
packages/dnb-design-system-portal/src/docs/uilib/components/layout.mdx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,21 @@ | ||
| --- | ||
| title: 'Layout' | ||
| description: 'To make it easier to build application layout and form-views in line with defined design sketches, there are a number of components for layout.' | ||
| status: 'beta' | ||
| theme: 'sbanken' | ||
| showTabs: true | ||
| tabs: | ||
| - title: Info | ||
| key: /info | ||
| # - title: Demos | ||
| # key: /demos | ||
| breadcrumb: | ||
| - text: Layout | ||
| href: /uilib/components/layout/ | ||
| --- | ||
|
|
||
| import LayoutInfo from 'Docs/uilib/components/layout/info' | ||
| // import LayoutDemos from 'Docs/uilib/components/layout/demos' | ||
|
|
||
| <LayoutInfo /> | ||
| {/* <LayoutDemos /> */} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
15 changes: 15 additions & 0 deletions
15
packages/dnb-design-system-portal/src/docs/uilib/components/layout/ButtonRow/Examples.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,15 @@ | ||
| import ComponentBox from '../../../../../shared/tags/ComponentBox' | ||
| import { StepsLayout } from '@dnb/eufemia/src/extensions/forms' | ||
| import { Button, Layout } from '@dnb/eufemia/src' | ||
|
|
||
| export const Default = () => { | ||
| return ( | ||
| <ComponentBox scope={{ StepsLayout }}> | ||
| <Layout.ButtonRow> | ||
| <StepsLayout.PreviousButton /> | ||
| <StepsLayout.NextButton /> | ||
| <Button>Other button</Button> | ||
| </Layout.ButtonRow> | ||
| </ComponentBox> | ||
| ) | ||
| } |
File renamed without changes.
File renamed without changes.
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
6 changes: 3 additions & 3 deletions
6
...extensions/forms/Layout/Card/Examples.tsx → ...uilib/components/layout/Card/Examples.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
File renamed without changes.
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
6 changes: 3 additions & 3 deletions
6
...tensions/forms/Layout/Column/Examples.tsx → ...lib/components/layout/Column/Examples.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
File renamed without changes.
File renamed without changes.
7 changes: 7 additions & 0 deletions
7
...dnb-design-system-portal/src/docs/uilib/components/layout/Column/properties.mdx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,7 @@ | ||
| --- | ||
| showTabs: true | ||
| --- | ||
|
|
||
| ## Properties | ||
|
|
||
| Column inherits the properties of [FlexContainer](/uilib/components/layout/FlexContainer/properties) with `direction` already set. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
File renamed without changes.
File renamed without changes.
17 changes: 17 additions & 0 deletions
17
...ign-system-portal/src/docs/uilib/components/layout/FlexContainer/properties.mdx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,17 @@ | ||
| --- | ||
| showTabs: true | ||
| --- | ||
|
|
||
| ## Properties | ||
|
|
||
| | Property | Type | Description | | ||
| | ----------- | --------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | ||
| | `className` | `string` | _(optional)_ Outer DOM element class name | | ||
| | `direction` | `string` | _(optional)_ Direction of sub components. Can be: `row` or `column`. | | ||
| | `wrap` | `boolean` | _(optional)_ True to wrap contents if there is not enough space. | | ||
| | `justify` | `string` | _(optional)_ How to place sub components if there is space available in the container. Can be: `flex-start`, `flex-end`, `center`, `space-between`, `space-around` or `space-evenly`. | | ||
| | `divider` | `string` | _(optional)_ How to separate sub components. Can be: `space` or `line`. | | ||
| | `spacing` | `string` or `false` | _(optional)_ How much space between sub components. Can be `medium`, `small` or `false` for no spacing. | | ||
| | `width` | `string` or `false` | _(optional)_ `small`, `medium` or `large` for predefined standard widths. | | ||
| | `element` | `string` or `React.Element` | _(optional)_ Define the type of element. Defaults to `div`. | | ||
| | `children` | `React.Node` | _(optional)_ Contents. | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
14 changes: 5 additions & 9 deletions
14
...nsions/forms/Layout/FlexItem/Examples.tsx → ...b/components/layout/FlexItem/Examples.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
File renamed without changes.
File renamed without changes.
14 changes: 14 additions & 0 deletions
14
...b-design-system-portal/src/docs/uilib/components/layout/FlexItem/properties.mdx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,14 @@ | ||
| --- | ||
| showTabs: true | ||
| --- | ||
|
|
||
| ## Properties | ||
|
|
||
| | Property | Type | Description | | ||
| | ----------- | --------------------------- | ----------------------------------------------------------------------------------------------------------------------------- | | ||
| | `className` | `string` | _(optional)_ Outer DOM element class name | | ||
| | `grow` | `boolean` | _(optional)_ True to expand in width/height when there is more space available. | | ||
| | `shrink` | `boolean` | _(optional)_ True to shrink in width/height when there is not enough space available for all components within the container. | | ||
| | `width` | `string` or `false` | _(optional)_ `small`, `medium` or `large` for predefined standard widths. | | ||
| | `element` | `string` or `React.Element` | _(optional)_ Define the type of element. Defaults to `div`. | | ||
| | `children` | `React.Node` | _(optional)_ Contents. | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.