@digdir/designsystemet-react 1.17.0 → 1.18.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -31,10 +31,10 @@ const ChipRemovable = react.forwardRef(function ChipRemovable(props, ref) {
31
31
  * <Chip.Checkbox name="language" value="nynorsk">Nynorsk</Chip.Checkbox>
32
32
  * <Chip.Checkbox name="language" value="bokmål">Bokmål</Chip.Checkbox>
33
33
  */
34
- const ChipCheckbox = react.forwardRef(function ChipCheckbox({ asChild, children, className, 'data-size': size, 'data-color': color, ...rest }, ref) {
34
+ const ChipCheckbox = react.forwardRef(function ChipCheckbox({ asChild, children, className, 'data-color': color, 'data-size': size, 'data-wrap': wrap, ...rest }, ref) {
35
35
  const inputType = rest.type ?? 'checkbox';
36
36
  const Component = asChild ? reactSlot.Slot : 'label';
37
- return (jsxRuntime.jsxs(Component, { className: cl('ds-chip', className), "data-size": size, "data-color": color, ref: ref, children: [jsxRuntime.jsx(input.Input, { ...rest, type: inputType }), jsxRuntime.jsx(reactSlot.Slottable, { children: children })] }));
37
+ return (jsxRuntime.jsxs(Component, { className: cl('ds-chip', className), "data-color": color, "data-size": size, "data-wrap": wrap, ref: ref, children: [jsxRuntime.jsx(input.Input, { ...rest, type: inputType }), jsxRuntime.jsx(reactSlot.Slottable, { children: children })] }));
38
38
  });
39
39
  /**
40
40
  * Chip.Radio used for single selection
@@ -48,8 +48,11 @@ const Suggestion = react.forwardRef(function Suggestion({ children, className, c
48
48
  const beforeChange = (event) => {
49
49
  event.preventDefault();
50
50
  const multiple = combobox?.multiple;
51
+ const input = combobox?.control;
51
52
  const data = event.detail;
52
53
  const nextItem = nextItems(data, selectedItemsRef.current, multiple);
54
+ if (!multiple && input)
55
+ input.value = data?.textContent || ''; // Sync input value for single selection
53
56
  onSelectedChangeRef.current?.(nextItem || null);
54
57
  if (!isControlled)
55
58
  setDefaultItems(sanitizeItems(nextItem));
@@ -29,10 +29,10 @@ const ChipRemovable = forwardRef(function ChipRemovable(props, ref) {
29
29
  * <Chip.Checkbox name="language" value="nynorsk">Nynorsk</Chip.Checkbox>
30
30
  * <Chip.Checkbox name="language" value="bokmål">Bokmål</Chip.Checkbox>
31
31
  */
32
- const ChipCheckbox = forwardRef(function ChipCheckbox({ asChild, children, className, 'data-size': size, 'data-color': color, ...rest }, ref) {
32
+ const ChipCheckbox = forwardRef(function ChipCheckbox({ asChild, children, className, 'data-color': color, 'data-size': size, 'data-wrap': wrap, ...rest }, ref) {
33
33
  const inputType = rest.type ?? 'checkbox';
34
34
  const Component = asChild ? Slot : 'label';
35
- return (jsxs(Component, { className: cl('ds-chip', className), "data-size": size, "data-color": color, ref: ref, children: [jsx(Input, { ...rest, type: inputType }), jsx(Slottable, { children: children })] }));
35
+ return (jsxs(Component, { className: cl('ds-chip', className), "data-color": color, "data-size": size, "data-wrap": wrap, ref: ref, children: [jsx(Input, { ...rest, type: inputType }), jsx(Slottable, { children: children })] }));
36
36
  });
37
37
  /**
38
38
  * Chip.Radio used for single selection
@@ -46,8 +46,11 @@ const Suggestion = forwardRef(function Suggestion({ children, className, creatab
46
46
  const beforeChange = (event) => {
47
47
  event.preventDefault();
48
48
  const multiple = combobox?.multiple;
49
+ const input = combobox?.control;
49
50
  const data = event.detail;
50
51
  const nextItem = nextItems(data, selectedItemsRef.current, multiple);
52
+ if (!multiple && input)
53
+ input.value = data?.textContent || ''; // Sync input value for single selection
51
54
  onSelectedChangeRef.current?.(nextItem || null);
52
55
  if (!isControlled)
53
56
  setDefaultItems(sanitizeItems(nextItem));
@@ -7,6 +7,11 @@ type ChipBaseProps = {
7
7
  * @default false
8
8
  */
9
9
  asChild?: boolean;
10
+ /**
11
+ * Change the text wrapping behavior of the chip. Use `wrap` to allow the chip to wrap text, and `nowrap` to prevent it from wrapping.
12
+ * @default 'nowrap'
13
+ */
14
+ 'data-wrap'?: 'nowrap' | 'wrap';
10
15
  };
11
16
  export type ChipRemovableProps = ChipButtonProps;
12
17
  export type ChipRadioProps = ChipCheckboxProps;
@@ -18,26 +23,26 @@ export type ChipCheckboxProps = MergeRight<DefaultProps & Omit<InputHTMLAttribut
18
23
  * @example
19
24
  * <Chip.Button>Click me</Chip.Button>
20
25
  */
21
- export declare const ChipButton: import("react").ForwardRefExoticComponent<Omit<DefaultProps & ButtonHTMLAttributes<HTMLButtonElement>, "asChild"> & ChipBaseProps & import("react").RefAttributes<HTMLButtonElement>>;
26
+ export declare const ChipButton: import("react").ForwardRefExoticComponent<Omit<DefaultProps & ButtonHTMLAttributes<HTMLButtonElement>, keyof ChipBaseProps> & ChipBaseProps & import("react").RefAttributes<HTMLButtonElement>>;
22
27
  /**
23
28
  * Chip.Removable used for interaction
24
29
  * @example
25
30
  * <Chip.Removable>Click to remove me</Chip.Removable>
26
31
  */
27
- export declare const ChipRemovable: import("react").ForwardRefExoticComponent<Omit<DefaultProps & ButtonHTMLAttributes<HTMLButtonElement>, "asChild"> & ChipBaseProps & import("react").RefAttributes<HTMLButtonElement>>;
32
+ export declare const ChipRemovable: import("react").ForwardRefExoticComponent<Omit<DefaultProps & ButtonHTMLAttributes<HTMLButtonElement>, keyof ChipBaseProps> & ChipBaseProps & import("react").RefAttributes<HTMLButtonElement>>;
28
33
  /**
29
34
  * Chip.Checkbox used for multiselection
30
35
  * @example
31
36
  * <Chip.Checkbox name="language" value="nynorsk">Nynorsk</Chip.Checkbox>
32
37
  * <Chip.Checkbox name="language" value="bokmål">Bokmål</Chip.Checkbox>
33
38
  */
34
- export declare const ChipCheckbox: import("react").ForwardRefExoticComponent<Omit<DefaultProps & Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size">, "asChild"> & ChipBaseProps & import("react").RefAttributes<HTMLLabelElement>>;
39
+ export declare const ChipCheckbox: import("react").ForwardRefExoticComponent<Omit<DefaultProps & Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size">, keyof ChipBaseProps> & ChipBaseProps & import("react").RefAttributes<HTMLLabelElement>>;
35
40
  /**
36
41
  * Chip.Radio used for single selection
37
42
  * @example
38
43
  * <Chip.Radio name="language" value="nynorsk">Nynorsk</Chip.Radio>
39
44
  * <Chip.Radio name="language" value="bokmål">Bokmål</Chip.Radio>
40
45
  */
41
- export declare const ChipRadio: import("react").ForwardRefExoticComponent<Omit<DefaultProps & Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size">, "asChild"> & ChipBaseProps & import("react").RefAttributes<HTMLLabelElement>>;
46
+ export declare const ChipRadio: import("react").ForwardRefExoticComponent<Omit<DefaultProps & Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "size">, keyof ChipBaseProps> & ChipBaseProps & import("react").RefAttributes<HTMLLabelElement>>;
42
47
  export {};
43
48
  //# sourceMappingURL=chips.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"chips.d.ts","sourceRoot":"","sources":["../../../src/components/chip/chips.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAEvE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAGlD,KAAK,aAAa,GAAG;IACnB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,eAAe,CAAC;AACjD,MAAM,MAAM,cAAc,GAAG,iBAAiB,CAAC;AAC/C,MAAM,MAAM,eAAe,GAAG,UAAU,CACtC,YAAY,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,EACtD,aAAa,CACd,CAAC;AACF,MAAM,MAAM,iBAAiB,GAAG,UAAU,CACxC,YAAY,GAAG,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,EAC3E,aAAa,CACd,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,UAAU,uLAatB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,aAAa,uLAIzB,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,YAAY,2MA4BxB,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,SAAS,2MAIrB,CAAC"}
1
+ {"version":3,"file":"chips.d.ts","sourceRoot":"","sources":["../../../src/components/chip/chips.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAEvE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAGlD,KAAK,aAAa,GAAG;IACnB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,WAAW,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;CACjC,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,eAAe,CAAC;AACjD,MAAM,MAAM,cAAc,GAAG,iBAAiB,CAAC;AAC/C,MAAM,MAAM,eAAe,GAAG,UAAU,CACtC,YAAY,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,EACtD,aAAa,CACd,CAAC;AACF,MAAM,MAAM,iBAAiB,GAAG,UAAU,CACxC,YAAY,GAAG,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,EAC3E,aAAa,CACd,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,UAAU,iMAatB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,aAAa,iMAIzB,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,YAAY,qNA8BxB,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,SAAS,qNAIrB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"suggestion.d.ts","sourceRoot":"","sources":["../../../src/components/suggestion/suggestion.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"suggestion.d.ts","sourceRoot":"","sources":["../../../src/components/suggestion/suggestion.tsx"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@digdir/designsystemet-react",
3
3
  "type": "module",
4
- "version": "1.17.0",
4
+ "version": "1.18.0",
5
5
  "description": "React components for Designsystemet",
6
6
  "author": "Designsystemet team",
7
7
  "repository": {
@@ -41,8 +41,8 @@
41
41
  "@radix-ui/react-slot": "^1.2.5",
42
42
  "@tanstack/react-virtual": "^3.14.2",
43
43
  "clsx": "^2.1.1",
44
- "@digdir/designsystemet-types": "1.17.0",
45
- "@digdir/designsystemet-web": "1.17.0"
44
+ "@digdir/designsystemet-types": "1.18.0",
45
+ "@digdir/designsystemet-web": "1.18.0"
46
46
  },
47
47
  "devDependencies": {
48
48
  "@rollup/plugin-commonjs": "29.0.3",
@@ -63,7 +63,7 @@
63
63
  "storybook": "10.4.4",
64
64
  "tsx": "4.22.4",
65
65
  "typescript": "5.9.3",
66
- "@digdir/designsystemet-css": "^1.17.0"
66
+ "@digdir/designsystemet-css": "^1.18.0"
67
67
  },
68
68
  "scripts": {
69
69
  "build": "pnpm run clean && tsc -b tsconfig.lib.json --emitDeclarationOnly false && rollup -c --bundleConfigAsCjs",