Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(Forms): alignSelf on Flex components #2662

Merged
merged 3 commits into from
Sep 18, 2023
Merged

feat(Forms): alignSelf on Flex components #2662

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
f9d8aa3
Add alignSelf prop to FlexContainer and FlexItem, default Cards and S…
henit Sep 15, 2023
3c92cef
Fix failing type check
tujoworker Sep 15, 2023
0294495
Update packages/dnb-eufemia/src/extensions/forms/Layout/FlexContainer…
henit Sep 18, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 3 additions & 1 deletion ...n-system-portal/src/docs/uilib/extensions/forms/Layout/ButtonRow/properties.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,4 +4,6 @@ showTabs: true

## Properties

_No properties_
| Property | Type | Description |
| ------------------------------------------- | ------- | --------------------------------------------------------------------- |
| [Space](/uilib/components/space/properties) | Various | _(optional)_ Spacing properties like `top` or `bottom` are supported. |
13 changes: 7 additions & 6 deletions ...design-system-portal/src/docs/uilib/extensions/forms/Layout/Card/properties.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,10 @@ showTabs: true

## Properties

| Property | Type | Description |
| ----------- | ------------------- | --------------------------------------------------------------------------------------------- |
| `stack` | `boolean` | _(optional)_ True to stack the sub components with lines between. |
| `direction` | `string` | _(optional)_ Direction of sub components. Can be: `row` or `column`. |
| `spacing` | `string` or `false` | _(optional)_ How to separate sub components. Can be: `space`, `line` or `false` for no space. |
| `children` | `React.Node` | _(optional)_ Contents. |
| Property | Type | Description |
| ------------------------------------------- | ------------------- | --------------------------------------------------------------------------------------------- |
| `stack` | `boolean` | _(optional)_ True to stack the sub components with lines between. |
| `direction` | `string` | _(optional)_ Direction of sub components. Can be: `row` or `column`. |
| `spacing` | `string` or `false` | _(optional)_ How to separate sub components. Can be: `space`, `line` or `false` for no space. |
| `children` | `React.Node` | _(optional)_ Contents. |
| [Space](/uilib/components/space/properties) | Various | _(optional)_ Spacing properties like `top` or `bottom` are supported. |
5 changes: 4 additions & 1 deletion ...sign-system-portal/src/docs/uilib/extensions/forms/Layout/Column/properties.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,4 +4,7 @@ showTabs: true

## Properties

Column inherits the properties of [FlexContainer](/uilib/extensions/forms/Layout/FlexContainer/properties) with `direction` already set.
| Property | Type | Description |
| -------------------------------------------------------------- | ------- | --------------------------------------------------------------------- |
| [FlexContainer](/uilib/extensions/forms/Layout/FlexContainer/) | Various | _(optional)_ All FlexContainer properties. |
| [Space](/uilib/components/space/properties) | Various | _(optional)_ Spacing properties like `top` or `bottom` are supported. |
21 changes: 11 additions & 10 deletions ...stem-portal/src/docs/uilib/extensions/forms/Layout/FlexContainer/properties.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,14 @@ 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. |
| `children` | `React.Node` | _(optional)_ Contents. |
| 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. |
| `children` | `React.Node` | _(optional)_ Contents. |
| [Space](/uilib/components/space/properties) | Various | _(optional)_ Spacing properties like `top` or `bottom` are supported. |
15 changes: 8 additions & 7 deletions ...gn-system-portal/src/docs/uilib/extensions/forms/Layout/FlexItem/properties.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,11 @@ 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. |
| `children` | `React.Node` | _(optional)_ Contents. |
| 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. |
| `children` | `React.Node` | _(optional)_ Contents. |
| [Space](/uilib/components/space/properties) | Various | _(optional)_ Spacing properties like `top` or `bottom` are supported. |
10 changes: 5 additions & 5 deletions ...system-portal/src/docs/uilib/extensions/forms/Layout/MainHeading/properties.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,8 @@ showTabs: true

## Properties

| Property | Type | Description |
| ---------- | ------------------------------------------- | -------------------------------------------------------------------------------------------- |
| `level` | `number` | _(optional)_ Define a specific level value to ensure correct level hierarchy. Defaults to 2. |
| `space` | [Space](/uilib/components/space/properties) | _(optional)_ Spacing object with keys `top`, `right`, `bottom` and `left` |
| `children` | `React.Node` | _(optional)_ Heading text / contents. |
| Property | Type | Description |
| ------------------------------------------- | ------------ | -------------------------------------------------------------------------------------------- |
| `level` | `number` | _(optional)_ Define a specific level value to ensure correct level hierarchy. Defaults to 2. |
| `children` | `React.Node` | _(optional)_ Heading text / contents. |
| [Space](/uilib/components/space/properties) | Various | _(optional)_ Spacing properties like `top` or `bottom` are supported. |
5 changes: 4 additions & 1 deletion ...-design-system-portal/src/docs/uilib/extensions/forms/Layout/Row/properties.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,4 +4,7 @@ showTabs: true

## Properties

Row inherits the properties of [FlexContainer](/uilib/extensions/forms/Layout/FlexContainer/properties) with `direction` already set.
| Property | Type | Description |
| -------------------------------------------------------------- | ------- | --------------------------------------------------------------------- |
| [FlexContainer](/uilib/extensions/forms/Layout/FlexContainer/) | Various | _(optional)_ All FlexContainer properties. |
| [Space](/uilib/components/space/properties) | Various | _(optional)_ Spacing properties like `top` or `bottom` are supported. |
11 changes: 6 additions & 5 deletions ...ign-system-portal/src/docs/uilib/extensions/forms/Layout/Section/properties.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,9 @@ showTabs: true

## Properties

| Property | Type | Description |
| ----------- | ------------------- | --------------------------------------------------------------------------------------------- |
| `direction` | `string` | _(optional)_ Direction of sub components. Can be: `row` or `column`. |
| `spacing` | `string` or `false` | _(optional)_ How to separate sub components. Can be: `space`, `line` or `false` for no space. |
| `children` | `React.Node` | _(optional)_ Contents. |
| Property | Type | Description |
| ------------------------------------------- | ------------------- | --------------------------------------------------------------------------------------------- |
| `direction` | `string` | _(optional)_ Direction of sub components. Can be: `row` or `column`. |
| `spacing` | `string` or `false` | _(optional)_ How to separate sub components. Can be: `space`, `line` or `false` for no space. |
| `children` | `React.Node` | _(optional)_ Contents. |
| [Space](/uilib/components/space/properties) | Various | _(optional)_ Spacing properties like `top` or `bottom` are supported. |
10 changes: 5 additions & 5 deletions ...-system-portal/src/docs/uilib/extensions/forms/Layout/SubHeading/properties.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,8 @@ showTabs: true

## Properties

| Property | Type | Description |
| ---------- | ------------------------------------------- | -------------------------------------------------------------------------------------------- |
| `level` | `number` | _(optional)_ Define a specific level value to ensure correct level hierarchy. Defaults to 3. |
| `space` | [Space](/uilib/components/space/properties) | _(optional)_ Spacing object with keys `top`, `right`, `bottom` and `left` |
| `children` | `React.Node` | _(optional)_ Heading text / contents. |
| Property | Type | Description |
| ------------------------------------------- | ------------ | -------------------------------------------------------------------------------------------- |
| `level` | `number` | _(optional)_ Define a specific level value to ensure correct level hierarchy. Defaults to 3. |
| `children` | `React.Node` | _(optional)_ Heading text / contents. |
| [Space](/uilib/components/space/properties) | Various | _(optional)_ Spacing properties like `top` or `bottom` are supported. |
11 changes: 6 additions & 5 deletions ...ortal/src/docs/uilib/extensions/forms/base-fields/ArraySelection/properties.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,9 @@ import DataValueReadwriteProperties from '../../data-value-readwrite-properties.

### Component-specific props

| Property | Type | Description |
| --------------- | ------------ | ------------------------------------------------------------------------------ |
| `variant` | `string` | _(optional)_ Choice of UI feature. Can be: `checkbox` or `button`. |
| `optionsLayout` | `string` | _(optional)_ Layout for the list of options. Can be `horizontal` or `vertical` |
| `children` | `React.Node` | _(optional)_ For providing Option components |
| Property | Type | Description |
| ------------------------------------------- | ------------ | ------------------------------------------------------------------------------ |
| `variant` | `string` | _(optional)_ Choice of UI feature. Can be: `checkbox` or `button`. |
| `optionsLayout` | `string` | _(optional)_ Layout for the list of options. Can be `horizontal` or `vertical` |
| `children` | `React.Node` | _(optional)_ For providing Option components |
| [Space](/uilib/components/space/properties) | Various | _(optional)_ Spacing properties like `top` or `bottom` are supported. |
11 changes: 6 additions & 5 deletions ...ystem-portal/src/docs/uilib/extensions/forms/base-fields/Boolean/properties.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,9 @@ import DataValueReadwriteProperties from '../../data-value-readwrite-properties.

### Component-specific props

| Property | Type | Description |
| ----------- | -------- | ------------------------------------------------------------------------------------- |
| `trueText` | `string` | Text to show in the UI when value is `true`. |
| `falseText` | `string` | Text to show in the UI when value is `false`. |
| `variant` | `string` | Choice of input feature. Can be: `checkbox`, `button`, `checkbox-button` or `buttons` |
| Property | Type | Description |
| ------------------------------------------- | -------- | ------------------------------------------------------------------------------------- |
| `trueText` | `string` | Text to show in the UI when value is `true`. |
| `falseText` | `string` | Text to show in the UI when value is `false`. |
| `variant` | `string` | Choice of input feature. Can be: `checkbox`, `button`, `checkbox-button` or `buttons` |
| [Space](/uilib/components/space/properties) | Various | _(optional)_ Spacing properties like `top` or `bottom` are supported. |
Loading