@navikt/ds-react 4.10.2 → 4.11.1
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.
- package/_docs.json +145 -63
- package/cjs/form/combobox/Input/Input.js +5 -2
- package/cjs/form/combobox/SelectedOptions/SelectedOptions.js +3 -0
- package/cjs/grid/Cell.js +4 -0
- package/cjs/grid/Grid.js +4 -0
- package/cjs/grid/index.js +1 -3
- package/cjs/index.js +2 -0
- package/cjs/layout/content-container/index.js +8 -0
- package/cjs/layout/content-container/package.json +6 -0
- package/cjs/layout/grid/HGrid.js +92 -0
- package/cjs/layout/grid/index.js +8 -0
- package/cjs/layout/grid/package.json +6 -0
- package/cjs/layout/stack/Stack.js +1 -1
- package/cjs/layout/utilities/css.js +20 -4
- package/esm/form/combobox/Input/Input.js +5 -2
- package/esm/form/combobox/Input/Input.js.map +1 -1
- package/esm/form/combobox/SelectedOptions/SelectedOptions.js +3 -0
- package/esm/form/combobox/SelectedOptions/SelectedOptions.js.map +1 -1
- package/esm/grid/Cell.d.ts +4 -0
- package/esm/grid/Cell.js +4 -0
- package/esm/grid/Cell.js.map +1 -1
- package/esm/grid/Grid.d.ts +4 -0
- package/esm/grid/Grid.js +4 -0
- package/esm/grid/Grid.js.map +1 -1
- package/esm/grid/index.d.ts +0 -1
- package/esm/grid/index.js +0 -1
- package/esm/grid/index.js.map +1 -1
- package/esm/index.d.ts +2 -0
- package/esm/index.js +2 -0
- package/esm/index.js.map +1 -1
- package/esm/layout/content-container/ContentContainer.js.map +1 -0
- package/esm/layout/content-container/index.d.ts +1 -0
- package/esm/layout/content-container/index.js +2 -0
- package/esm/layout/content-container/index.js.map +1 -0
- package/esm/layout/grid/HGrid.d.ts +49 -0
- package/esm/layout/grid/HGrid.js +64 -0
- package/esm/layout/grid/HGrid.js.map +1 -0
- package/esm/layout/grid/index.d.ts +1 -0
- package/esm/layout/grid/index.js +2 -0
- package/esm/layout/grid/index.js.map +1 -0
- package/esm/layout/stack/Stack.js +1 -1
- package/esm/layout/stack/Stack.js.map +1 -1
- package/esm/layout/utilities/css.d.ts +8 -4
- package/esm/layout/utilities/css.js +18 -3
- package/esm/layout/utilities/css.js.map +1 -1
- package/package.json +2 -2
- package/src/form/combobox/Input/Input.tsx +6 -0
- package/src/form/combobox/SelectedOptions/SelectedOptions.tsx +3 -0
- package/src/form/combobox/combobox.stories.tsx +10 -2
- package/src/grid/Cell.tsx +4 -0
- package/src/grid/Grid.tsx +4 -0
- package/src/grid/index.ts +0 -4
- package/src/index.ts +2 -0
- package/src/layout/content-container/index.ts +4 -0
- package/src/layout/grid/HGrid.tsx +101 -0
- package/src/layout/grid/h-grid.stories.tsx +102 -0
- package/src/layout/grid/index.ts +1 -0
- package/src/layout/stack/Stack.tsx +5 -5
- package/src/layout/utilities/css.ts +38 -16
- package/esm/grid/ContentContainer.js.map +0 -1
- /package/cjs/{grid → layout/content-container}/ContentContainer.js +0 -0
- /package/esm/{grid → layout/content-container}/ContentContainer.d.ts +0 -0
- /package/esm/{grid → layout/content-container}/ContentContainer.js +0 -0
- /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
|
-
|
|
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.
|
|
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,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; } });
|
|
@@ -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({ "--
|
|
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
|
-
[`--
|
|
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
|
-
`--
|
|
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
|
-
|
|
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;
|
|
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"}
|
package/esm/grid/Cell.d.ts
CHANGED
|
@@ -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));
|
package/esm/grid/Cell.js.map
CHANGED
|
@@ -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"}
|
package/esm/grid/Grid.d.ts
CHANGED
|
@@ -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));
|
package/esm/grid/Grid.js.map
CHANGED
|
@@ -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"}
|
package/esm/grid/index.d.ts
CHANGED
package/esm/grid/index.js
CHANGED
package/esm/grid/index.js.map
CHANGED
|
@@ -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
|
|
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"}
|