Skip to content

Commit

Permalink
Add example of horizontal radios (#3009)
Browse files Browse the repository at this point in the history
  • Loading branch information
HalvorHaugan authored Jun 19, 2024
1 parent 1dc3e43 commit cb304d0
Show file tree
Hide file tree
Showing 2 changed files with 28 additions and 2 deletions.
5 changes: 3 additions & 2 deletions @navikt/core/react/src/layout/stack/Stack.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -39,10 +39,11 @@ export interface StackProps extends HTMLAttributes<HTMLDivElement> {
* or an object of spacing tokens for different breakpoints.
*
* @example
* gap='4'
* gap="6"
* gap="8 4"
* gap={{xs: '2', sm: '3', md: '4', lg: '5', xl: '6'}}
*/
gap?: ResponsiveProp<SpacingScale>;
gap?: ResponsiveProp<SpacingScale | `${SpacingScale} ${SpacingScale}`>;
/**
* CSS `flex-direction` property.
* @default "row"
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
import { Radio, RadioGroup, Stack } from "@navikt/ds-react";
import { withDsExample } from "@/web/examples/withDsExample";

const Example = () => {
return (
<RadioGroup legend="Har du barn?">
<Stack gap="0 6" direction={{ xs: "column", sm: "row" }} wrap={false}>
<Radio value="1">Ja</Radio>
<Radio value="0">Nei</Radio>
</Stack>
</RadioGroup>
);
};

// EXAMPLES DO NOT INCLUDE CONTENT BELOW THIS LINE
export default withDsExample(Example);

/* Storybook story */
export const Demo = {
render: Example,
};

export const args = {
index: 0,
};

0 comments on commit cb304d0

Please sign in to comment.