@navikt/ds-react 7.19.1 → 7.21.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.
- package/cjs/chat/Bubble.d.ts +6 -0
- package/cjs/chat/Bubble.js +2 -2
- package/cjs/chat/Bubble.js.map +1 -1
- package/cjs/chat/Chat.d.ts +6 -0
- package/cjs/chat/Chat.js +2 -2
- package/cjs/chat/Chat.js.map +1 -1
- package/cjs/form/combobox/FilteredOptions/FilteredOptionsItem.js +6 -6
- package/cjs/form/combobox/FilteredOptions/FilteredOptionsItem.js.map +1 -1
- package/cjs/form/combobox/FilteredOptions/filteredOptionsContext.js +3 -3
- package/cjs/timeline/period/ClickablePeriod.d.ts +5 -0
- package/cjs/timeline/period/ClickablePeriod.js +2 -1
- package/cjs/timeline/period/ClickablePeriod.js.map +1 -1
- package/cjs/timeline/period/index.d.ts +5 -0
- package/cjs/timeline/period/index.js.map +1 -1
- package/esm/chat/Bubble.d.ts +6 -0
- package/esm/chat/Bubble.js +3 -3
- package/esm/chat/Bubble.js.map +1 -1
- package/esm/chat/Chat.d.ts +6 -0
- package/esm/chat/Chat.js +2 -2
- package/esm/chat/Chat.js.map +1 -1
- package/esm/form/combobox/FilteredOptions/FilteredOptionsItem.js +6 -6
- package/esm/form/combobox/FilteredOptions/FilteredOptionsItem.js.map +1 -1
- package/esm/form/combobox/FilteredOptions/filteredOptionsContext.js +3 -3
- package/esm/timeline/period/ClickablePeriod.d.ts +5 -0
- package/esm/timeline/period/ClickablePeriod.js +2 -1
- package/esm/timeline/period/ClickablePeriod.js.map +1 -1
- package/esm/timeline/period/index.d.ts +5 -0
- package/esm/timeline/period/index.js.map +1 -1
- package/package.json +5 -5
- package/src/chat/Bubble.tsx +22 -4
- package/src/chat/Chat.tsx +8 -1
- package/src/form/combobox/FilteredOptions/FilteredOptionsItem.tsx +8 -12
- package/src/form/combobox/FilteredOptions/filteredOptionsContext.tsx +3 -3
- package/src/timeline/period/ClickablePeriod.tsx +6 -1
- package/src/timeline/period/index.tsx +6 -1
package/cjs/chat/Bubble.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React, { HTMLAttributes } from "react";
|
|
2
|
+
import { HeadingProps } from "../typography";
|
|
2
3
|
export interface ChatBubbleProps extends HTMLAttributes<HTMLDivElement> {
|
|
3
4
|
/**
|
|
4
5
|
* Bubble text.
|
|
@@ -16,6 +17,11 @@ export interface ChatBubbleProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
16
17
|
* Overrides hoizontal position of toptext.
|
|
17
18
|
*/
|
|
18
19
|
toptextPosition?: "left" | "right";
|
|
20
|
+
/**
|
|
21
|
+
* The heading level for the toptext.
|
|
22
|
+
* @default "3"
|
|
23
|
+
*/
|
|
24
|
+
toptextHeadingLevel?: Exclude<HeadingProps["level"], "1">;
|
|
19
25
|
}
|
|
20
26
|
declare const Bubble: React.ForwardRefExoticComponent<ChatBubbleProps & React.RefAttributes<HTMLDivElement>>;
|
|
21
27
|
export default Bubble;
|
package/cjs/chat/Bubble.js
CHANGED
|
@@ -38,10 +38,10 @@ const react_1 = __importStar(require("react"));
|
|
|
38
38
|
const Theme_1 = require("../theme/Theme");
|
|
39
39
|
const typography_1 = require("../typography");
|
|
40
40
|
const Bubble = (0, react_1.forwardRef)((_a, ref) => {
|
|
41
|
-
var { children, className, name, timestamp, toptextPosition } = _a, rest = __rest(_a, ["children", "className", "name", "timestamp", "toptextPosition"]);
|
|
41
|
+
var { children, className, name, timestamp, toptextPosition, toptextHeadingLevel = "3" } = _a, rest = __rest(_a, ["children", "className", "name", "timestamp", "toptextPosition", "toptextHeadingLevel"]);
|
|
42
42
|
const { cn } = (0, Theme_1.useRenameCSS)();
|
|
43
43
|
return (react_1.default.createElement("div", Object.assign({ ref: ref, className: cn("navds-chat__bubble", className) }, rest),
|
|
44
|
-
(timestamp || name) && (react_1.default.createElement("
|
|
44
|
+
(timestamp || name) && (react_1.default.createElement(typography_1.Heading, { size: "xsmall", level: toptextHeadingLevel, className: cn(`navds-chat__top-text`, toptextPosition && `navds-chat__top-text--${toptextPosition}`) },
|
|
45
45
|
name && react_1.default.createElement(typography_1.Detail, { as: "span" }, name),
|
|
46
46
|
name && timestamp && (react_1.default.createElement(typography_1.Detail, { as: "span", "aria-hidden": true }, "\u2022")),
|
|
47
47
|
timestamp && react_1.default.createElement(typography_1.Detail, { as: "span" }, timestamp))),
|
package/cjs/chat/Bubble.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Bubble.js","sourceRoot":"","sources":["../../src/chat/Bubble.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0D;AAC1D,0CAA8C;AAC9C,
|
|
1
|
+
{"version":3,"file":"Bubble.js","sourceRoot":"","sources":["../../src/chat/Bubble.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0D;AAC1D,0CAA8C;AAC9C,8CAA8D;AA0B9D,MAAM,MAAM,GAAG,IAAA,kBAAU,EACvB,CACE,EAQC,EACD,GAAG,EACH,EAAE;QAVF,EACE,QAAQ,EACR,SAAS,EACT,IAAI,EACJ,SAAS,EACT,eAAe,EACf,mBAAmB,GAAG,GAAG,OAE1B,EADI,IAAI,cAPT,wFAQC,CADQ;IAIT,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,OAAO,CACL,qDAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,CAAC,oBAAoB,EAAE,SAAS,CAAC,IAAM,IAAI;QACpE,CAAC,SAAS,IAAI,IAAI,CAAC,IAAI,CACtB,8BAAC,oBAAO,IACN,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,mBAAmB,EAC1B,SAAS,EAAE,EAAE,CACX,sBAAsB,EACtB,eAAe,IAAI,yBAAyB,eAAe,EAAE,CAC9D;YAEA,IAAI,IAAI,8BAAC,mBAAM,IAAC,EAAE,EAAC,MAAM,IAAE,IAAI,CAAU;YACzC,IAAI,IAAI,SAAS,IAAI,CACpB,8BAAC,mBAAM,IAAC,EAAE,EAAC,MAAM,kCAER,CACV;YACA,SAAS,IAAI,8BAAC,mBAAM,IAAC,EAAE,EAAC,MAAM,IAAE,SAAS,CAAU,CAC5C,CACX;QACA,QAAQ,CACL,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAe,MAAM,CAAC"}
|
package/cjs/chat/Chat.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React, { HTMLAttributes } from "react";
|
|
2
|
+
import { HeadingProps } from "../typography";
|
|
2
3
|
import Bubble from "./Bubble";
|
|
3
4
|
export declare const VARIANTS: readonly ["subtle", "info", "neutral"];
|
|
4
5
|
export declare const POSITIONS: readonly ["left", "right"];
|
|
@@ -43,6 +44,11 @@ export interface ChatProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
43
44
|
* @default "medium"
|
|
44
45
|
*/
|
|
45
46
|
size?: (typeof SIZES)[number];
|
|
47
|
+
/**
|
|
48
|
+
* The heading level for the toptext.
|
|
49
|
+
* @default "3"
|
|
50
|
+
*/
|
|
51
|
+
toptextHeadingLevel?: Exclude<HeadingProps["level"], "1">;
|
|
46
52
|
}
|
|
47
53
|
interface ChatComponent extends React.ForwardRefExoticComponent<ChatProps & React.RefAttributes<HTMLDivElement>> {
|
|
48
54
|
/**
|
package/cjs/chat/Chat.js
CHANGED
|
@@ -63,13 +63,13 @@ exports.SIZES = ["medium", "small"];
|
|
|
63
63
|
* ```
|
|
64
64
|
*/
|
|
65
65
|
exports.Chat = (0, react_1.forwardRef)((_a, ref) => {
|
|
66
|
-
var { children, className, name, timestamp, avatar, position = "left", variant = "neutral", toptextPosition, size = "medium" } = _a, rest = __rest(_a, ["children", "className", "name", "timestamp", "avatar", "position", "variant", "toptextPosition", "size"]);
|
|
66
|
+
var { children, className, name, timestamp, avatar, position = "left", variant = "neutral", toptextPosition, size = "medium", toptextHeadingLevel = "3" } = _a, rest = __rest(_a, ["children", "className", "name", "timestamp", "avatar", "position", "variant", "toptextPosition", "size", "toptextHeadingLevel"]);
|
|
67
67
|
const { cn } = (0, Theme_1.useRenameCSS)();
|
|
68
68
|
return (react_1.default.createElement("div", Object.assign({ ref: ref, className: cn("navds-chat", className, `navds-chat--${position}`, `navds-chat--top-text-${toptextPosition !== null && toptextPosition !== void 0 ? toptextPosition : position}`, `navds-chat--${size}`, `navds-chat--${variant}`) }, rest),
|
|
69
69
|
avatar && (react_1.default.createElement("div", { className: cn("navds-chat__avatar"), "aria-hidden": true }, avatar)),
|
|
70
70
|
react_1.default.createElement("ol", { className: cn("navds-chat__bubble-wrapper") }, react_1.default.Children.map(children, (child, i) => {
|
|
71
71
|
if (react_1.default.isValidElement(child)) {
|
|
72
|
-
return (react_1.default.createElement(typography_1.BodyLong, { as: "li", size: size }, react_1.default.cloneElement(child, Object.assign({ name: name && i === 0 ? name : undefined, timestamp: timestamp && i === 0 ? timestamp : undefined }, child.props))));
|
|
72
|
+
return (react_1.default.createElement(typography_1.BodyLong, { as: "li", size: size }, react_1.default.cloneElement(child, Object.assign({ name: name && i === 0 ? name : undefined, timestamp: timestamp && i === 0 ? timestamp : undefined, toptextHeadingLevel }, child.props))));
|
|
73
73
|
}
|
|
74
74
|
}))));
|
|
75
75
|
});
|
package/cjs/chat/Chat.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chat.js","sourceRoot":"","sources":["../../src/chat/Chat.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0D;AAC1D,0CAA8C;AAC9C,
|
|
1
|
+
{"version":3,"file":"Chat.js","sourceRoot":"","sources":["../../src/chat/Chat.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0D;AAC1D,0CAA8C;AAC9C,8CAAuD;AACvD,sDAA8B;AAEjB,QAAA,QAAQ,GAAG,CAAC,QAAQ,EAAE,MAAM,EAAE,SAAS,CAAU,CAAC;AAClD,QAAA,SAAS,GAAG,CAAC,MAAM,EAAE,OAAO,CAAU,CAAC;AACvC,QAAA,KAAK,GAAG,CAAC,QAAQ,EAAE,OAAO,CAAU,CAAC;AA2DlD;;;;;;;;;;;;;;;;GAgBG;AACU,QAAA,IAAI,GAAG,IAAA,kBAAU,EAC5B,CACE,EAYY,EACZ,GAAG,EACH,EAAE;QAdF,EACE,QAAQ,EACR,SAAS,EACT,IAAI,EACJ,SAAS,EACT,MAAM,EACN,QAAQ,GAAG,MAAM,EACjB,OAAO,GAAG,SAAS,EACnB,eAAe,EACf,IAAI,GAAG,QAAQ,EACf,mBAAmB,GAAG,GAAG,OAEf,EADP,IAAI,cAXT,iIAYC,CADQ;IAIT,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,OAAO,CACL,qDACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,YAAY,EACZ,SAAS,EACT,eAAe,QAAQ,EAAE,EACzB,wBAAwB,eAAe,aAAf,eAAe,cAAf,eAAe,GAAI,QAAQ,EAAE,EACrD,eAAe,IAAI,EAAE,EACrB,eAAe,OAAO,EAAE,CACzB,IACG,IAAI;QAEP,MAAM,IAAI,CACT,uCAAK,SAAS,EAAE,EAAE,CAAC,oBAAoB,CAAC,yBACrC,MAAM,CACH,CACP;QACD,sCAAI,SAAS,EAAE,EAAE,CAAC,4BAA4B,CAAC,IAC5C,eAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;YACzC,IAAI,eAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,CAAC;gBAChC,OAAO,CACL,8BAAC,qBAAQ,IAAC,EAAE,EAAC,IAAI,EAAC,IAAI,EAAE,IAAI,IACzB,eAAK,CAAC,YAAY,CAAC,KAAK,kBACvB,IAAI,EAAE,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EACxC,SAAS,EAAE,SAAS,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EACvD,mBAAmB,IAChB,KAAK,CAAC,KAAK,EACd,CACO,CACZ,CAAC;YACJ,CAAC;QACH,CAAC,CAAC,CACC,CACD,CACP,CAAC;AACJ,CAAC,CACe,CAAC;AAEnB,YAAI,CAAC,MAAM,GAAG,gBAAM,CAAC;AAErB,kBAAe,YAAI,CAAC"}
|
|
@@ -28,14 +28,14 @@ const FilteredOptionsItem = ({ option }) => {
|
|
|
28
28
|
const { isMultiSelect, maxSelected, selectedOptions, toggleOption } = (0, selectedOptionsContext_1.useSelectedOptionsContext)();
|
|
29
29
|
const [start, highlight, end] = useTextHighlight(option.label, searchTerm);
|
|
30
30
|
const isDisabled = (_option) => maxSelected.isLimitReached && !(0, combobox_utils_1.isInList)(_option.value, selectedOptions);
|
|
31
|
+
const optionId = filtered_options_util_1.default.getOptionId(id, option.value);
|
|
32
|
+
const isActive = activeDecendantId === optionId;
|
|
31
33
|
return (react_1.default.createElement("li", { className: cn("navds-combobox__list-item", {
|
|
32
|
-
"navds-combobox__list-item--focus":
|
|
33
|
-
filtered_options_util_1.default.getOptionId(id, option.label),
|
|
34
|
+
"navds-combobox__list-item--focus": isActive,
|
|
34
35
|
"navds-combobox__list-item--selected": (0, combobox_utils_1.isInList)(option.value, selectedOptions),
|
|
35
|
-
}), "data-no-focus": isDisabled(option) || undefined, id:
|
|
36
|
-
if (
|
|
37
|
-
|
|
38
|
-
virtualFocus.moveFocusToElement(filtered_options_util_1.default.getOptionId(id, option.label));
|
|
36
|
+
}), "data-no-focus": isDisabled(option) || undefined, id: optionId, key: optionId, tabIndex: -1, onMouseMove: () => {
|
|
37
|
+
if (!isActive) {
|
|
38
|
+
virtualFocus.moveFocusToElement(optionId);
|
|
39
39
|
setIsMouseLastUsedInputDevice(true);
|
|
40
40
|
}
|
|
41
41
|
}, onPointerUp: (event) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FilteredOptionsItem.js","sourceRoot":"","sources":["../../../../src/form/combobox/FilteredOptions/FilteredOptionsItem.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAC1B,qDAAoD;AACpD,gDAAoD;AACpD,oDAAgD;AAChD,0DAAyD;AACzD,sFAAsF;AACtF,sDAA6C;AAE7C,oFAA0D;AAC1D,qEAAqE;AAErE,MAAM,gBAAgB,GAAG,CAAC,IAAY,EAAE,UAAkB,EAAE,EAAE;IAC5D,MAAM,sBAAsB,GAAG,IAAI;SAChC,WAAW,EAAE;SACb,OAAO,CAAC,UAAU,CAAC,WAAW,EAAE,CAAC,CAAC;IACrC,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,sBAAsB,CAAC,CAAC;IACxD,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAC9B,sBAAsB,EACtB,sBAAsB,GAAG,UAAU,CAAC,MAAM,CAC3C,CAAC;IACF,MAAM,GAAG,GAAG,IAAI,CAAC,SAAS,CAAC,sBAAsB,GAAG,UAAU,CAAC,MAAM,CAAC,CAAC;IACvE,OAAO,CAAC,KAAK,EAAE,SAAS,EAAE,GAAG,CAAC,CAAC;AACjC,CAAC,CAAC;AAEF,MAAM,mBAAmB,GAAG,CAAC,EAAE,MAAM,EAA8B,EAAE,EAAE;IACrE,MAAM,EAAE,EAAE,EAAE,GAAG,IAAA,oBAAY,GAAE,CAAC;IAE9B,MAAM,EACJ,UAAU,EAAE,EAAE,EAAE,EAAE,EAClB,IAAI,EACJ,UAAU,GACX,GAAG,IAAA,+BAAe,GAAE,CAAC;IACtB,MAAM,EACJ,6BAA6B,EAC7B,gBAAgB,EAChB,iBAAiB,EACjB,YAAY,GACb,GAAG,IAAA,kDAAyB,GAAE,CAAC;IAChC,MAAM,EAAE,aAAa,EAAE,WAAW,EAAE,eAAe,EAAE,YAAY,EAAE,GACjE,IAAA,kDAAyB,GAAE,CAAC;IAC9B,MAAM,CAAC,KAAK,EAAE,SAAS,EAAE,GAAG,CAAC,GAAG,gBAAgB,CAAC,MAAM,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC;IAE3E,MAAM,UAAU,GAAG,CAAC,OAAuB,EAAE,EAAE,CAC7C,WAAW,CAAC,cAAc,IAAI,CAAC,IAAA,yBAAQ,EAAC,OAAO,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC;IAE1E,
|
|
1
|
+
{"version":3,"file":"FilteredOptionsItem.js","sourceRoot":"","sources":["../../../../src/form/combobox/FilteredOptions/FilteredOptionsItem.tsx"],"names":[],"mappings":"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"}
|
|
@@ -63,13 +63,13 @@ const FilteredOptionsProvider = ({ children, value: props, }) => {
|
|
|
63
63
|
const initialMap = Object.assign({ [filtered_options_util_1.default.getAddNewOptionId(id)]: allowNewValues
|
|
64
64
|
? (0, combobox_utils_1.toComboboxOption)(value)
|
|
65
65
|
: undefined }, customOptions.reduce((acc, customOption) => {
|
|
66
|
-
const _id = filtered_options_util_1.default.getOptionId(id, customOption.
|
|
66
|
+
const _id = filtered_options_util_1.default.getOptionId(id, customOption.value);
|
|
67
67
|
acc[_id] = customOption;
|
|
68
68
|
return acc;
|
|
69
69
|
}, {}));
|
|
70
70
|
// Add the options to the map
|
|
71
71
|
const finalMap = options.reduce((map, _option) => {
|
|
72
|
-
const _id = filtered_options_util_1.default.getOptionId(id, _option.
|
|
72
|
+
const _id = filtered_options_util_1.default.getOptionId(id, _option.value);
|
|
73
73
|
map[_id] = _option;
|
|
74
74
|
return map;
|
|
75
75
|
}, initialMap);
|
|
@@ -120,7 +120,7 @@ const FilteredOptionsProvider = ({ children, value: props, }) => {
|
|
|
120
120
|
}
|
|
121
121
|
else if (value || isLoading) {
|
|
122
122
|
if (shouldAutocomplete && filteredOptions[0]) {
|
|
123
|
-
activeOption = filtered_options_util_1.default.getOptionId(id, filteredOptions[0].
|
|
123
|
+
activeOption = filtered_options_util_1.default.getOptionId(id, filteredOptions[0].value);
|
|
124
124
|
}
|
|
125
125
|
else if (isListOpen && isLoading) {
|
|
126
126
|
activeOption = filtered_options_util_1.default.getIsLoadingId(id);
|
|
@@ -4,6 +4,11 @@ interface TimelineClickablePeriodProps extends PeriodProps {
|
|
|
4
4
|
onSelectPeriod?: (e: React.MouseEvent<Element, MouseEvent> | React.KeyboardEvent<Element>) => void;
|
|
5
5
|
isActive?: boolean;
|
|
6
6
|
periodRef: React.ForwardedRef<HTMLButtonElement>;
|
|
7
|
+
/**
|
|
8
|
+
* Default orientation of popover
|
|
9
|
+
* @default "top"
|
|
10
|
+
*/
|
|
11
|
+
placement?: "top" | "bottom";
|
|
7
12
|
}
|
|
8
13
|
declare const ClickablePeriod: React.MemoExoticComponent<({ onSelectPeriod, start, end, status, cropped, direction, left, width, icon, children, isActive, statusLabel, restProps, periodRef, }: TimelineClickablePeriodProps) => React.JSX.Element>;
|
|
9
14
|
export default ClickablePeriod;
|
|
@@ -33,6 +33,7 @@ const useRowContext_1 = require("../hooks/useRowContext");
|
|
|
33
33
|
const useTimelineContext_1 = require("../hooks/useTimelineContext");
|
|
34
34
|
const period_1 = require("../utils/period");
|
|
35
35
|
const ClickablePeriod = react_2.default.memo(({ onSelectPeriod, start, end, status, cropped, direction, left, width, icon, children, isActive, statusLabel, restProps, periodRef, }) => {
|
|
36
|
+
var _a;
|
|
36
37
|
const { cn } = (0, Theme_1.useRenameCSS)();
|
|
37
38
|
const [open, setOpen] = (0, react_2.useState)(false);
|
|
38
39
|
const { index } = (0, useRowContext_1.useRowContext)();
|
|
@@ -43,7 +44,7 @@ const ClickablePeriod = react_2.default.memo(({ onSelectPeriod, start, end, stat
|
|
|
43
44
|
const themeContext = (0, Theme_1.useThemeInternal)(false);
|
|
44
45
|
const showArrow = !themeContext;
|
|
45
46
|
const { context, placement, middlewareData: { arrow: { x: arrowX, y: arrowY } = {} }, refs, floatingStyles, } = (0, react_1.useFloating)({
|
|
46
|
-
placement: "top",
|
|
47
|
+
placement: (_a = restProps === null || restProps === void 0 ? void 0 : restProps.placement) !== null && _a !== void 0 ? _a : "top",
|
|
47
48
|
open,
|
|
48
49
|
onOpenChange: (_open) => setOpen(_open),
|
|
49
50
|
whileElementsMounted: react_1.autoUpdate,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ClickablePeriod.js","sourceRoot":"","sources":["../../../src/timeline/period/ClickablePeriod.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,8CAc4B;AAC5B,+CAAgD;AAChD,6CAAmE;AACnE,gEAA6D;AAC7D,2DAAqD;AACrD,gEAA6D;AAC7D,0DAAuD;AACvD,oEAAiE;AACjE,4CAAmE;
|
|
1
|
+
{"version":3,"file":"ClickablePeriod.js","sourceRoot":"","sources":["../../../src/timeline/period/ClickablePeriod.tsx"],"names":[],"mappings":"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"}
|
|
@@ -37,6 +37,11 @@ export interface TimelinePeriodProps extends React.HTMLAttributes<HTMLDivElement
|
|
|
37
37
|
* Make sure only one period is active at a time.
|
|
38
38
|
*/
|
|
39
39
|
isActive?: boolean;
|
|
40
|
+
/**
|
|
41
|
+
* Default orientation of popover
|
|
42
|
+
* @default "top"
|
|
43
|
+
*/
|
|
44
|
+
placement?: "top" | "bottom";
|
|
40
45
|
}
|
|
41
46
|
export interface PeriodType extends React.ForwardRefExoticComponent<TimelinePeriodProps & React.RefAttributes<HTMLDivElement | HTMLButtonElement>> {
|
|
42
47
|
componentType: TimelineComponentTypes;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/timeline/period/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,gEAA6D;AAC7D,0DAAuD;AAEvD,wEAAgD;AAChD,8EAAsD;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/timeline/period/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,gEAA6D;AAC7D,0DAAuD;AAEvD,wEAAgD;AAChD,8EAAsD;AAuDzC,QAAA,MAAM,GAAG,IAAA,kBAAU,EAC9B,CAAC,EAAE,IAAI,EAAuB,EAAE,GAAG,EAAE,EAAE;IACrC,MAAM,EAAE,OAAO,EAAE,GAAG,IAAA,6BAAa,GAAE,CAAC;IACpC,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAA,mCAAgB,GAAE,CAAC;IAEnD,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,QAAQ,CAAC,CAAC;IAEtD,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,OAAO,6DAAK,CAAC;IACf,CAAC;IACD,MAAM,EACJ,KAAK,EACL,YAAY,EACZ,KAAK,EACL,kBAAkB,EAClB,MAAM,GAAG,SAAS,EAClB,cAAc,EACd,OAAO,EACP,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,WAAW,GACZ,GAAG,MAAM,CAAC;IAEX,OAAO,cAAc,IAAI,QAAQ,CAAC,CAAC,CAAC,CAClC,8BAAC,yBAAe,IACd,SAAS,EAAE,GAA4C,EACvD,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,YAAY,EACjB,MAAM,EAAE,MAAM,EACd,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,OAAO,IAAI,EAAE,EACtB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,kBAAkB,EACxB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,IAEnB,QAAQ,CACO,CACnB,CAAC,CAAC,CAAC,CACF,8BAAC,4BAAkB,IACjB,SAAS,EAAE,GAAG,EACd,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,YAAY,EACjB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,IAAI,EAAE,EACtB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,kBAAkB,EACxB,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,GACpB,CACH,CAAC;AACJ,CAAC,CACY,CAAC;AAEhB,cAAM,CAAC,aAAa,GAAG,QAAQ,CAAC;AAEhC,kBAAe,cAAM,CAAC"}
|
package/esm/chat/Bubble.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React, { HTMLAttributes } from "react";
|
|
2
|
+
import { HeadingProps } from "../typography/index.js";
|
|
2
3
|
export interface ChatBubbleProps extends HTMLAttributes<HTMLDivElement> {
|
|
3
4
|
/**
|
|
4
5
|
* Bubble text.
|
|
@@ -16,6 +17,11 @@ export interface ChatBubbleProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
16
17
|
* Overrides hoizontal position of toptext.
|
|
17
18
|
*/
|
|
18
19
|
toptextPosition?: "left" | "right";
|
|
20
|
+
/**
|
|
21
|
+
* The heading level for the toptext.
|
|
22
|
+
* @default "3"
|
|
23
|
+
*/
|
|
24
|
+
toptextHeadingLevel?: Exclude<HeadingProps["level"], "1">;
|
|
19
25
|
}
|
|
20
26
|
declare const Bubble: React.ForwardRefExoticComponent<ChatBubbleProps & React.RefAttributes<HTMLDivElement>>;
|
|
21
27
|
export default Bubble;
|
package/esm/chat/Bubble.js
CHANGED
|
@@ -11,12 +11,12 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
11
11
|
};
|
|
12
12
|
import React, { forwardRef } from "react";
|
|
13
13
|
import { useRenameCSS } from "../theme/Theme.js";
|
|
14
|
-
import { Detail } from "../typography/index.js";
|
|
14
|
+
import { Detail, Heading } from "../typography/index.js";
|
|
15
15
|
const Bubble = forwardRef((_a, ref) => {
|
|
16
|
-
var { children, className, name, timestamp, toptextPosition } = _a, rest = __rest(_a, ["children", "className", "name", "timestamp", "toptextPosition"]);
|
|
16
|
+
var { children, className, name, timestamp, toptextPosition, toptextHeadingLevel = "3" } = _a, rest = __rest(_a, ["children", "className", "name", "timestamp", "toptextPosition", "toptextHeadingLevel"]);
|
|
17
17
|
const { cn } = useRenameCSS();
|
|
18
18
|
return (React.createElement("div", Object.assign({ ref: ref, className: cn("navds-chat__bubble", className) }, rest),
|
|
19
|
-
(timestamp || name) && (React.createElement("
|
|
19
|
+
(timestamp || name) && (React.createElement(Heading, { size: "xsmall", level: toptextHeadingLevel, className: cn(`navds-chat__top-text`, toptextPosition && `navds-chat__top-text--${toptextPosition}`) },
|
|
20
20
|
name && React.createElement(Detail, { as: "span" }, name),
|
|
21
21
|
name && timestamp && (React.createElement(Detail, { as: "span", "aria-hidden": true }, "\u2022")),
|
|
22
22
|
timestamp && React.createElement(Detail, { as: "span" }, timestamp))),
|
package/esm/chat/Bubble.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Bubble.js","sourceRoot":"","sources":["../../src/chat/Bubble.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAkB,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"Bubble.js","sourceRoot":"","sources":["../../src/chat/Bubble.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAkB,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,MAAM,EAAE,OAAO,EAAgB,MAAM,eAAe,CAAC;AA0B9D,MAAM,MAAM,GAAG,UAAU,CACvB,CACE,EAQC,EACD,GAAG,EACH,EAAE;QAVF,EACE,QAAQ,EACR,SAAS,EACT,IAAI,EACJ,SAAS,EACT,eAAe,EACf,mBAAmB,GAAG,GAAG,OAE1B,EADI,IAAI,cAPT,wFAQC,CADQ;IAIT,MAAM,EAAE,EAAE,EAAE,GAAG,YAAY,EAAE,CAAC;IAE9B,OAAO,CACL,2CAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,CAAC,oBAAoB,EAAE,SAAS,CAAC,IAAM,IAAI;QACpE,CAAC,SAAS,IAAI,IAAI,CAAC,IAAI,CACtB,oBAAC,OAAO,IACN,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,mBAAmB,EAC1B,SAAS,EAAE,EAAE,CACX,sBAAsB,EACtB,eAAe,IAAI,yBAAyB,eAAe,EAAE,CAC9D;YAEA,IAAI,IAAI,oBAAC,MAAM,IAAC,EAAE,EAAC,MAAM,IAAE,IAAI,CAAU;YACzC,IAAI,IAAI,SAAS,IAAI,CACpB,oBAAC,MAAM,IAAC,EAAE,EAAC,MAAM,kCAER,CACV;YACA,SAAS,IAAI,oBAAC,MAAM,IAAC,EAAE,EAAC,MAAM,IAAE,SAAS,CAAU,CAC5C,CACX;QACA,QAAQ,CACL,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,MAAM,CAAC"}
|
package/esm/chat/Chat.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React, { HTMLAttributes } from "react";
|
|
2
|
+
import { HeadingProps } from "../typography/index.js";
|
|
2
3
|
import Bubble from "./Bubble.js";
|
|
3
4
|
export declare const VARIANTS: readonly ["subtle", "info", "neutral"];
|
|
4
5
|
export declare const POSITIONS: readonly ["left", "right"];
|
|
@@ -43,6 +44,11 @@ export interface ChatProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
43
44
|
* @default "medium"
|
|
44
45
|
*/
|
|
45
46
|
size?: (typeof SIZES)[number];
|
|
47
|
+
/**
|
|
48
|
+
* The heading level for the toptext.
|
|
49
|
+
* @default "3"
|
|
50
|
+
*/
|
|
51
|
+
toptextHeadingLevel?: Exclude<HeadingProps["level"], "1">;
|
|
46
52
|
}
|
|
47
53
|
interface ChatComponent extends React.ForwardRefExoticComponent<ChatProps & React.RefAttributes<HTMLDivElement>> {
|
|
48
54
|
/**
|
package/esm/chat/Chat.js
CHANGED
|
@@ -34,13 +34,13 @@ export const SIZES = ["medium", "small"];
|
|
|
34
34
|
* ```
|
|
35
35
|
*/
|
|
36
36
|
export const Chat = forwardRef((_a, ref) => {
|
|
37
|
-
var { children, className, name, timestamp, avatar, position = "left", variant = "neutral", toptextPosition, size = "medium" } = _a, rest = __rest(_a, ["children", "className", "name", "timestamp", "avatar", "position", "variant", "toptextPosition", "size"]);
|
|
37
|
+
var { children, className, name, timestamp, avatar, position = "left", variant = "neutral", toptextPosition, size = "medium", toptextHeadingLevel = "3" } = _a, rest = __rest(_a, ["children", "className", "name", "timestamp", "avatar", "position", "variant", "toptextPosition", "size", "toptextHeadingLevel"]);
|
|
38
38
|
const { cn } = useRenameCSS();
|
|
39
39
|
return (React.createElement("div", Object.assign({ ref: ref, className: cn("navds-chat", className, `navds-chat--${position}`, `navds-chat--top-text-${toptextPosition !== null && toptextPosition !== void 0 ? toptextPosition : position}`, `navds-chat--${size}`, `navds-chat--${variant}`) }, rest),
|
|
40
40
|
avatar && (React.createElement("div", { className: cn("navds-chat__avatar"), "aria-hidden": true }, avatar)),
|
|
41
41
|
React.createElement("ol", { className: cn("navds-chat__bubble-wrapper") }, React.Children.map(children, (child, i) => {
|
|
42
42
|
if (React.isValidElement(child)) {
|
|
43
|
-
return (React.createElement(BodyLong, { as: "li", size: size }, React.cloneElement(child, Object.assign({ name: name && i === 0 ? name : undefined, timestamp: timestamp && i === 0 ? timestamp : undefined }, child.props))));
|
|
43
|
+
return (React.createElement(BodyLong, { as: "li", size: size }, React.cloneElement(child, Object.assign({ name: name && i === 0 ? name : undefined, timestamp: timestamp && i === 0 ? timestamp : undefined, toptextHeadingLevel }, child.props))));
|
|
44
44
|
}
|
|
45
45
|
}))));
|
|
46
46
|
});
|
package/esm/chat/Chat.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chat.js","sourceRoot":"","sources":["../../src/chat/Chat.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAkB,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,QAAQ,
|
|
1
|
+
{"version":3,"file":"Chat.js","sourceRoot":"","sources":["../../src/chat/Chat.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAkB,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAgB,MAAM,eAAe,CAAC;AACvD,OAAO,MAAM,MAAM,UAAU,CAAC;AAE9B,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,QAAQ,EAAE,MAAM,EAAE,SAAS,CAAU,CAAC;AAC/D,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,MAAM,EAAE,OAAO,CAAU,CAAC;AACpD,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,QAAQ,EAAE,OAAO,CAAU,CAAC;AA2DlD;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,UAAU,CAC5B,CACE,EAYY,EACZ,GAAG,EACH,EAAE;QAdF,EACE,QAAQ,EACR,SAAS,EACT,IAAI,EACJ,SAAS,EACT,MAAM,EACN,QAAQ,GAAG,MAAM,EACjB,OAAO,GAAG,SAAS,EACnB,eAAe,EACf,IAAI,GAAG,QAAQ,EACf,mBAAmB,GAAG,GAAG,OAEf,EADP,IAAI,cAXT,iIAYC,CADQ;IAIT,MAAM,EAAE,EAAE,EAAE,GAAG,YAAY,EAAE,CAAC;IAE9B,OAAO,CACL,2CACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,YAAY,EACZ,SAAS,EACT,eAAe,QAAQ,EAAE,EACzB,wBAAwB,eAAe,aAAf,eAAe,cAAf,eAAe,GAAI,QAAQ,EAAE,EACrD,eAAe,IAAI,EAAE,EACrB,eAAe,OAAO,EAAE,CACzB,IACG,IAAI;QAEP,MAAM,IAAI,CACT,6BAAK,SAAS,EAAE,EAAE,CAAC,oBAAoB,CAAC,yBACrC,MAAM,CACH,CACP;QACD,4BAAI,SAAS,EAAE,EAAE,CAAC,4BAA4B,CAAC,IAC5C,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;YACzC,IAAI,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,CAAC;gBAChC,OAAO,CACL,oBAAC,QAAQ,IAAC,EAAE,EAAC,IAAI,EAAC,IAAI,EAAE,IAAI,IACzB,KAAK,CAAC,YAAY,CAAC,KAAK,kBACvB,IAAI,EAAE,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EACxC,SAAS,EAAE,SAAS,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EACvD,mBAAmB,IAChB,KAAK,CAAC,KAAK,EACd,CACO,CACZ,CAAC;YACJ,CAAC;QACH,CAAC,CAAC,CACC,CACD,CACP,CAAC;AACJ,CAAC,CACe,CAAC;AAEnB,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;AAErB,eAAe,IAAI,CAAC"}
|
|
@@ -23,14 +23,14 @@ const FilteredOptionsItem = ({ option }) => {
|
|
|
23
23
|
const { isMultiSelect, maxSelected, selectedOptions, toggleOption } = useSelectedOptionsContext();
|
|
24
24
|
const [start, highlight, end] = useTextHighlight(option.label, searchTerm);
|
|
25
25
|
const isDisabled = (_option) => maxSelected.isLimitReached && !isInList(_option.value, selectedOptions);
|
|
26
|
+
const optionId = filteredOptionsUtil.getOptionId(id, option.value);
|
|
27
|
+
const isActive = activeDecendantId === optionId;
|
|
26
28
|
return (React.createElement("li", { className: cn("navds-combobox__list-item", {
|
|
27
|
-
"navds-combobox__list-item--focus":
|
|
28
|
-
filteredOptionsUtil.getOptionId(id, option.label),
|
|
29
|
+
"navds-combobox__list-item--focus": isActive,
|
|
29
30
|
"navds-combobox__list-item--selected": isInList(option.value, selectedOptions),
|
|
30
|
-
}), "data-no-focus": isDisabled(option) || undefined, id:
|
|
31
|
-
if (
|
|
32
|
-
|
|
33
|
-
virtualFocus.moveFocusToElement(filteredOptionsUtil.getOptionId(id, option.label));
|
|
31
|
+
}), "data-no-focus": isDisabled(option) || undefined, id: optionId, key: optionId, tabIndex: -1, onMouseMove: () => {
|
|
32
|
+
if (!isActive) {
|
|
33
|
+
virtualFocus.moveFocusToElement(optionId);
|
|
34
34
|
setIsMouseLastUsedInputDevice(true);
|
|
35
35
|
}
|
|
36
36
|
}, onPointerUp: (event) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FilteredOptionsItem.js","sourceRoot":"","sources":["../../../../src/form/combobox/FilteredOptions/FilteredOptionsItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAChD,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,yBAAyB,EAAE,MAAM,2CAA2C,CAAC;AACtF,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,mBAAmB,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AAErE,MAAM,gBAAgB,GAAG,CAAC,IAAY,EAAE,UAAkB,EAAE,EAAE;IAC5D,MAAM,sBAAsB,GAAG,IAAI;SAChC,WAAW,EAAE;SACb,OAAO,CAAC,UAAU,CAAC,WAAW,EAAE,CAAC,CAAC;IACrC,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,sBAAsB,CAAC,CAAC;IACxD,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAC9B,sBAAsB,EACtB,sBAAsB,GAAG,UAAU,CAAC,MAAM,CAC3C,CAAC;IACF,MAAM,GAAG,GAAG,IAAI,CAAC,SAAS,CAAC,sBAAsB,GAAG,UAAU,CAAC,MAAM,CAAC,CAAC;IACvE,OAAO,CAAC,KAAK,EAAE,SAAS,EAAE,GAAG,CAAC,CAAC;AACjC,CAAC,CAAC;AAEF,MAAM,mBAAmB,GAAG,CAAC,EAAE,MAAM,EAA8B,EAAE,EAAE;IACrE,MAAM,EAAE,EAAE,EAAE,GAAG,YAAY,EAAE,CAAC;IAE9B,MAAM,EACJ,UAAU,EAAE,EAAE,EAAE,EAAE,EAClB,IAAI,EACJ,UAAU,GACX,GAAG,eAAe,EAAE,CAAC;IACtB,MAAM,EACJ,6BAA6B,EAC7B,gBAAgB,EAChB,iBAAiB,EACjB,YAAY,GACb,GAAG,yBAAyB,EAAE,CAAC;IAChC,MAAM,EAAE,aAAa,EAAE,WAAW,EAAE,eAAe,EAAE,YAAY,EAAE,GACjE,yBAAyB,EAAE,CAAC;IAC9B,MAAM,CAAC,KAAK,EAAE,SAAS,EAAE,GAAG,CAAC,GAAG,gBAAgB,CAAC,MAAM,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC;IAE3E,MAAM,UAAU,GAAG,CAAC,OAAuB,EAAE,EAAE,CAC7C,WAAW,CAAC,cAAc,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC;IAE1E,
|
|
1
|
+
{"version":3,"file":"FilteredOptionsItem.js","sourceRoot":"","sources":["../../../../src/form/combobox/FilteredOptions/FilteredOptionsItem.tsx"],"names":[],"mappings":"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"}
|
|
@@ -33,13 +33,13 @@ const FilteredOptionsProvider = ({ children, value: props, }) => {
|
|
|
33
33
|
const initialMap = Object.assign({ [filteredOptionsUtils.getAddNewOptionId(id)]: allowNewValues
|
|
34
34
|
? toComboboxOption(value)
|
|
35
35
|
: undefined }, customOptions.reduce((acc, customOption) => {
|
|
36
|
-
const _id = filteredOptionsUtils.getOptionId(id, customOption.
|
|
36
|
+
const _id = filteredOptionsUtils.getOptionId(id, customOption.value);
|
|
37
37
|
acc[_id] = customOption;
|
|
38
38
|
return acc;
|
|
39
39
|
}, {}));
|
|
40
40
|
// Add the options to the map
|
|
41
41
|
const finalMap = options.reduce((map, _option) => {
|
|
42
|
-
const _id = filteredOptionsUtils.getOptionId(id, _option.
|
|
42
|
+
const _id = filteredOptionsUtils.getOptionId(id, _option.value);
|
|
43
43
|
map[_id] = _option;
|
|
44
44
|
return map;
|
|
45
45
|
}, initialMap);
|
|
@@ -90,7 +90,7 @@ const FilteredOptionsProvider = ({ children, value: props, }) => {
|
|
|
90
90
|
}
|
|
91
91
|
else if (value || isLoading) {
|
|
92
92
|
if (shouldAutocomplete && filteredOptions[0]) {
|
|
93
|
-
activeOption = filteredOptionsUtils.getOptionId(id, filteredOptions[0].
|
|
93
|
+
activeOption = filteredOptionsUtils.getOptionId(id, filteredOptions[0].value);
|
|
94
94
|
}
|
|
95
95
|
else if (isListOpen && isLoading) {
|
|
96
96
|
activeOption = filteredOptionsUtils.getIsLoadingId(id);
|
|
@@ -4,6 +4,11 @@ interface TimelineClickablePeriodProps extends PeriodProps {
|
|
|
4
4
|
onSelectPeriod?: (e: React.MouseEvent<Element, MouseEvent> | React.KeyboardEvent<Element>) => void;
|
|
5
5
|
isActive?: boolean;
|
|
6
6
|
periodRef: React.ForwardedRef<HTMLButtonElement>;
|
|
7
|
+
/**
|
|
8
|
+
* Default orientation of popover
|
|
9
|
+
* @default "top"
|
|
10
|
+
*/
|
|
11
|
+
placement?: "top" | "bottom";
|
|
7
12
|
}
|
|
8
13
|
declare const ClickablePeriod: React.MemoExoticComponent<({ onSelectPeriod, start, end, status, cropped, direction, left, width, icon, children, isActive, statusLabel, restProps, periodRef, }: TimelineClickablePeriodProps) => React.JSX.Element>;
|
|
9
14
|
export default ClickablePeriod;
|
|
@@ -8,6 +8,7 @@ import { useRowContext } from "../hooks/useRowContext.js";
|
|
|
8
8
|
import { useTimelineContext } from "../hooks/useTimelineContext.js";
|
|
9
9
|
import { ariaLabel, getConditionalClasses } from "../utils/period.js";
|
|
10
10
|
const ClickablePeriod = React.memo(({ onSelectPeriod, start, end, status, cropped, direction, left, width, icon, children, isActive, statusLabel, restProps, periodRef, }) => {
|
|
11
|
+
var _a;
|
|
11
12
|
const { cn } = useRenameCSS();
|
|
12
13
|
const [open, setOpen] = useState(false);
|
|
13
14
|
const { index } = useRowContext();
|
|
@@ -18,7 +19,7 @@ const ClickablePeriod = React.memo(({ onSelectPeriod, start, end, status, croppe
|
|
|
18
19
|
const themeContext = useThemeInternal(false);
|
|
19
20
|
const showArrow = !themeContext;
|
|
20
21
|
const { context, placement, middlewareData: { arrow: { x: arrowX, y: arrowY } = {} }, refs, floatingStyles, } = useFloating({
|
|
21
|
-
placement: "top",
|
|
22
|
+
placement: (_a = restProps === null || restProps === void 0 ? void 0 : restProps.placement) !== null && _a !== void 0 ? _a : "top",
|
|
22
23
|
open,
|
|
23
24
|
onOpenChange: (_open) => setOpen(_open),
|
|
24
25
|
whileElementsMounted: autoUpdate,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ClickablePeriod.js","sourceRoot":"","sources":["../../../src/timeline/period/ClickablePeriod.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,oBAAoB,EACpB,UAAU,EACV,KAAK,IAAI,OAAO,EAChB,IAAI,EACJ,MAAM,EACN,WAAW,EACX,KAAK,EACL,UAAU,EACV,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,eAAe,EACf,OAAO,GACR,MAAM,oBAAoB,CAAC;AAC5B,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAC7D,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAC7D,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACvD,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,EAAE,SAAS,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"ClickablePeriod.js","sourceRoot":"","sources":["../../../src/timeline/period/ClickablePeriod.tsx"],"names":[],"mappings":"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"}
|
|
@@ -37,6 +37,11 @@ export interface TimelinePeriodProps extends React.HTMLAttributes<HTMLDivElement
|
|
|
37
37
|
* Make sure only one period is active at a time.
|
|
38
38
|
*/
|
|
39
39
|
isActive?: boolean;
|
|
40
|
+
/**
|
|
41
|
+
* Default orientation of popover
|
|
42
|
+
* @default "top"
|
|
43
|
+
*/
|
|
44
|
+
placement?: "top" | "bottom";
|
|
40
45
|
}
|
|
41
46
|
export interface PeriodType extends React.ForwardRefExoticComponent<TimelinePeriodProps & React.RefAttributes<HTMLDivElement | HTMLButtonElement>> {
|
|
42
47
|
componentType: TimelineComponentTypes;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/timeline/period/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAC7D,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAEvD,OAAO,eAAe,MAAM,mBAAmB,CAAC;AAChD,OAAO,kBAAkB,MAAM,sBAAsB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/timeline/period/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAC7D,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAEvD,OAAO,eAAe,MAAM,mBAAmB,CAAC;AAChD,OAAO,kBAAkB,MAAM,sBAAsB,CAAC;AAuDtD,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAC9B,CAAC,EAAE,IAAI,EAAuB,EAAE,GAAG,EAAE,EAAE;IACrC,MAAM,EAAE,OAAO,EAAE,GAAG,aAAa,EAAE,CAAC;IACpC,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAEnD,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,QAAQ,CAAC,CAAC;IAEtD,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,OAAO,yCAAK,CAAC;IACf,CAAC;IACD,MAAM,EACJ,KAAK,EACL,YAAY,EACZ,KAAK,EACL,kBAAkB,EAClB,MAAM,GAAG,SAAS,EAClB,cAAc,EACd,OAAO,EACP,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,WAAW,GACZ,GAAG,MAAM,CAAC;IAEX,OAAO,cAAc,IAAI,QAAQ,CAAC,CAAC,CAAC,CAClC,oBAAC,eAAe,IACd,SAAS,EAAE,GAA4C,EACvD,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,YAAY,EACjB,MAAM,EAAE,MAAM,EACd,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,OAAO,IAAI,EAAE,EACtB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,kBAAkB,EACxB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,IAEnB,QAAQ,CACO,CACnB,CAAC,CAAC,CAAC,CACF,oBAAC,kBAAkB,IACjB,SAAS,EAAE,GAAG,EACd,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,YAAY,EACjB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,IAAI,EAAE,EACtB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,kBAAkB,EACxB,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,GACpB,CACH,CAAC;AACJ,CAAC,CACY,CAAC;AAEhB,MAAM,CAAC,aAAa,GAAG,QAAQ,CAAC;AAEhC,eAAe,MAAM,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@navikt/ds-react",
|
|
3
|
-
"version": "7.
|
|
3
|
+
"version": "7.21.0",
|
|
4
4
|
"description": "React components from the Norwegian Labour and Welfare Administration.",
|
|
5
5
|
"author": "Aksel, a team part of the Norwegian Labour and Welfare Administration.",
|
|
6
6
|
"license": "MIT",
|
|
@@ -625,8 +625,8 @@
|
|
|
625
625
|
"dependencies": {
|
|
626
626
|
"@floating-ui/react": "0.25.4",
|
|
627
627
|
"@floating-ui/react-dom": "^2.0.9",
|
|
628
|
-
"@navikt/aksel-icons": "^7.
|
|
629
|
-
"@navikt/ds-tokens": "^7.
|
|
628
|
+
"@navikt/aksel-icons": "^7.21.0",
|
|
629
|
+
"@navikt/ds-tokens": "^7.21.0",
|
|
630
630
|
"clsx": "^2.1.0",
|
|
631
631
|
"date-fns": "^4.0.0",
|
|
632
632
|
"react-day-picker": "9.6.1"
|
|
@@ -634,14 +634,14 @@
|
|
|
634
634
|
"devDependencies": {
|
|
635
635
|
"@testing-library/dom": "10.4.0",
|
|
636
636
|
"@testing-library/jest-dom": "^6.6.3",
|
|
637
|
-
"@testing-library/react": "^16.
|
|
637
|
+
"@testing-library/react": "^16.3.0",
|
|
638
638
|
"@testing-library/user-event": "^14.5.2",
|
|
639
639
|
"@types/jscodeshift": "^0.11.11",
|
|
640
640
|
"aksel": "workspace:^",
|
|
641
641
|
"concurrently": "9.0.1",
|
|
642
642
|
"fast-glob": "3.2.11",
|
|
643
643
|
"jscodeshift": "^0.15.1",
|
|
644
|
-
"jsdom": "
|
|
644
|
+
"jsdom": "26.0.0",
|
|
645
645
|
"react-dom": "^18.0.0",
|
|
646
646
|
"react-router-dom": "^6.3.0",
|
|
647
647
|
"rimraf": "6.0.1",
|
package/src/chat/Bubble.tsx
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { HTMLAttributes, forwardRef } from "react";
|
|
2
2
|
import { useRenameCSS } from "../theme/Theme";
|
|
3
|
-
import { Detail } from "../typography";
|
|
3
|
+
import { Detail, Heading, HeadingProps } from "../typography";
|
|
4
4
|
|
|
5
5
|
export interface ChatBubbleProps extends HTMLAttributes<HTMLDivElement> {
|
|
6
6
|
/**
|
|
@@ -19,16 +19,34 @@ export interface ChatBubbleProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
19
19
|
* Overrides hoizontal position of toptext.
|
|
20
20
|
*/
|
|
21
21
|
toptextPosition?: "left" | "right";
|
|
22
|
+
/**
|
|
23
|
+
* The heading level for the toptext.
|
|
24
|
+
* @default "3"
|
|
25
|
+
*/
|
|
26
|
+
toptextHeadingLevel?: Exclude<HeadingProps["level"], "1">;
|
|
22
27
|
}
|
|
23
28
|
|
|
24
29
|
const Bubble = forwardRef<HTMLDivElement, ChatBubbleProps>(
|
|
25
|
-
(
|
|
30
|
+
(
|
|
31
|
+
{
|
|
32
|
+
children,
|
|
33
|
+
className,
|
|
34
|
+
name,
|
|
35
|
+
timestamp,
|
|
36
|
+
toptextPosition,
|
|
37
|
+
toptextHeadingLevel = "3",
|
|
38
|
+
...rest
|
|
39
|
+
},
|
|
40
|
+
ref,
|
|
41
|
+
) => {
|
|
26
42
|
const { cn } = useRenameCSS();
|
|
27
43
|
|
|
28
44
|
return (
|
|
29
45
|
<div ref={ref} className={cn("navds-chat__bubble", className)} {...rest}>
|
|
30
46
|
{(timestamp || name) && (
|
|
31
|
-
<
|
|
47
|
+
<Heading
|
|
48
|
+
size="xsmall"
|
|
49
|
+
level={toptextHeadingLevel}
|
|
32
50
|
className={cn(
|
|
33
51
|
`navds-chat__top-text`,
|
|
34
52
|
toptextPosition && `navds-chat__top-text--${toptextPosition}`,
|
|
@@ -41,7 +59,7 @@ const Bubble = forwardRef<HTMLDivElement, ChatBubbleProps>(
|
|
|
41
59
|
</Detail>
|
|
42
60
|
)}
|
|
43
61
|
{timestamp && <Detail as="span">{timestamp}</Detail>}
|
|
44
|
-
</
|
|
62
|
+
</Heading>
|
|
45
63
|
)}
|
|
46
64
|
{children}
|
|
47
65
|
</div>
|
package/src/chat/Chat.tsx
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { HTMLAttributes, forwardRef } from "react";
|
|
2
2
|
import { useRenameCSS } from "../theme/Theme";
|
|
3
|
-
import { BodyLong } from "../typography";
|
|
3
|
+
import { BodyLong, HeadingProps } from "../typography";
|
|
4
4
|
import Bubble from "./Bubble";
|
|
5
5
|
|
|
6
6
|
export const VARIANTS = ["subtle", "info", "neutral"] as const;
|
|
@@ -47,6 +47,11 @@ export interface ChatProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
47
47
|
* @default "medium"
|
|
48
48
|
*/
|
|
49
49
|
size?: (typeof SIZES)[number];
|
|
50
|
+
/**
|
|
51
|
+
* The heading level for the toptext.
|
|
52
|
+
* @default "3"
|
|
53
|
+
*/
|
|
54
|
+
toptextHeadingLevel?: Exclude<HeadingProps["level"], "1">;
|
|
50
55
|
}
|
|
51
56
|
|
|
52
57
|
interface ChatComponent
|
|
@@ -88,6 +93,7 @@ export const Chat = forwardRef<HTMLDivElement, ChatProps>(
|
|
|
88
93
|
variant = "neutral",
|
|
89
94
|
toptextPosition,
|
|
90
95
|
size = "medium",
|
|
96
|
+
toptextHeadingLevel = "3",
|
|
91
97
|
...rest
|
|
92
98
|
}: ChatProps,
|
|
93
99
|
ref,
|
|
@@ -120,6 +126,7 @@ export const Chat = forwardRef<HTMLDivElement, ChatProps>(
|
|
|
120
126
|
{React.cloneElement(child, {
|
|
121
127
|
name: name && i === 0 ? name : undefined,
|
|
122
128
|
timestamp: timestamp && i === 0 ? timestamp : undefined,
|
|
129
|
+
toptextHeadingLevel,
|
|
123
130
|
...child.props,
|
|
124
131
|
})}
|
|
125
132
|
</BodyLong>
|
|
@@ -43,29 +43,25 @@ const FilteredOptionsItem = ({ option }: { option: ComboboxOption }) => {
|
|
|
43
43
|
const isDisabled = (_option: ComboboxOption) =>
|
|
44
44
|
maxSelected.isLimitReached && !isInList(_option.value, selectedOptions);
|
|
45
45
|
|
|
46
|
+
const optionId = filteredOptionsUtil.getOptionId(id, option.value);
|
|
47
|
+
const isActive = activeDecendantId === optionId;
|
|
48
|
+
|
|
46
49
|
return (
|
|
47
50
|
<li
|
|
48
51
|
className={cn("navds-combobox__list-item", {
|
|
49
|
-
"navds-combobox__list-item--focus":
|
|
50
|
-
activeDecendantId ===
|
|
51
|
-
filteredOptionsUtil.getOptionId(id, option.label),
|
|
52
|
+
"navds-combobox__list-item--focus": isActive,
|
|
52
53
|
"navds-combobox__list-item--selected": isInList(
|
|
53
54
|
option.value,
|
|
54
55
|
selectedOptions,
|
|
55
56
|
),
|
|
56
57
|
})}
|
|
57
58
|
data-no-focus={isDisabled(option) || undefined}
|
|
58
|
-
id={
|
|
59
|
-
key={
|
|
59
|
+
id={optionId}
|
|
60
|
+
key={optionId}
|
|
60
61
|
tabIndex={-1}
|
|
61
62
|
onMouseMove={() => {
|
|
62
|
-
if (
|
|
63
|
-
|
|
64
|
-
filteredOptionsUtil.getOptionId(id, option.label)
|
|
65
|
-
) {
|
|
66
|
-
virtualFocus.moveFocusToElement(
|
|
67
|
-
filteredOptionsUtil.getOptionId(id, option.label),
|
|
68
|
-
);
|
|
63
|
+
if (!isActive) {
|
|
64
|
+
virtualFocus.moveFocusToElement(optionId);
|
|
69
65
|
setIsMouseLastUsedInputDevice(true);
|
|
70
66
|
}
|
|
71
67
|
}}
|
|
@@ -91,7 +91,7 @@ const FilteredOptionsProvider = ({
|
|
|
91
91
|
? toComboboxOption(value)
|
|
92
92
|
: undefined,
|
|
93
93
|
...customOptions.reduce((acc, customOption) => {
|
|
94
|
-
const _id = filteredOptionsUtils.getOptionId(id, customOption.
|
|
94
|
+
const _id = filteredOptionsUtils.getOptionId(id, customOption.value);
|
|
95
95
|
acc[_id] = customOption;
|
|
96
96
|
return acc;
|
|
97
97
|
}, {}),
|
|
@@ -99,7 +99,7 @@ const FilteredOptionsProvider = ({
|
|
|
99
99
|
|
|
100
100
|
// Add the options to the map
|
|
101
101
|
const finalMap = options.reduce((map, _option) => {
|
|
102
|
-
const _id = filteredOptionsUtils.getOptionId(id, _option.
|
|
102
|
+
const _id = filteredOptionsUtils.getOptionId(id, _option.value);
|
|
103
103
|
map[_id] = _option;
|
|
104
104
|
return map;
|
|
105
105
|
}, initialMap);
|
|
@@ -171,7 +171,7 @@ const FilteredOptionsProvider = ({
|
|
|
171
171
|
if (shouldAutocomplete && filteredOptions[0]) {
|
|
172
172
|
activeOption = filteredOptionsUtils.getOptionId(
|
|
173
173
|
id,
|
|
174
|
-
filteredOptions[0].
|
|
174
|
+
filteredOptions[0].value,
|
|
175
175
|
);
|
|
176
176
|
} else if (isListOpen && isLoading) {
|
|
177
177
|
activeOption = filteredOptionsUtils.getIsLoadingId(id);
|
|
@@ -29,6 +29,11 @@ interface TimelineClickablePeriodProps extends PeriodProps {
|
|
|
29
29
|
) => void;
|
|
30
30
|
isActive?: boolean;
|
|
31
31
|
periodRef: React.ForwardedRef<HTMLButtonElement>;
|
|
32
|
+
/**
|
|
33
|
+
* Default orientation of popover
|
|
34
|
+
* @default "top"
|
|
35
|
+
*/
|
|
36
|
+
placement?: "top" | "bottom";
|
|
32
37
|
}
|
|
33
38
|
|
|
34
39
|
const ClickablePeriod = React.memo(
|
|
@@ -66,7 +71,7 @@ const ClickablePeriod = React.memo(
|
|
|
66
71
|
refs,
|
|
67
72
|
floatingStyles,
|
|
68
73
|
} = useFloating({
|
|
69
|
-
placement: "top",
|
|
74
|
+
placement: restProps?.placement ?? "top",
|
|
70
75
|
open,
|
|
71
76
|
onOpenChange: (_open) => setOpen(_open),
|
|
72
77
|
whileElementsMounted: autoUpdate,
|
|
@@ -43,6 +43,11 @@ export interface TimelinePeriodProps
|
|
|
43
43
|
* Make sure only one period is active at a time.
|
|
44
44
|
*/
|
|
45
45
|
isActive?: boolean;
|
|
46
|
+
/**
|
|
47
|
+
* Default orientation of popover
|
|
48
|
+
* @default "top"
|
|
49
|
+
*/
|
|
50
|
+
placement?: "top" | "bottom";
|
|
46
51
|
}
|
|
47
52
|
|
|
48
53
|
export interface PeriodType
|
|
@@ -54,7 +59,7 @@ export interface PeriodType
|
|
|
54
59
|
}
|
|
55
60
|
|
|
56
61
|
export const Period = forwardRef<HTMLDivElement, TimelinePeriodProps>(
|
|
57
|
-
({ icon }, ref) => {
|
|
62
|
+
({ icon }: TimelinePeriodProps, ref) => {
|
|
58
63
|
const { periods } = useRowContext();
|
|
59
64
|
const { periodId, restProps } = usePeriodContext();
|
|
60
65
|
|