@navikt/ds-react 4.10.2 → 4.11.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.
Files changed (64) hide show
  1. package/_docs.json +145 -63
  2. package/cjs/form/combobox/Input/Input.js +5 -2
  3. package/cjs/form/combobox/SelectedOptions/SelectedOptions.js +3 -0
  4. package/cjs/grid/Cell.js +4 -0
  5. package/cjs/grid/Grid.js +4 -0
  6. package/cjs/grid/index.js +1 -3
  7. package/cjs/index.js +2 -0
  8. package/cjs/layout/content-container/index.js +8 -0
  9. package/cjs/layout/content-container/package.json +6 -0
  10. package/cjs/layout/grid/HGrid.js +92 -0
  11. package/cjs/layout/grid/index.js +8 -0
  12. package/cjs/layout/grid/package.json +6 -0
  13. package/cjs/layout/stack/Stack.js +1 -1
  14. package/cjs/layout/utilities/css.js +20 -4
  15. package/esm/form/combobox/Input/Input.js +5 -2
  16. package/esm/form/combobox/Input/Input.js.map +1 -1
  17. package/esm/form/combobox/SelectedOptions/SelectedOptions.js +3 -0
  18. package/esm/form/combobox/SelectedOptions/SelectedOptions.js.map +1 -1
  19. package/esm/grid/Cell.d.ts +4 -0
  20. package/esm/grid/Cell.js +4 -0
  21. package/esm/grid/Cell.js.map +1 -1
  22. package/esm/grid/Grid.d.ts +4 -0
  23. package/esm/grid/Grid.js +4 -0
  24. package/esm/grid/Grid.js.map +1 -1
  25. package/esm/grid/index.d.ts +0 -1
  26. package/esm/grid/index.js +0 -1
  27. package/esm/grid/index.js.map +1 -1
  28. package/esm/index.d.ts +2 -0
  29. package/esm/index.js +2 -0
  30. package/esm/index.js.map +1 -1
  31. package/esm/layout/content-container/ContentContainer.js.map +1 -0
  32. package/esm/layout/content-container/index.d.ts +1 -0
  33. package/esm/layout/content-container/index.js +2 -0
  34. package/esm/layout/content-container/index.js.map +1 -0
  35. package/esm/layout/grid/HGrid.d.ts +49 -0
  36. package/esm/layout/grid/HGrid.js +64 -0
  37. package/esm/layout/grid/HGrid.js.map +1 -0
  38. package/esm/layout/grid/index.d.ts +1 -0
  39. package/esm/layout/grid/index.js +2 -0
  40. package/esm/layout/grid/index.js.map +1 -0
  41. package/esm/layout/stack/Stack.js +1 -1
  42. package/esm/layout/stack/Stack.js.map +1 -1
  43. package/esm/layout/utilities/css.d.ts +8 -4
  44. package/esm/layout/utilities/css.js +18 -3
  45. package/esm/layout/utilities/css.js.map +1 -1
  46. package/package.json +2 -2
  47. package/src/form/combobox/Input/Input.tsx +6 -0
  48. package/src/form/combobox/SelectedOptions/SelectedOptions.tsx +3 -0
  49. package/src/form/combobox/combobox.stories.tsx +10 -2
  50. package/src/grid/Cell.tsx +4 -0
  51. package/src/grid/Grid.tsx +4 -0
  52. package/src/grid/index.ts +0 -4
  53. package/src/index.ts +2 -0
  54. package/src/layout/content-container/index.ts +4 -0
  55. package/src/layout/grid/HGrid.tsx +101 -0
  56. package/src/layout/grid/h-grid.stories.tsx +102 -0
  57. package/src/layout/grid/index.ts +1 -0
  58. package/src/layout/stack/Stack.tsx +5 -5
  59. package/src/layout/utilities/css.ts +38 -16
  60. package/esm/grid/ContentContainer.js.map +0 -1
  61. /package/cjs/{grid → layout/content-container}/ContentContainer.js +0 -0
  62. /package/esm/{grid → layout/content-container}/ContentContainer.d.ts +0 -0
  63. /package/esm/{grid → layout/content-container}/ContentContainer.js +0 -0
  64. /package/src/{grid → layout/content-container}/ContentContainer.tsx +0 -0
package/_docs.json CHANGED
@@ -4339,69 +4339,6 @@
4339
4339
  }
4340
4340
  }
4341
4341
  },
4342
- {
4343
- "filePath": "src/grid/ContentContainer.tsx",
4344
- "displayName": "ContentContainer",
4345
- "props": {
4346
- "children": {
4347
- "defaultValue": null,
4348
- "description": "ContentContainer content",
4349
- "name": "children",
4350
- "parent": {
4351
- "fileName": "src/grid/ContentContainer.tsx",
4352
- "name": "ContentContainerProps"
4353
- },
4354
- "declarations": [
4355
- {
4356
- "fileName": "src/grid/ContentContainer.tsx",
4357
- "name": "ContentContainerProps"
4358
- }
4359
- ],
4360
- "required": true,
4361
- "type": {
4362
- "name": "ReactNode"
4363
- }
4364
- },
4365
- "className": {
4366
- "defaultValue": null,
4367
- "description": "",
4368
- "name": "className",
4369
- "parent": {
4370
- "fileName": "aksel/node_modules/@types/react/ts5.0/index.d.ts",
4371
- "name": "HTMLAttributes"
4372
- },
4373
- "declarations": [
4374
- {
4375
- "fileName": "aksel/node_modules/@types/react/ts5.0/index.d.ts",
4376
- "name": "HTMLAttributes"
4377
- }
4378
- ],
4379
- "required": false,
4380
- "type": {
4381
- "name": "string"
4382
- }
4383
- },
4384
- "ref": {
4385
- "defaultValue": null,
4386
- "description": "Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null` (or call the ref with `null` if you passed a callback ref).\n@see https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom",
4387
- "name": "ref",
4388
- "parent": {
4389
- "fileName": "aksel/node_modules/@types/react/ts5.0/index.d.ts",
4390
- "name": "RefAttributes"
4391
- },
4392
- "declarations": [
4393
- {
4394
- "fileName": "aksel/node_modules/@types/react/ts5.0/index.d.ts",
4395
- "name": "RefAttributes"
4396
- }
4397
- ],
4398
- "required": false,
4399
- "type": {
4400
- "name": "Ref<HTMLDivElement>"
4401
- }
4402
- }
4403
- }
4404
- },
4405
4342
  {
4406
4343
  "filePath": "src/grid/Grid.tsx",
4407
4344
  "displayName": "Grid",
@@ -16512,6 +16449,151 @@
16512
16449
  }
16513
16450
  }
16514
16451
  },
16452
+ {
16453
+ "filePath": "src/layout/content-container/ContentContainer.tsx",
16454
+ "displayName": "ContentContainer",
16455
+ "props": {
16456
+ "children": {
16457
+ "defaultValue": null,
16458
+ "description": "ContentContainer content",
16459
+ "name": "children",
16460
+ "parent": {
16461
+ "fileName": "src/layout/content-container/ContentContainer.tsx",
16462
+ "name": "ContentContainerProps"
16463
+ },
16464
+ "declarations": [
16465
+ {
16466
+ "fileName": "src/layout/content-container/ContentContainer.tsx",
16467
+ "name": "ContentContainerProps"
16468
+ }
16469
+ ],
16470
+ "required": true,
16471
+ "type": {
16472
+ "name": "ReactNode"
16473
+ }
16474
+ },
16475
+ "className": {
16476
+ "defaultValue": null,
16477
+ "description": "",
16478
+ "name": "className",
16479
+ "parent": {
16480
+ "fileName": "aksel/node_modules/@types/react/ts5.0/index.d.ts",
16481
+ "name": "HTMLAttributes"
16482
+ },
16483
+ "declarations": [
16484
+ {
16485
+ "fileName": "aksel/node_modules/@types/react/ts5.0/index.d.ts",
16486
+ "name": "HTMLAttributes"
16487
+ }
16488
+ ],
16489
+ "required": false,
16490
+ "type": {
16491
+ "name": "string"
16492
+ }
16493
+ },
16494
+ "ref": {
16495
+ "defaultValue": null,
16496
+ "description": "Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null` (or call the ref with `null` if you passed a callback ref).\n@see https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom",
16497
+ "name": "ref",
16498
+ "parent": {
16499
+ "fileName": "aksel/node_modules/@types/react/ts5.0/index.d.ts",
16500
+ "name": "RefAttributes"
16501
+ },
16502
+ "declarations": [
16503
+ {
16504
+ "fileName": "aksel/node_modules/@types/react/ts5.0/index.d.ts",
16505
+ "name": "RefAttributes"
16506
+ }
16507
+ ],
16508
+ "required": false,
16509
+ "type": {
16510
+ "name": "Ref<HTMLDivElement>"
16511
+ }
16512
+ }
16513
+ }
16514
+ },
16515
+ {
16516
+ "filePath": "src/layout/grid/HGrid.tsx",
16517
+ "displayName": "HGrid",
16518
+ "props": {
16519
+ "columns": {
16520
+ "defaultValue": null,
16521
+ "description": "Number of columns to display. Can be a number, a string with a unit or tokens for spesific breakpoints.\nSets `grid-template-columns`, so `fr`, `minmax` etc. works.\n@example columns={{ sm: 1, md: 1, lg: \"1fr auto\", xl: \"1fr auto\"}}\n@example columns={3}\n@example columns=\"repeat(3, minmax(0, 1fr))\"",
16522
+ "name": "columns",
16523
+ "parent": {
16524
+ "fileName": "src/layout/grid/HGrid.tsx",
16525
+ "name": "HGridProps"
16526
+ },
16527
+ "declarations": [
16528
+ {
16529
+ "fileName": "src/layout/grid/HGrid.tsx",
16530
+ "name": "HGridProps"
16531
+ }
16532
+ ],
16533
+ "required": false,
16534
+ "type": {
16535
+ "name": "ResponsiveProp<string | number>"
16536
+ }
16537
+ },
16538
+ "gap": {
16539
+ "defaultValue": null,
16540
+ "description": "Spacing between columns. Based on spacing-tokens.\n@example gap=\"6\"\ngap={{ sm: \"2\", md: \"2\", lg: \"6\", xl: \"6\"}}",
16541
+ "name": "gap",
16542
+ "parent": {
16543
+ "fileName": "src/layout/grid/HGrid.tsx",
16544
+ "name": "HGridProps"
16545
+ },
16546
+ "declarations": [
16547
+ {
16548
+ "fileName": "src/layout/grid/HGrid.tsx",
16549
+ "name": "HGridProps"
16550
+ }
16551
+ ],
16552
+ "required": false,
16553
+ "type": {
16554
+ "name": "ResponsiveProp<SpacingScale>"
16555
+ }
16556
+ },
16557
+ "className": {
16558
+ "defaultValue": null,
16559
+ "description": "",
16560
+ "name": "className",
16561
+ "parent": {
16562
+ "fileName": "aksel/node_modules/@types/react/ts5.0/index.d.ts",
16563
+ "name": "HTMLAttributes"
16564
+ },
16565
+ "declarations": [
16566
+ {
16567
+ "fileName": "aksel/node_modules/@types/react/ts5.0/index.d.ts",
16568
+ "name": "HTMLAttributes"
16569
+ }
16570
+ ],
16571
+ "required": false,
16572
+ "type": {
16573
+ "name": "string"
16574
+ }
16575
+ },
16576
+ "ref": {
16577
+ "defaultValue": null,
16578
+ "description": "Allows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null` (or call the ref with `null` if you passed a callback ref).\n@see https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom",
16579
+ "name": "ref",
16580
+ "parent": {
16581
+ "fileName": "aksel/node_modules/@types/react/ts5.0/index.d.ts",
16582
+ "name": "RefAttributes"
16583
+ },
16584
+ "declarations": [
16585
+ {
16586
+ "fileName": "aksel/node_modules/@types/react/ts5.0/index.d.ts",
16587
+ "name": "RefAttributes"
16588
+ }
16589
+ ],
16590
+ "required": false,
16591
+ "type": {
16592
+ "name": "Ref<HTMLDivElement>"
16593
+ }
16594
+ }
16595
+ }
16596
+ },
16515
16597
  {
16516
16598
  "filePath": "src/layout/stack/HStack.tsx",
16517
16599
  "displayName": "HStack",
@@ -47,7 +47,7 @@ const Input = (0, react_1.forwardRef)((_a, ref) => {
47
47
  var { inputClassName, error, errorId } = _a, rest = __rest(_a, ["inputClassName", "error", "errorId"]);
48
48
  const { clearInput, inputProps, onChange, size, value } = (0, inputContext_1.useInputContext)();
49
49
  const { selectedOptions, removeSelectedOption, toggleOption } = (0, selectedOptionsContext_1.useSelectedOptionsContext)();
50
- const { activeDecendantId, allowNewValues, currentOption, filteredOptions, toggleIsListOpen, isListOpen, filteredOptionsIndex, moveFocusUp, moveFocusDown, ariaDescribedBy, moveFocusToInput, moveFocusToEnd, shouldAutocomplete, } = (0, filteredOptionsContext_1.useFilteredOptionsContext)();
50
+ const { activeDecendantId, allowNewValues, currentOption, filteredOptions, toggleIsListOpen, isListOpen, filteredOptionsIndex, moveFocusUp, moveFocusDown, ariaDescribedBy, moveFocusToInput, moveFocusToEnd, setFilteredOptionsIndex, shouldAutocomplete, } = (0, filteredOptionsContext_1.useFilteredOptionsContext)();
51
51
  const onEnter = (0, react_1.useCallback)((event) => {
52
52
  if (currentOption) {
53
53
  event.preventDefault();
@@ -138,6 +138,9 @@ const Input = (0, react_1.forwardRef)((_a, ref) => {
138
138
  }
139
139
  onChange(event);
140
140
  }, [filteredOptions.length, onChange, toggleIsListOpen]);
141
- return (react_1.default.createElement("input", Object.assign({}, rest, (0, __1.omit)(inputProps, ["aria-invalid"]), { ref: ref, value: value, onChange: onChangeHandler, type: "text", role: "combobox", onKeyUp: handleKeyUp, onKeyDown: handleKeyDown, "aria-controls": `${inputProps.id}-filtered-options`, "aria-expanded": !!isListOpen, autoComplete: "off", "aria-autocomplete": shouldAutocomplete ? "both" : "list", "aria-activedescendant": activeDecendantId, "aria-describedby": ariaDescribedBy, className: (0, clsx_1.default)(inputClassName, "navds-combobox__input", "navds-body-short", `navds-body-${size}`) })));
141
+ const onBlur = () => {
142
+ setFilteredOptionsIndex(-1);
143
+ };
144
+ return (react_1.default.createElement("input", Object.assign({}, rest, (0, __1.omit)(inputProps, ["aria-invalid"]), { ref: ref, value: value, onChange: onChangeHandler, type: "text", role: "combobox", onBlur: onBlur, onKeyUp: handleKeyUp, onKeyDown: handleKeyDown, "aria-controls": `${inputProps.id}-filtered-options`, "aria-expanded": !!isListOpen, autoComplete: "off", "aria-autocomplete": shouldAutocomplete ? "both" : "list", "aria-activedescendant": activeDecendantId, "aria-describedby": ariaDescribedBy, className: (0, clsx_1.default)(inputClassName, "navds-combobox__input", "navds-body-short", `navds-body-${size}`) })));
142
145
  });
143
146
  exports.default = Input;
@@ -6,11 +6,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
6
6
  const react_1 = __importDefault(require("react"));
7
7
  const __1 = require("../../..");
8
8
  const selectedOptionsContext_1 = require("./selectedOptionsContext");
9
+ const inputContext_1 = require("../Input/inputContext");
9
10
  const Option = ({ option }) => {
10
11
  const { isMultiSelect, removeSelectedOption } = (0, selectedOptionsContext_1.useSelectedOptionsContext)();
12
+ const { focusInput } = (0, inputContext_1.useInputContext)();
11
13
  const onClick = (e) => {
12
14
  e.stopPropagation();
13
15
  removeSelectedOption(option);
16
+ focusInput();
14
17
  };
15
18
  if (!isMultiSelect) {
16
19
  return (react_1.default.createElement("div", { className: "navds-combobox__selected-options--no-bg" }, option));
package/cjs/grid/Cell.js CHANGED
@@ -40,6 +40,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
40
40
  exports.Cell = void 0;
41
41
  const react_1 = __importStar(require("react"));
42
42
  const clsx_1 = __importDefault(require("clsx"));
43
+ /**
44
+ * @deprecated Use <HGrid /> instead. <Grid /> will be removed in the future.
45
+ * @see [📝 Documentation](https://aksel.nav.no/komponenter/core/hgrid)
46
+ */
43
47
  exports.Cell = (0, react_1.forwardRef)((_a, ref) => {
44
48
  var { children, xs, sm, md, lg, className } = _a, rest = __rest(_a, ["children", "xs", "sm", "md", "lg", "className"]);
45
49
  return (react_1.default.createElement("div", Object.assign({}, rest, { ref: ref, className: (0, clsx_1.default)("navds-grid__cell", xs && `navds-grid__cell--xs-${xs}`, sm && `navds-grid__cell--sm-${sm}`, md && `navds-grid__cell--md-${md}`, lg && `navds-grid__cell--lg-${lg}`, className) }), children));
package/cjs/grid/Grid.js CHANGED
@@ -40,6 +40,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
40
40
  exports.Grid = void 0;
41
41
  const react_1 = __importStar(require("react"));
42
42
  const clsx_1 = __importDefault(require("clsx"));
43
+ /**
44
+ * @deprecated Use <HGrid /> instead. <Grid /> will be removed in the future.
45
+ * @see [📝 Documentation](https://aksel.nav.no/komponenter/core/hgrid)
46
+ */
43
47
  exports.Grid = (0, react_1.forwardRef)((_a, ref) => {
44
48
  var { children, className } = _a, rest = __rest(_a, ["children", "className"]);
45
49
  return (react_1.default.createElement("div", Object.assign({ ref: ref, className: (0, clsx_1.default)("navds-grid", className) }, rest), children));
package/cjs/grid/index.js CHANGED
@@ -3,10 +3,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
3
3
  return (mod && mod.__esModule) ? mod : { "default": mod };
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.ContentContainer = exports.Grid = exports.Cell = void 0;
6
+ exports.Grid = exports.Cell = void 0;
7
7
  var Cell_1 = require("./Cell");
8
8
  Object.defineProperty(exports, "Cell", { enumerable: true, get: function () { return __importDefault(Cell_1).default; } });
9
9
  var Grid_1 = require("./Grid");
10
10
  Object.defineProperty(exports, "Grid", { enumerable: true, get: function () { return __importDefault(Grid_1).default; } });
11
- var ContentContainer_1 = require("./ContentContainer");
12
- Object.defineProperty(exports, "ContentContainer", { enumerable: true, get: function () { return __importDefault(ContentContainer_1).default; } });
package/cjs/index.js CHANGED
@@ -49,3 +49,5 @@ __exportStar(require("./tooltip"), exports);
49
49
  __exportStar(require("./typography"), exports);
50
50
  __exportStar(require("./util"), exports);
51
51
  __exportStar(require("./layout/stack"), exports);
52
+ __exportStar(require("./layout/grid"), exports);
53
+ __exportStar(require("./layout/content-container"), exports);
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.ContentContainer = void 0;
7
+ var ContentContainer_1 = require("./ContentContainer");
8
+ Object.defineProperty(exports, "ContentContainer", { enumerable: true, get: function () { return __importDefault(ContentContainer_1).default; } });
@@ -0,0 +1,6 @@
1
+ {
2
+ "sideEffects": false,
3
+ "main": "./index.js",
4
+ "module": "../../../esm/layout/content-container/index.js",
5
+ "types": "../../../esm/layout/content-container/index.d.ts"
6
+ }
@@ -0,0 +1,92 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
25
+ var __rest = (this && this.__rest) || function (s, e) {
26
+ var t = {};
27
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
28
+ t[p] = s[p];
29
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
30
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
31
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
32
+ t[p[i]] = s[p[i]];
33
+ }
34
+ return t;
35
+ };
36
+ var __importDefault = (this && this.__importDefault) || function (mod) {
37
+ return (mod && mod.__esModule) ? mod : { "default": mod };
38
+ };
39
+ Object.defineProperty(exports, "__esModule", { value: true });
40
+ exports.HGrid = void 0;
41
+ const react_1 = __importStar(require("react"));
42
+ const clsx_1 = __importDefault(require("clsx"));
43
+ const css_1 = require("../utilities/css");
44
+ /**
45
+ * Horizontal Grid Primitive with dynamic columns and gap based on breakpoints.
46
+ *
47
+ * @see [📝 Documentation](https://aksel.nav.no/komponenter/core/hgrid)
48
+ * @see 🏷️ {@link HGridProps}
49
+ *
50
+ * @example
51
+ * <HGrid gap="6" columns={3}>
52
+ * <div />
53
+ * <div />
54
+ * <div />
55
+ * </HGrid>
56
+ * @example
57
+ * <HGrid gap={{xs: "2", md: "6"}} columns={3}>
58
+ * <div />
59
+ * <div />
60
+ * <div />
61
+ * </HGrid>
62
+ * @example
63
+ * <HGrid gap="6" columns={{ sm: 1, md: 1, lg: "1fr auto", xl: "1fr auto"}}>
64
+ * <div />
65
+ * <div />
66
+ * <div />
67
+ * </HGrid>
68
+ */
69
+ exports.HGrid = (0, react_1.forwardRef)((_a, ref) => {
70
+ var { className, columns, gap, style } = _a, rest = __rest(_a, ["className", "columns", "gap", "style"]);
71
+ const styles = Object.assign(Object.assign(Object.assign({}, style), (0, css_1.getResponsiveProps)(`hgrid`, "gap", "spacing", gap)), (0, css_1.getResponsiveValue)(`hgrid`, "columns", formatGrid(columns)));
72
+ return (react_1.default.createElement("div", Object.assign({}, rest, { ref: ref, className: (0, clsx_1.default)("navds-hgrid", className), style: styles })));
73
+ });
74
+ function formatGrid(props) {
75
+ if (!props) {
76
+ return {};
77
+ }
78
+ if (typeof props === "string" || typeof props === "number") {
79
+ return getColumnValue(props);
80
+ }
81
+ return Object.fromEntries(Object.entries(props).map(([breakpointToken, columnValue]) => [
82
+ breakpointToken,
83
+ getColumnValue(columnValue),
84
+ ]));
85
+ }
86
+ const getColumnValue = (prop) => {
87
+ if (typeof prop === "number") {
88
+ return `repeat(${prop}, minmax(0, 1fr))`;
89
+ }
90
+ return prop;
91
+ };
92
+ exports.default = exports.HGrid;
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.HGrid = void 0;
7
+ var HGrid_1 = require("./HGrid");
8
+ Object.defineProperty(exports, "HGrid", { enumerable: true, get: function () { return __importDefault(HGrid_1).default; } });
@@ -0,0 +1,6 @@
1
+ {
2
+ "sideEffects": false,
3
+ "main": "./index.js",
4
+ "module": "../../../esm/layout/grid/index.js",
5
+ "types": "../../../esm/layout/grid/index.d.ts"
6
+ }
@@ -43,7 +43,7 @@ const react_1 = __importStar(require("react"));
43
43
  const css_1 = require("../utilities/css");
44
44
  exports.Stack = (0, react_1.forwardRef)((_a, ref) => {
45
45
  var { as: Component = "div", className, align, justify, wrap = true, gap, style: _style, direction } = _a, rest = __rest(_a, ["as", "className", "align", "justify", "wrap", "gap", "style", "direction"]);
46
- const style = Object.assign(Object.assign({ "--ac-stack-direction": direction, "--ac-stack-align": align, "--ac-stack-justify": justify, "--ac-stack-wrap": wrap ? "wrap" : "nowrap" }, (0, css_1.getResponsiveProps)(`stack`, "gap", "spacing", gap)), _style);
46
+ const style = Object.assign(Object.assign(Object.assign({}, _style), { "--__ac-stack-direction": direction, "--__ac-stack-align": align, "--__ac-stack-justify": justify, "--__ac-stack-wrap": wrap ? "wrap" : "nowrap" }), (0, css_1.getResponsiveProps)(`stack`, "gap", "spacing", gap));
47
47
  return (react_1.default.createElement(Component, Object.assign({}, rest, { ref: ref, style: style, className: (0, clsx_1.default)("navds-stack", className, {
48
48
  "navds-vstack": direction === "column",
49
49
  "navds-hstack": direction === "row",
@@ -1,17 +1,33 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.getResponsiveProps = void 0;
3
+ exports.getResponsiveValue = exports.getResponsiveProps = void 0;
4
4
  function getResponsiveProps(componentName, componentProp, tokenSubgroup, responsiveProp) {
5
- if (!responsiveProp)
5
+ if (!responsiveProp) {
6
6
  return {};
7
+ }
7
8
  if (typeof responsiveProp === "string") {
8
9
  return {
9
- [`--ac-${componentName}-${componentProp}-xs`]: `var(--a-${tokenSubgroup}-${responsiveProp})`,
10
+ [`--__ac-${componentName}-${componentProp}-xs`]: `var(--a-${tokenSubgroup}-${responsiveProp})`,
10
11
  };
11
12
  }
12
13
  return Object.fromEntries(Object.entries(responsiveProp).map(([breakpointAlias, aliasOrScale]) => [
13
- `--ac-${componentName}-${componentProp}-${breakpointAlias}`,
14
+ `--__ac-${componentName}-${componentProp}-${breakpointAlias}`,
14
15
  `var(--a-${tokenSubgroup}-${aliasOrScale})`,
15
16
  ]));
16
17
  }
17
18
  exports.getResponsiveProps = getResponsiveProps;
19
+ function getResponsiveValue(componentName, componentProp, responsiveProp) {
20
+ if (!responsiveProp) {
21
+ return {};
22
+ }
23
+ if (typeof responsiveProp === "string") {
24
+ return {
25
+ [`--__ac-${componentName}-${componentProp}-xs`]: responsiveProp,
26
+ };
27
+ }
28
+ return Object.fromEntries(Object.entries(responsiveProp).map(([breakpointAlias, responsiveValue]) => [
29
+ `--__ac-${componentName}-${componentProp}-${breakpointAlias}`,
30
+ responsiveValue,
31
+ ]));
32
+ }
33
+ exports.getResponsiveValue = getResponsiveValue;
@@ -19,7 +19,7 @@ const Input = forwardRef((_a, ref) => {
19
19
  var { inputClassName, error, errorId } = _a, rest = __rest(_a, ["inputClassName", "error", "errorId"]);
20
20
  const { clearInput, inputProps, onChange, size, value } = useInputContext();
21
21
  const { selectedOptions, removeSelectedOption, toggleOption } = useSelectedOptionsContext();
22
- const { activeDecendantId, allowNewValues, currentOption, filteredOptions, toggleIsListOpen, isListOpen, filteredOptionsIndex, moveFocusUp, moveFocusDown, ariaDescribedBy, moveFocusToInput, moveFocusToEnd, shouldAutocomplete, } = useFilteredOptionsContext();
22
+ const { activeDecendantId, allowNewValues, currentOption, filteredOptions, toggleIsListOpen, isListOpen, filteredOptionsIndex, moveFocusUp, moveFocusDown, ariaDescribedBy, moveFocusToInput, moveFocusToEnd, setFilteredOptionsIndex, shouldAutocomplete, } = useFilteredOptionsContext();
23
23
  const onEnter = useCallback((event) => {
24
24
  if (currentOption) {
25
25
  event.preventDefault();
@@ -110,7 +110,10 @@ const Input = forwardRef((_a, ref) => {
110
110
  }
111
111
  onChange(event);
112
112
  }, [filteredOptions.length, onChange, toggleIsListOpen]);
113
- return (React.createElement("input", Object.assign({}, rest, omit(inputProps, ["aria-invalid"]), { ref: ref, value: value, onChange: onChangeHandler, type: "text", role: "combobox", onKeyUp: handleKeyUp, onKeyDown: handleKeyDown, "aria-controls": `${inputProps.id}-filtered-options`, "aria-expanded": !!isListOpen, autoComplete: "off", "aria-autocomplete": shouldAutocomplete ? "both" : "list", "aria-activedescendant": activeDecendantId, "aria-describedby": ariaDescribedBy, className: cl(inputClassName, "navds-combobox__input", "navds-body-short", `navds-body-${size}`) })));
113
+ const onBlur = () => {
114
+ setFilteredOptionsIndex(-1);
115
+ };
116
+ return (React.createElement("input", Object.assign({}, rest, omit(inputProps, ["aria-invalid"]), { ref: ref, value: value, onChange: onChangeHandler, type: "text", role: "combobox", onBlur: onBlur, onKeyUp: handleKeyUp, onKeyDown: handleKeyDown, "aria-controls": `${inputProps.id}-filtered-options`, "aria-expanded": !!isListOpen, autoComplete: "off", "aria-autocomplete": shouldAutocomplete ? "both" : "list", "aria-activedescendant": activeDecendantId, "aria-describedby": ariaDescribedBy, className: cl(inputClassName, "navds-combobox__input", "navds-body-short", `navds-body-${size}`) })));
114
117
  });
115
118
  export default Input;
116
119
  //# sourceMappingURL=Input.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../../src/form/combobox/Input/Input.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../../src/form/combobox/Input/Input.tsx"],"names":[],"mappings":"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"}
@@ -1,11 +1,14 @@
1
1
  import React from "react";
2
2
  import { Chips } from "../../..";
3
3
  import { useSelectedOptionsContext } from "./selectedOptionsContext";
4
+ import { useInputContext } from "../Input/inputContext";
4
5
  const Option = ({ option }) => {
5
6
  const { isMultiSelect, removeSelectedOption } = useSelectedOptionsContext();
7
+ const { focusInput } = useInputContext();
6
8
  const onClick = (e) => {
7
9
  e.stopPropagation();
8
10
  removeSelectedOption(option);
11
+ focusInput();
9
12
  };
10
13
  if (!isMultiSelect) {
11
14
  return (React.createElement("div", { className: "navds-combobox__selected-options--no-bg" }, option));
@@ -1 +1 @@
1
- {"version":3,"file":"SelectedOptions.js","sourceRoot":"","sources":["../../../../src/form/combobox/SelectedOptions/SelectedOptions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AACjC,OAAO,EAAE,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AAQrE,MAAM,MAAM,GAAG,CAAC,EAAE,MAAM,EAAsB,EAAE,EAAE;IAChD,MAAM,EAAE,aAAa,EAAE,oBAAoB,EAAE,GAAG,yBAAyB,EAAE,CAAC;IAE5E,MAAM,OAAO,GAAG,CAAC,CAAC,EAAE,EAAE;QACpB,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,oBAAoB,CAAC,MAAM,CAAC,CAAC;IAC/B,CAAC,CAAC;IAEF,IAAI,CAAC,aAAa,EAAE;QAClB,OAAO,CACL,6BAAK,SAAS,EAAC,yCAAyC,IAAE,MAAM,CAAO,CACxE,CAAC;KACH;IAED,OAAO,oBAAC,KAAK,CAAC,SAAS,IAAC,OAAO,EAAE,OAAO,IAAG,MAAM,CAAmB,CAAC;AACvE,CAAC,CAAC;AAEF,MAAM,eAAe,GAAmC,CAAC,EACvD,eAAe,GAAG,EAAE,EACpB,IAAI,EACJ,QAAQ,GACT,EAAE,EAAE;IACH,OAAO,CACL,oBAAC,KAAK,IAAC,SAAS,EAAC,kCAAkC,EAAC,IAAI,EAAE,IAAI;QAC3D,eAAe,CAAC,MAAM;YACrB,CAAC,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC,CACjC,oBAAC,MAAM,IAAC,GAAG,EAAE,MAAM,GAAG,CAAC,EAAE,MAAM,EAAE,MAAM,GAAI,CAC5C,CAAC;YACJ,CAAC,CAAC,EAAE;QACL,QAAQ,CACH,CACT,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC"}
1
+ {"version":3,"file":"SelectedOptions.js","sourceRoot":"","sources":["../../../../src/form/combobox/SelectedOptions/SelectedOptions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AACjC,OAAO,EAAE,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AACrE,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAQxD,MAAM,MAAM,GAAG,CAAC,EAAE,MAAM,EAAsB,EAAE,EAAE;IAChD,MAAM,EAAE,aAAa,EAAE,oBAAoB,EAAE,GAAG,yBAAyB,EAAE,CAAC;IAC5E,MAAM,EAAE,UAAU,EAAE,GAAG,eAAe,EAAE,CAAC;IAEzC,MAAM,OAAO,GAAG,CAAC,CAAC,EAAE,EAAE;QACpB,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,oBAAoB,CAAC,MAAM,CAAC,CAAC;QAC7B,UAAU,EAAE,CAAC;IACf,CAAC,CAAC;IAEF,IAAI,CAAC,aAAa,EAAE;QAClB,OAAO,CACL,6BAAK,SAAS,EAAC,yCAAyC,IAAE,MAAM,CAAO,CACxE,CAAC;KACH;IAED,OAAO,oBAAC,KAAK,CAAC,SAAS,IAAC,OAAO,EAAE,OAAO,IAAG,MAAM,CAAmB,CAAC;AACvE,CAAC,CAAC;AAEF,MAAM,eAAe,GAAmC,CAAC,EACvD,eAAe,GAAG,EAAE,EACpB,IAAI,EACJ,QAAQ,GACT,EAAE,EAAE;IACH,OAAO,CACL,oBAAC,KAAK,IAAC,SAAS,EAAC,kCAAkC,EAAC,IAAI,EAAE,IAAI;QAC3D,eAAe,CAAC,MAAM;YACrB,CAAC,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC,CACjC,oBAAC,MAAM,IAAC,GAAG,EAAE,MAAM,GAAG,CAAC,EAAE,MAAM,EAAE,MAAM,GAAI,CAC5C,CAAC;YACJ,CAAC,CAAC,EAAE;QACL,QAAQ,CACH,CACT,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC"}
@@ -22,5 +22,9 @@ export interface CellProps extends HTMLAttributes<HTMLDivElement> {
22
22
  */
23
23
  lg?: Column;
24
24
  }
25
+ /**
26
+ * @deprecated Use <HGrid /> instead. <Grid /> will be removed in the future.
27
+ * @see [📝 Documentation](https://aksel.nav.no/komponenter/core/hgrid)
28
+ */
25
29
  export declare const Cell: React.ForwardRefExoticComponent<CellProps & React.RefAttributes<HTMLDivElement>>;
26
30
  export default Cell;
package/esm/grid/Cell.js CHANGED
@@ -11,6 +11,10 @@ var __rest = (this && this.__rest) || function (s, e) {
11
11
  };
12
12
  import React, { forwardRef } from "react";
13
13
  import cl from "clsx";
14
+ /**
15
+ * @deprecated Use <HGrid /> instead. <Grid /> will be removed in the future.
16
+ * @see [📝 Documentation](https://aksel.nav.no/komponenter/core/hgrid)
17
+ */
14
18
  export const Cell = forwardRef((_a, ref) => {
15
19
  var { children, xs, sm, md, lg, className } = _a, rest = __rest(_a, ["children", "xs", "sm", "md", "lg", "className"]);
16
20
  return (React.createElement("div", Object.assign({}, rest, { ref: ref, className: cl("navds-grid__cell", xs && `navds-grid__cell--xs-${xs}`, sm && `navds-grid__cell--sm-${sm}`, md && `navds-grid__cell--md-${md}`, lg && `navds-grid__cell--lg-${lg}`, className) }), children));
@@ -1 +1 @@
1
- {"version":3,"file":"Cell.js","sourceRoot":"","sources":["../../src/grid/Cell.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAkB,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAE,MAAM,MAAM,CAAC;AA0BtB,MAAM,CAAC,MAAM,IAAI,GAAG,UAAU,CAC5B,CAAC,EAAgD,EAAE,GAAG,EAAE,EAAE;QAAzD,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,OAAW,EAAN,IAAI,cAA9C,iDAAgD,CAAF;IAC7C,OAAO,CACL,6CACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,kBAAkB,EAClB,EAAE,IAAI,wBAAwB,EAAE,EAAE,EAClC,EAAE,IAAI,wBAAwB,EAAE,EAAE,EAClC,EAAE,IAAI,wBAAwB,EAAE,EAAE,EAClC,EAAE,IAAI,wBAAwB,EAAE,EAAE,EAClC,SAAS,CACV,KAEA,QAAQ,CACL,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,IAAI,CAAC"}
1
+ {"version":3,"file":"Cell.js","sourceRoot":"","sources":["../../src/grid/Cell.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAkB,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAE,MAAM,MAAM,CAAC;AA0BtB;;;GAGG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,UAAU,CAC5B,CAAC,EAAgD,EAAE,GAAG,EAAE,EAAE;QAAzD,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,OAAW,EAAN,IAAI,cAA9C,iDAAgD,CAAF;IAC7C,OAAO,CACL,6CACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,kBAAkB,EAClB,EAAE,IAAI,wBAAwB,EAAE,EAAE,EAClC,EAAE,IAAI,wBAAwB,EAAE,EAAE,EAClC,EAAE,IAAI,wBAAwB,EAAE,EAAE,EAClC,EAAE,IAAI,wBAAwB,EAAE,EAAE,EAClC,SAAS,CACV,KAEA,QAAQ,CACL,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,IAAI,CAAC"}
@@ -5,5 +5,9 @@ export interface GridProps extends HTMLAttributes<HTMLDivElement> {
5
5
  */
6
6
  children: React.ReactNode;
7
7
  }
8
+ /**
9
+ * @deprecated Use <HGrid /> instead. <Grid /> will be removed in the future.
10
+ * @see [📝 Documentation](https://aksel.nav.no/komponenter/core/hgrid)
11
+ */
8
12
  export declare const Grid: React.ForwardRefExoticComponent<GridProps & React.RefAttributes<HTMLDivElement>>;
9
13
  export default Grid;
package/esm/grid/Grid.js CHANGED
@@ -11,6 +11,10 @@ var __rest = (this && this.__rest) || function (s, e) {
11
11
  };
12
12
  import React, { forwardRef } from "react";
13
13
  import cl from "clsx";
14
+ /**
15
+ * @deprecated Use <HGrid /> instead. <Grid /> will be removed in the future.
16
+ * @see [📝 Documentation](https://aksel.nav.no/komponenter/core/hgrid)
17
+ */
14
18
  export const Grid = forwardRef((_a, ref) => {
15
19
  var { children, className } = _a, rest = __rest(_a, ["children", "className"]);
16
20
  return (React.createElement("div", Object.assign({ ref: ref, className: cl("navds-grid", className) }, rest), children));
@@ -1 +1 @@
1
- {"version":3,"file":"Grid.js","sourceRoot":"","sources":["../../src/grid/Grid.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAkB,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAE,MAAM,MAAM,CAAC;AAStB,MAAM,CAAC,MAAM,IAAI,GAAG,UAAU,CAC5B,CAAC,EAAgC,EAAE,GAAG,EAAE,EAAE;QAAzC,EAAE,QAAQ,EAAE,SAAS,OAAW,EAAN,IAAI,cAA9B,yBAAgC,CAAF;IAAY,OAAA,CACzC,2CAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,CAAC,YAAY,EAAE,SAAS,CAAC,IAAM,IAAI,GAC5D,QAAQ,CACL,CACP,CAAA;CAAA,CACF,CAAC;AAEF,eAAe,IAAI,CAAC"}
1
+ {"version":3,"file":"Grid.js","sourceRoot":"","sources":["../../src/grid/Grid.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAkB,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAE,MAAM,MAAM,CAAC;AAStB;;;GAGG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,UAAU,CAC5B,CAAC,EAAgC,EAAE,GAAG,EAAE,EAAE;QAAzC,EAAE,QAAQ,EAAE,SAAS,OAAW,EAAN,IAAI,cAA9B,yBAAgC,CAAF;IAAY,OAAA,CACzC,2CAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,CAAC,YAAY,EAAE,SAAS,CAAC,IAAM,IAAI,GAC5D,QAAQ,CACL,CACP,CAAA;CAAA,CACF,CAAC;AAEF,eAAe,IAAI,CAAC"}
@@ -1,3 +1,2 @@
1
1
  export { default as Cell, type CellProps } from "./Cell";
2
2
  export { default as Grid, type GridProps } from "./Grid";
3
- export { default as ContentContainer, type ContentContainerProps, } from "./ContentContainer";
package/esm/grid/index.js CHANGED
@@ -1,4 +1,3 @@
1
1
  export { default as Cell } from "./Cell";
2
2
  export { default as Grid } from "./Grid";
3
- export { default as ContentContainer, } from "./ContentContainer";
4
3
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/grid/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,IAAI,EAAkB,MAAM,QAAQ,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAkB,MAAM,QAAQ,CAAC;AACzD,OAAO,EACL,OAAO,IAAI,gBAAgB,GAE5B,MAAM,oBAAoB,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/grid/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,IAAI,EAAkB,MAAM,QAAQ,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAkB,MAAM,QAAQ,CAAC"}
package/esm/index.d.ts CHANGED
@@ -33,3 +33,5 @@ export * from "./tooltip";
33
33
  export * from "./typography";
34
34
  export * from "./util";
35
35
  export * from "./layout/stack";
36
+ export * from "./layout/grid";
37
+ export * from "./layout/content-container";