@flipdish/ui-library 0.31.8 → 0.32.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/dist/components/molecules/Carousel/hooks/useCarouselScroll.cjs +81 -0
- package/dist/components/molecules/Carousel/hooks/useCarouselScroll.cjs.map +1 -0
- package/dist/components/molecules/Carousel/hooks/useCarouselScroll.d.ts +46 -0
- package/dist/components/molecules/Carousel/hooks/useCarouselScroll.d.ts.map +1 -0
- package/dist/components/molecules/Carousel/hooks/useCarouselScroll.js +79 -0
- package/dist/components/molecules/Carousel/hooks/useCarouselScroll.js.map +1 -0
- package/dist/components/molecules/Carousel/index.cjs +8 -55
- package/dist/components/molecules/Carousel/index.cjs.map +1 -1
- package/dist/components/molecules/Carousel/index.d.ts +3 -7
- package/dist/components/molecules/Carousel/index.d.ts.map +1 -1
- package/dist/components/molecules/Carousel/index.js +9 -56
- package/dist/components/molecules/Carousel/index.js.map +1 -1
- package/dist/components/molecules/CodeSnippet/codeSnippet.utils.cjs +17 -0
- package/dist/components/molecules/CodeSnippet/codeSnippet.utils.cjs.map +1 -0
- package/dist/components/molecules/CodeSnippet/codeSnippet.utils.d.ts +8 -0
- package/dist/components/molecules/CodeSnippet/codeSnippet.utils.d.ts.map +1 -0
- package/dist/components/molecules/CodeSnippet/codeSnippet.utils.js +15 -0
- package/dist/components/molecules/CodeSnippet/codeSnippet.utils.js.map +1 -0
- package/dist/components/molecules/CodeSnippet/hooks/useCodeSnippetCollapse.cjs +29 -0
- package/dist/components/molecules/CodeSnippet/hooks/useCodeSnippetCollapse.cjs.map +1 -0
- package/dist/components/molecules/CodeSnippet/hooks/useCodeSnippetCollapse.d.ts +29 -0
- package/dist/components/molecules/CodeSnippet/hooks/useCodeSnippetCollapse.d.ts.map +1 -0
- package/dist/components/molecules/CodeSnippet/hooks/useCodeSnippetCollapse.js +27 -0
- package/dist/components/molecules/CodeSnippet/hooks/useCodeSnippetCollapse.js.map +1 -0
- package/dist/components/molecules/CodeSnippet/hooks/useCodeSnippetHighlight.cjs +23 -0
- package/dist/components/molecules/CodeSnippet/hooks/useCodeSnippetHighlight.cjs.map +1 -0
- package/dist/components/molecules/CodeSnippet/hooks/useCodeSnippetHighlight.d.ts +21 -0
- package/dist/components/molecules/CodeSnippet/hooks/useCodeSnippetHighlight.d.ts.map +1 -0
- package/dist/components/molecules/CodeSnippet/hooks/useCodeSnippetHighlight.js +21 -0
- package/dist/components/molecules/CodeSnippet/hooks/useCodeSnippetHighlight.js.map +1 -0
- package/dist/components/molecules/CodeSnippet/index.cjs +7 -22
- package/dist/components/molecules/CodeSnippet/index.cjs.map +1 -1
- package/dist/components/molecules/CodeSnippet/index.d.ts.map +1 -1
- package/dist/components/molecules/CodeSnippet/index.js +8 -23
- package/dist/components/molecules/CodeSnippet/index.js.map +1 -1
- package/dist/components/molecules/Dropdown/index.cjs +3 -2
- package/dist/components/molecules/Dropdown/index.cjs.map +1 -1
- package/dist/components/molecules/Dropdown/index.d.ts +9 -4
- package/dist/components/molecules/Dropdown/index.d.ts.map +1 -1
- package/dist/components/molecules/Dropdown/index.js +4 -3
- package/dist/components/molecules/Dropdown/index.js.map +1 -1
- package/dist/components/molecules/Tabs/index.cjs +1 -1
- package/dist/components/molecules/Tabs/index.cjs.map +1 -1
- package/dist/components/molecules/Tabs/index.js +1 -1
- package/dist/components/molecules/Tabs/index.js.map +1 -1
- package/dist/components/organisms/Charts/components/Metrics.cjs +1 -1
- package/dist/components/organisms/Charts/components/Metrics.cjs.map +1 -1
- package/dist/components/organisms/Charts/components/Metrics.js +1 -1
- package/dist/components/organisms/Charts/components/Metrics.js.map +1 -1
- package/dist/components/organisms/DatePicker/calendarCell.utils.cjs +53 -0
- package/dist/components/organisms/DatePicker/calendarCell.utils.cjs.map +1 -0
- package/dist/components/organisms/DatePicker/calendarCell.utils.d.ts +70 -0
- package/dist/components/organisms/DatePicker/calendarCell.utils.d.ts.map +1 -0
- package/dist/components/organisms/DatePicker/calendarCell.utils.js +49 -0
- package/dist/components/organisms/DatePicker/calendarCell.utils.js.map +1 -0
- package/dist/components/organisms/DatePicker/components/Cell.cjs +24 -30
- package/dist/components/organisms/DatePicker/components/Cell.cjs.map +1 -1
- package/dist/components/organisms/DatePicker/components/Cell.d.ts.map +1 -1
- package/dist/components/organisms/DatePicker/components/Cell.js +25 -31
- package/dist/components/organisms/DatePicker/components/Cell.js.map +1 -1
- package/dist/components/organisms/FileUpload/fileUpload.utils.cjs +69 -0
- package/dist/components/organisms/FileUpload/fileUpload.utils.cjs.map +1 -0
- package/dist/components/organisms/FileUpload/fileUpload.utils.d.ts +46 -0
- package/dist/components/organisms/FileUpload/fileUpload.utils.d.ts.map +1 -0
- package/dist/components/organisms/FileUpload/fileUpload.utils.js +65 -0
- package/dist/components/organisms/FileUpload/fileUpload.utils.js.map +1 -0
- package/dist/components/organisms/FileUpload/index.cjs +15 -66
- package/dist/components/organisms/FileUpload/index.cjs.map +1 -1
- package/dist/components/organisms/FileUpload/index.d.ts.map +1 -1
- package/dist/components/organisms/FileUpload/index.js +13 -64
- package/dist/components/organisms/FileUpload/index.js.map +1 -1
- package/dist/components/organisms/FilterBar/components/FilterDropdownMenu.cjs +8 -18
- package/dist/components/organisms/FilterBar/components/FilterDropdownMenu.cjs.map +1 -1
- package/dist/components/organisms/FilterBar/components/FilterDropdownMenu.d.ts +8 -22
- package/dist/components/organisms/FilterBar/components/FilterDropdownMenu.d.ts.map +1 -1
- package/dist/components/organisms/FilterBar/components/FilterDropdownMenu.js +10 -20
- package/dist/components/organisms/FilterBar/components/FilterDropdownMenu.js.map +1 -1
- package/dist/components/organisms/FilterBar/index.cjs +2 -18
- package/dist/components/organisms/FilterBar/index.cjs.map +1 -1
- package/dist/components/organisms/FilterBar/index.d.ts +4 -25
- package/dist/components/organisms/FilterBar/index.d.ts.map +1 -1
- package/dist/components/organisms/FilterBar/index.js +3 -19
- package/dist/components/organisms/FilterBar/index.js.map +1 -1
- package/dist/components/organisms/PageHeader/index.cjs +1 -1
- package/dist/components/organisms/PageHeader/index.cjs.map +1 -1
- package/dist/components/organisms/PageHeader/index.d.ts +2 -2
- package/dist/components/organisms/PageHeader/index.js +1 -1
- package/dist/components/organisms/PageHeader/index.js.map +1 -1
- package/dist/components/organisms/Table/index.cjs +1 -1
- package/dist/components/organisms/Table/index.cjs.map +1 -1
- package/dist/components/organisms/Table/index.js +1 -1
- package/dist/components/organisms/Table/index.js.map +1 -1
- package/dist/components/organisms/TreeView/index.cjs +11 -26
- package/dist/components/organisms/TreeView/index.cjs.map +1 -1
- package/dist/components/organisms/TreeView/index.d.ts.map +1 -1
- package/dist/components/organisms/TreeView/index.js +12 -27
- package/dist/components/organisms/TreeView/index.js.map +1 -1
- package/dist/components/organisms/TreeView/treeView.utils.cjs +40 -0
- package/dist/components/organisms/TreeView/treeView.utils.cjs.map +1 -1
- package/dist/components/organisms/TreeView/treeView.utils.d.ts +37 -0
- package/dist/components/organisms/TreeView/treeView.utils.d.ts.map +1 -1
- package/dist/components/organisms/TreeView/treeView.utils.js +39 -1
- package/dist/components/organisms/TreeView/treeView.utils.js.map +1 -1
- package/package.json +2 -2
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var useEmblaCarousel = require('embla-carousel-react');
|
|
4
|
+
var React = require('react');
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* Owns Embla's scroll position for `Carousel`: which snap is selected, whether previous and next
|
|
8
|
+
* are available, and the arrow keys that move between slides.
|
|
9
|
+
*
|
|
10
|
+
* @param options Embla setup for this carousel. The scroll axis comes from `orientation`, not `opts.axis`.
|
|
11
|
+
* @returns The viewport ref, Embla API, scroll actions, derived scroll state, and the keydown handler.
|
|
12
|
+
*/
|
|
13
|
+
const useCarouselScroll = ({ orientation, opts, plugins, setApi }) => {
|
|
14
|
+
const [carouselRef, api] = useEmblaCarousel({
|
|
15
|
+
...opts,
|
|
16
|
+
axis: orientation === 'horizontal' ? 'x' : 'y',
|
|
17
|
+
}, plugins);
|
|
18
|
+
const [canScrollPrev, setCanScrollPrev] = React.useState(false);
|
|
19
|
+
const [canScrollNext, setCanScrollNext] = React.useState(false);
|
|
20
|
+
const [selectedIndex, setSelectedIndex] = React.useState(0);
|
|
21
|
+
const [scrollSnaps, setScrollSnaps] = React.useState([]);
|
|
22
|
+
const onInit = React.useCallback((api) => {
|
|
23
|
+
if (!api)
|
|
24
|
+
return;
|
|
25
|
+
setScrollSnaps(api.scrollSnapList());
|
|
26
|
+
}, []);
|
|
27
|
+
const onSelect = React.useCallback((api) => {
|
|
28
|
+
if (!api)
|
|
29
|
+
return;
|
|
30
|
+
setCanScrollPrev(api.canScrollPrev());
|
|
31
|
+
setCanScrollNext(api.canScrollNext());
|
|
32
|
+
setSelectedIndex(api.selectedScrollSnap());
|
|
33
|
+
}, []);
|
|
34
|
+
const scrollPrev = React.useCallback(() => {
|
|
35
|
+
api?.scrollPrev();
|
|
36
|
+
}, [api]);
|
|
37
|
+
const scrollNext = React.useCallback(() => {
|
|
38
|
+
api?.scrollNext();
|
|
39
|
+
}, [api]);
|
|
40
|
+
const onKeyDownCapture = React.useCallback((event) => {
|
|
41
|
+
if (event.key === 'ArrowLeft') {
|
|
42
|
+
event.preventDefault();
|
|
43
|
+
scrollPrev();
|
|
44
|
+
}
|
|
45
|
+
else if (event.key === 'ArrowRight') {
|
|
46
|
+
event.preventDefault();
|
|
47
|
+
scrollNext();
|
|
48
|
+
}
|
|
49
|
+
}, [scrollPrev, scrollNext]);
|
|
50
|
+
React.useEffect(() => {
|
|
51
|
+
if (!api || !setApi)
|
|
52
|
+
return;
|
|
53
|
+
setApi(api);
|
|
54
|
+
}, [api, setApi]);
|
|
55
|
+
React.useEffect(() => {
|
|
56
|
+
if (!api)
|
|
57
|
+
return;
|
|
58
|
+
onInit(api);
|
|
59
|
+
onSelect(api);
|
|
60
|
+
api.on('reInit', onInit);
|
|
61
|
+
api.on('reInit', onSelect);
|
|
62
|
+
api.on('select', onSelect);
|
|
63
|
+
return () => {
|
|
64
|
+
api?.off('select', onSelect);
|
|
65
|
+
};
|
|
66
|
+
}, [api, onInit, onSelect]);
|
|
67
|
+
return {
|
|
68
|
+
carouselRef,
|
|
69
|
+
api,
|
|
70
|
+
scrollPrev,
|
|
71
|
+
scrollNext,
|
|
72
|
+
canScrollPrev,
|
|
73
|
+
canScrollNext,
|
|
74
|
+
selectedIndex,
|
|
75
|
+
scrollSnaps,
|
|
76
|
+
onKeyDownCapture,
|
|
77
|
+
};
|
|
78
|
+
};
|
|
79
|
+
|
|
80
|
+
exports.useCarouselScroll = useCarouselScroll;
|
|
81
|
+
//# sourceMappingURL=useCarouselScroll.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useCarouselScroll.cjs","sources":["../../../../../src/components/molecules/Carousel/hooks/useCarouselScroll.ts"],"sourcesContent":[null],"names":["useState","useCallback","useEffect"],"mappings":";;;;;AA2CA;;;;;;AAMG;AACI,MAAM,iBAAiB,GAAG,CAAC,EAAE,WAAW,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAA4B,KAA6B;AAC7H,IAAA,MAAM,CAAC,WAAW,EAAE,GAAG,CAAC,GAAG,gBAAgB,CACzC;AACE,QAAA,GAAG,IAAI;QACP,IAAI,EAAE,WAAW,KAAK,YAAY,GAAG,GAAG,GAAG,GAAG;KAC/C,EACD,OAAO,CACR;IACD,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAGA,cAAQ,CAAC,KAAK,CAAC;IACzD,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAGA,cAAQ,CAAC,KAAK,CAAC;IACzD,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAGA,cAAQ,CAAC,CAAC,CAAC;IACrD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAGA,cAAQ,CAAW,EAAE,CAAC;AAE5D,IAAA,MAAM,MAAM,GAAGC,iBAAW,CAAC,CAAC,GAAgB,KAAI;AAC9C,QAAA,IAAI,CAAC,GAAG;YAAE;AAEV,QAAA,cAAc,CAAC,GAAG,CAAC,cAAc,EAAE,CAAC;IACtC,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,MAAM,QAAQ,GAAGA,iBAAW,CAAC,CAAC,GAAgB,KAAI;AAChD,QAAA,IAAI,CAAC,GAAG;YAAE;AAEV,QAAA,gBAAgB,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;AACrC,QAAA,gBAAgB,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;AACrC,QAAA,gBAAgB,CAAC,GAAG,CAAC,kBAAkB,EAAE,CAAC;IAC5C,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,MAAM,UAAU,GAAGA,iBAAW,CAAC,MAAK;QAClC,GAAG,EAAE,UAAU,EAAE;AACnB,IAAA,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;AAET,IAAA,MAAM,UAAU,GAAGA,iBAAW,CAAC,MAAK;QAClC,GAAG,EAAE,UAAU,EAAE;AACnB,IAAA,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;AAET,IAAA,MAAM,gBAAgB,GAAGA,iBAAW,CAClC,CAAC,KAAoC,KAAI;AACvC,QAAA,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,EAAE;YAC7B,KAAK,CAAC,cAAc,EAAE;AACtB,YAAA,UAAU,EAAE;QACd;AAAO,aAAA,IAAI,KAAK,CAAC,GAAG,KAAK,YAAY,EAAE;YACrC,KAAK,CAAC,cAAc,EAAE;AACtB,YAAA,UAAU,EAAE;QACd;AACF,IAAA,CAAC,EACD,CAAC,UAAU,EAAE,UAAU,CAAC,CACzB;IAEDC,eAAS,CAAC,MAAK;AACb,QAAA,IAAI,CAAC,GAAG,IAAI,CAAC,MAAM;YAAE;QAErB,MAAM,CAAC,GAAG,CAAC;AACb,IAAA,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC;IAEjBA,eAAS,CAAC,MAAK;AACb,QAAA,IAAI,CAAC,GAAG;YAAE;QAEV,MAAM,CAAC,GAAG,CAAC;QACX,QAAQ,CAAC,GAAG,CAAC;AAEb,QAAA,GAAG,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,CAAC;AACxB,QAAA,GAAG,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;AAC1B,QAAA,GAAG,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;AAE1B,QAAA,OAAO,MAAK;AACV,YAAA,GAAG,EAAE,GAAG,CAAC,QAAQ,EAAE,QAAQ,CAAC;AAC9B,QAAA,CAAC;IACH,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAC;IAE3B,OAAO;QACL,WAAW;QACX,GAAG;QACH,UAAU;QACV,UAAU;QACV,aAAa;QACb,aAAa;QACb,aAAa;QACb,WAAW;QACX,gBAAgB;KACjB;AACH;;"}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import useEmblaCarousel, { type UseEmblaCarouselType } from 'embla-carousel-react';
|
|
2
|
+
import type { KeyboardEvent } from 'react';
|
|
3
|
+
export type CarouselApi = UseEmblaCarouselType[1];
|
|
4
|
+
type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
|
|
5
|
+
export type CarouselOptions = UseCarouselParameters[0];
|
|
6
|
+
export type CarouselPlugin = UseCarouselParameters[1];
|
|
7
|
+
export interface UseCarouselScrollOptions {
|
|
8
|
+
/** Scroll axis. `horizontal` maps to Embla's `x`; `vertical` maps to `y` and overrides `opts.axis`. */
|
|
9
|
+
orientation: 'horizontal' | 'vertical';
|
|
10
|
+
/** Embla options, merged under the axis taken from `orientation`. */
|
|
11
|
+
opts?: CarouselOptions;
|
|
12
|
+
/** Embla plugins, forwarded unchanged. */
|
|
13
|
+
plugins?: CarouselPlugin;
|
|
14
|
+
/** Receives the Embla API once it exists, including when this callback's identity changes. */
|
|
15
|
+
setApi?: (api: CarouselApi) => void;
|
|
16
|
+
}
|
|
17
|
+
export interface UseCarouselScrollResult {
|
|
18
|
+
/** Ref for the Embla viewport element. */
|
|
19
|
+
carouselRef: UseEmblaCarouselType[0];
|
|
20
|
+
/** Embla API once the viewport is mounted, otherwise `undefined`. */
|
|
21
|
+
api: CarouselApi;
|
|
22
|
+
/** Scrolls to the previous snap. No-op while `api` is missing. */
|
|
23
|
+
scrollPrev: () => void;
|
|
24
|
+
/** Scrolls to the next snap. No-op while `api` is missing. */
|
|
25
|
+
scrollNext: () => void;
|
|
26
|
+
/** Whether Embla can scroll to a previous snap. */
|
|
27
|
+
canScrollPrev: boolean;
|
|
28
|
+
/** Whether Embla can scroll to a next snap. */
|
|
29
|
+
canScrollNext: boolean;
|
|
30
|
+
/** Index of the selected snap. `0` until Embla reports one. */
|
|
31
|
+
selectedIndex: number;
|
|
32
|
+
/** Snap positions reported by Embla. Empty until init. */
|
|
33
|
+
scrollSnaps: number[];
|
|
34
|
+
/** ArrowLeft and ArrowRight move between snaps; other keys are ignored. */
|
|
35
|
+
onKeyDownCapture: (event: KeyboardEvent<HTMLDivElement>) => void;
|
|
36
|
+
}
|
|
37
|
+
/**
|
|
38
|
+
* Owns Embla's scroll position for `Carousel`: which snap is selected, whether previous and next
|
|
39
|
+
* are available, and the arrow keys that move between slides.
|
|
40
|
+
*
|
|
41
|
+
* @param options Embla setup for this carousel. The scroll axis comes from `orientation`, not `opts.axis`.
|
|
42
|
+
* @returns The viewport ref, Embla API, scroll actions, derived scroll state, and the keydown handler.
|
|
43
|
+
*/
|
|
44
|
+
export declare const useCarouselScroll: ({ orientation, opts, plugins, setApi }: UseCarouselScrollOptions) => UseCarouselScrollResult;
|
|
45
|
+
export {};
|
|
46
|
+
//# sourceMappingURL=useCarouselScroll.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useCarouselScroll.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Carousel/hooks/useCarouselScroll.ts"],"names":[],"mappings":"AAEA,OAAO,gBAAgB,EAAE,EAAE,KAAK,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AACnF,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAG3C,MAAM,MAAM,WAAW,GAAG,oBAAoB,CAAC,CAAC,CAAC,CAAC;AAClD,KAAK,qBAAqB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AACjE,MAAM,MAAM,eAAe,GAAG,qBAAqB,CAAC,CAAC,CAAC,CAAC;AACvD,MAAM,MAAM,cAAc,GAAG,qBAAqB,CAAC,CAAC,CAAC,CAAC;AAEtD,MAAM,WAAW,wBAAwB;IACvC,uGAAuG;IACvG,WAAW,EAAE,YAAY,GAAG,UAAU,CAAC;IACvC,qEAAqE;IACrE,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,0CAA0C;IAC1C,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,8FAA8F;IAC9F,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE,WAAW,KAAK,IAAI,CAAC;CACrC;AAED,MAAM,WAAW,uBAAuB;IACtC,0CAA0C;IAC1C,WAAW,EAAE,oBAAoB,CAAC,CAAC,CAAC,CAAC;IACrC,qEAAqE;IACrE,GAAG,EAAE,WAAW,CAAC;IACjB,kEAAkE;IAClE,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,8DAA8D;IAC9D,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,mDAAmD;IACnD,aAAa,EAAE,OAAO,CAAC;IACvB,+CAA+C;IAC/C,aAAa,EAAE,OAAO,CAAC;IACvB,+DAA+D;IAC/D,aAAa,EAAE,MAAM,CAAC;IACtB,0DAA0D;IAC1D,WAAW,EAAE,MAAM,EAAE,CAAC;IACtB,2EAA2E;IAC3E,gBAAgB,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;CAClE;AAED;;;;;;GAMG;AACH,eAAO,MAAM,iBAAiB,GAAI,wCAAwC,wBAAwB,KAAG,uBAgFpG,CAAC"}
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
import useEmblaCarousel from 'embla-carousel-react';
|
|
2
|
+
import { useState, useCallback, useEffect } from 'react';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* Owns Embla's scroll position for `Carousel`: which snap is selected, whether previous and next
|
|
6
|
+
* are available, and the arrow keys that move between slides.
|
|
7
|
+
*
|
|
8
|
+
* @param options Embla setup for this carousel. The scroll axis comes from `orientation`, not `opts.axis`.
|
|
9
|
+
* @returns The viewport ref, Embla API, scroll actions, derived scroll state, and the keydown handler.
|
|
10
|
+
*/
|
|
11
|
+
const useCarouselScroll = ({ orientation, opts, plugins, setApi }) => {
|
|
12
|
+
const [carouselRef, api] = useEmblaCarousel({
|
|
13
|
+
...opts,
|
|
14
|
+
axis: orientation === 'horizontal' ? 'x' : 'y',
|
|
15
|
+
}, plugins);
|
|
16
|
+
const [canScrollPrev, setCanScrollPrev] = useState(false);
|
|
17
|
+
const [canScrollNext, setCanScrollNext] = useState(false);
|
|
18
|
+
const [selectedIndex, setSelectedIndex] = useState(0);
|
|
19
|
+
const [scrollSnaps, setScrollSnaps] = useState([]);
|
|
20
|
+
const onInit = useCallback((api) => {
|
|
21
|
+
if (!api)
|
|
22
|
+
return;
|
|
23
|
+
setScrollSnaps(api.scrollSnapList());
|
|
24
|
+
}, []);
|
|
25
|
+
const onSelect = useCallback((api) => {
|
|
26
|
+
if (!api)
|
|
27
|
+
return;
|
|
28
|
+
setCanScrollPrev(api.canScrollPrev());
|
|
29
|
+
setCanScrollNext(api.canScrollNext());
|
|
30
|
+
setSelectedIndex(api.selectedScrollSnap());
|
|
31
|
+
}, []);
|
|
32
|
+
const scrollPrev = useCallback(() => {
|
|
33
|
+
api?.scrollPrev();
|
|
34
|
+
}, [api]);
|
|
35
|
+
const scrollNext = useCallback(() => {
|
|
36
|
+
api?.scrollNext();
|
|
37
|
+
}, [api]);
|
|
38
|
+
const onKeyDownCapture = useCallback((event) => {
|
|
39
|
+
if (event.key === 'ArrowLeft') {
|
|
40
|
+
event.preventDefault();
|
|
41
|
+
scrollPrev();
|
|
42
|
+
}
|
|
43
|
+
else if (event.key === 'ArrowRight') {
|
|
44
|
+
event.preventDefault();
|
|
45
|
+
scrollNext();
|
|
46
|
+
}
|
|
47
|
+
}, [scrollPrev, scrollNext]);
|
|
48
|
+
useEffect(() => {
|
|
49
|
+
if (!api || !setApi)
|
|
50
|
+
return;
|
|
51
|
+
setApi(api);
|
|
52
|
+
}, [api, setApi]);
|
|
53
|
+
useEffect(() => {
|
|
54
|
+
if (!api)
|
|
55
|
+
return;
|
|
56
|
+
onInit(api);
|
|
57
|
+
onSelect(api);
|
|
58
|
+
api.on('reInit', onInit);
|
|
59
|
+
api.on('reInit', onSelect);
|
|
60
|
+
api.on('select', onSelect);
|
|
61
|
+
return () => {
|
|
62
|
+
api?.off('select', onSelect);
|
|
63
|
+
};
|
|
64
|
+
}, [api, onInit, onSelect]);
|
|
65
|
+
return {
|
|
66
|
+
carouselRef,
|
|
67
|
+
api,
|
|
68
|
+
scrollPrev,
|
|
69
|
+
scrollNext,
|
|
70
|
+
canScrollPrev,
|
|
71
|
+
canScrollNext,
|
|
72
|
+
selectedIndex,
|
|
73
|
+
scrollSnaps,
|
|
74
|
+
onKeyDownCapture,
|
|
75
|
+
};
|
|
76
|
+
};
|
|
77
|
+
|
|
78
|
+
export { useCarouselScroll };
|
|
79
|
+
//# sourceMappingURL=useCarouselScroll.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useCarouselScroll.js","sources":["../../../../../src/components/molecules/Carousel/hooks/useCarouselScroll.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}
|
|
@@ -4,8 +4,8 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var Dot = require('@flipdish/ui-library/components/atoms/Dot');
|
|
5
5
|
var cx = require('@flipdish/ui-library/utilities/cx');
|
|
6
6
|
var testIdUtils = require('@flipdish/ui-library/utilities/testIdUtils');
|
|
7
|
-
var useEmblaCarousel = require('embla-carousel-react');
|
|
8
7
|
var React = require('react');
|
|
8
|
+
var useCarouselScroll = require('./hooks/useCarouselScroll.cjs');
|
|
9
9
|
|
|
10
10
|
const CarouselContext = React.createContext(null);
|
|
11
11
|
const useCarousel = () => {
|
|
@@ -17,59 +17,12 @@ const useCarousel = () => {
|
|
|
17
17
|
};
|
|
18
18
|
const CarouselRoot = ({ orientation = 'horizontal', opts, setApi, plugins, className, children, 'data-testid': dataTestId, ...props }) => {
|
|
19
19
|
const rootTestId = testIdUtils.useResolvedTestId({ testId: dataTestId, segment: 'carousel', rootName: 'carousel' });
|
|
20
|
-
const
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
const [selectedIndex, setSelectedIndex] = React.useState(0);
|
|
27
|
-
const [scrollSnaps, setScrollSnaps] = React.useState([]);
|
|
28
|
-
const onInit = React.useCallback((api) => {
|
|
29
|
-
if (!api)
|
|
30
|
-
return;
|
|
31
|
-
setScrollSnaps(api.scrollSnapList());
|
|
32
|
-
}, []);
|
|
33
|
-
const onSelect = React.useCallback((api) => {
|
|
34
|
-
if (!api)
|
|
35
|
-
return;
|
|
36
|
-
setCanScrollPrev(api.canScrollPrev());
|
|
37
|
-
setCanScrollNext(api.canScrollNext());
|
|
38
|
-
setSelectedIndex(api.selectedScrollSnap());
|
|
39
|
-
}, []);
|
|
40
|
-
const scrollPrev = React.useCallback(() => {
|
|
41
|
-
api?.scrollPrev();
|
|
42
|
-
}, [api]);
|
|
43
|
-
const scrollNext = React.useCallback(() => {
|
|
44
|
-
api?.scrollNext();
|
|
45
|
-
}, [api]);
|
|
46
|
-
const handleKeyDown = React.useCallback((event) => {
|
|
47
|
-
if (event.key === 'ArrowLeft') {
|
|
48
|
-
event.preventDefault();
|
|
49
|
-
scrollPrev();
|
|
50
|
-
}
|
|
51
|
-
else if (event.key === 'ArrowRight') {
|
|
52
|
-
event.preventDefault();
|
|
53
|
-
scrollNext();
|
|
54
|
-
}
|
|
55
|
-
}, [scrollPrev, scrollNext]);
|
|
56
|
-
React.useEffect(() => {
|
|
57
|
-
if (!api || !setApi)
|
|
58
|
-
return;
|
|
59
|
-
setApi(api);
|
|
60
|
-
}, [api, setApi]);
|
|
61
|
-
React.useEffect(() => {
|
|
62
|
-
if (!api)
|
|
63
|
-
return;
|
|
64
|
-
onInit(api);
|
|
65
|
-
onSelect(api);
|
|
66
|
-
api.on('reInit', onInit);
|
|
67
|
-
api.on('reInit', onSelect);
|
|
68
|
-
api.on('select', onSelect);
|
|
69
|
-
return () => {
|
|
70
|
-
api?.off('select', onSelect);
|
|
71
|
-
};
|
|
72
|
-
}, [api, onInit, onSelect]);
|
|
20
|
+
const { carouselRef, api, scrollPrev, scrollNext, canScrollPrev, canScrollNext, selectedIndex, scrollSnaps, onKeyDownCapture } = useCarouselScroll.useCarouselScroll({
|
|
21
|
+
orientation,
|
|
22
|
+
opts,
|
|
23
|
+
plugins,
|
|
24
|
+
setApi,
|
|
25
|
+
});
|
|
73
26
|
return (jsxRuntime.jsx(testIdUtils.TestIdProvider, { value: rootTestId, children: jsxRuntime.jsx(CarouselContext.Provider, { value: {
|
|
74
27
|
carouselRef,
|
|
75
28
|
api: api,
|
|
@@ -81,7 +34,7 @@ const CarouselRoot = ({ orientation = 'horizontal', opts, setApi, plugins, class
|
|
|
81
34
|
canScrollNext,
|
|
82
35
|
selectedIndex,
|
|
83
36
|
scrollSnaps,
|
|
84
|
-
}, children: jsxRuntime.jsx("div", { onKeyDownCapture:
|
|
37
|
+
}, children: jsxRuntime.jsx("div", { onKeyDownCapture: onKeyDownCapture, className: cx.cx('relative', className), role: "region", "aria-roledescription": "carousel", ...props, "data-testid": rootTestId, children: children }) }) }));
|
|
85
38
|
};
|
|
86
39
|
const CarouselContent = ({ className, overflowHidden = true, ...props }) => {
|
|
87
40
|
const { carouselRef, orientation } = useCarousel();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../../../../src/components/molecules/Carousel/index.tsx"],"sourcesContent":[null],"names":["createContext","useContext","useResolvedTestId","
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../../src/components/molecules/Carousel/index.tsx"],"sourcesContent":[null],"names":["createContext","useContext","useResolvedTestId","useCarouselScroll","_jsx","TestIdProvider","cx","useTestIdPrefix","joinTestId","_Fragment","isValidElement","cloneElement","Dot"],"mappings":"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"}
|
|
@@ -1,9 +1,5 @@
|
|
|
1
|
-
import useEmblaCarousel, { type UseEmblaCarouselType } from 'embla-carousel-react';
|
|
2
1
|
import type { ComponentPropsWithRef, CSSProperties, HTMLAttributes, ReactNode, Ref } from 'react';
|
|
3
|
-
type CarouselApi
|
|
4
|
-
type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
|
|
5
|
-
type CarouselOptions = UseCarouselParameters[0];
|
|
6
|
-
type CarouselPlugin = UseCarouselParameters[1];
|
|
2
|
+
import { type CarouselApi, type CarouselOptions, type CarouselPlugin, useCarouselScroll } from './hooks/useCarouselScroll';
|
|
7
3
|
type CarouselProps = {
|
|
8
4
|
/** The options for the Embla carousel. */
|
|
9
5
|
opts?: CarouselOptions;
|
|
@@ -18,9 +14,9 @@ type CarouselProps = {
|
|
|
18
14
|
};
|
|
19
15
|
type CarouselContextProps = CarouselProps & {
|
|
20
16
|
/** The ref of the carousel. */
|
|
21
|
-
carouselRef: ReturnType<typeof
|
|
17
|
+
carouselRef: ReturnType<typeof useCarouselScroll>['carouselRef'];
|
|
22
18
|
/** The API of the carousel. */
|
|
23
|
-
api: ReturnType<typeof
|
|
19
|
+
api: ReturnType<typeof useCarouselScroll>['api'];
|
|
24
20
|
/** The function to scroll the carousel to the previous slide. */
|
|
25
21
|
scrollPrev: () => void;
|
|
26
22
|
/** The function to scroll the carousel to the next slide. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/Carousel/index.tsx"],"names":[],"mappings":"AAKA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/Carousel/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -2,8 +2,8 @@ import { jsx, Fragment } from 'react/jsx-runtime';
|
|
|
2
2
|
import { Dot } from '@flipdish/ui-library/components/atoms/Dot';
|
|
3
3
|
import { cx } from '@flipdish/ui-library/utilities/cx';
|
|
4
4
|
import { useTestIdPrefix, joinTestId, useResolvedTestId, TestIdProvider } from '@flipdish/ui-library/utilities/testIdUtils';
|
|
5
|
-
import
|
|
6
|
-
import {
|
|
5
|
+
import { createContext, isValidElement, cloneElement, useContext } from 'react';
|
|
6
|
+
import { useCarouselScroll } from './hooks/useCarouselScroll.js';
|
|
7
7
|
|
|
8
8
|
const CarouselContext = createContext(null);
|
|
9
9
|
const useCarousel = () => {
|
|
@@ -15,59 +15,12 @@ const useCarousel = () => {
|
|
|
15
15
|
};
|
|
16
16
|
const CarouselRoot = ({ orientation = 'horizontal', opts, setApi, plugins, className, children, 'data-testid': dataTestId, ...props }) => {
|
|
17
17
|
const rootTestId = useResolvedTestId({ testId: dataTestId, segment: 'carousel', rootName: 'carousel' });
|
|
18
|
-
const
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
const [selectedIndex, setSelectedIndex] = useState(0);
|
|
25
|
-
const [scrollSnaps, setScrollSnaps] = useState([]);
|
|
26
|
-
const onInit = useCallback((api) => {
|
|
27
|
-
if (!api)
|
|
28
|
-
return;
|
|
29
|
-
setScrollSnaps(api.scrollSnapList());
|
|
30
|
-
}, []);
|
|
31
|
-
const onSelect = useCallback((api) => {
|
|
32
|
-
if (!api)
|
|
33
|
-
return;
|
|
34
|
-
setCanScrollPrev(api.canScrollPrev());
|
|
35
|
-
setCanScrollNext(api.canScrollNext());
|
|
36
|
-
setSelectedIndex(api.selectedScrollSnap());
|
|
37
|
-
}, []);
|
|
38
|
-
const scrollPrev = useCallback(() => {
|
|
39
|
-
api?.scrollPrev();
|
|
40
|
-
}, [api]);
|
|
41
|
-
const scrollNext = useCallback(() => {
|
|
42
|
-
api?.scrollNext();
|
|
43
|
-
}, [api]);
|
|
44
|
-
const handleKeyDown = useCallback((event) => {
|
|
45
|
-
if (event.key === 'ArrowLeft') {
|
|
46
|
-
event.preventDefault();
|
|
47
|
-
scrollPrev();
|
|
48
|
-
}
|
|
49
|
-
else if (event.key === 'ArrowRight') {
|
|
50
|
-
event.preventDefault();
|
|
51
|
-
scrollNext();
|
|
52
|
-
}
|
|
53
|
-
}, [scrollPrev, scrollNext]);
|
|
54
|
-
useEffect(() => {
|
|
55
|
-
if (!api || !setApi)
|
|
56
|
-
return;
|
|
57
|
-
setApi(api);
|
|
58
|
-
}, [api, setApi]);
|
|
59
|
-
useEffect(() => {
|
|
60
|
-
if (!api)
|
|
61
|
-
return;
|
|
62
|
-
onInit(api);
|
|
63
|
-
onSelect(api);
|
|
64
|
-
api.on('reInit', onInit);
|
|
65
|
-
api.on('reInit', onSelect);
|
|
66
|
-
api.on('select', onSelect);
|
|
67
|
-
return () => {
|
|
68
|
-
api?.off('select', onSelect);
|
|
69
|
-
};
|
|
70
|
-
}, [api, onInit, onSelect]);
|
|
18
|
+
const { carouselRef, api, scrollPrev, scrollNext, canScrollPrev, canScrollNext, selectedIndex, scrollSnaps, onKeyDownCapture } = useCarouselScroll({
|
|
19
|
+
orientation,
|
|
20
|
+
opts,
|
|
21
|
+
plugins,
|
|
22
|
+
setApi,
|
|
23
|
+
});
|
|
71
24
|
return (jsx(TestIdProvider, { value: rootTestId, children: jsx(CarouselContext.Provider, { value: {
|
|
72
25
|
carouselRef,
|
|
73
26
|
api: api,
|
|
@@ -79,7 +32,7 @@ const CarouselRoot = ({ orientation = 'horizontal', opts, setApi, plugins, class
|
|
|
79
32
|
canScrollNext,
|
|
80
33
|
selectedIndex,
|
|
81
34
|
scrollSnaps,
|
|
82
|
-
}, children: jsx("div", { onKeyDownCapture:
|
|
35
|
+
}, children: jsx("div", { onKeyDownCapture: onKeyDownCapture, className: cx('relative', className), role: "region", "aria-roledescription": "carousel", ...props, "data-testid": rootTestId, children: children }) }) }));
|
|
83
36
|
};
|
|
84
37
|
const CarouselContent = ({ className, overflowHidden = true, ...props }) => {
|
|
85
38
|
const { carouselRef, orientation } = useCarousel();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/molecules/Carousel/index.tsx"],"sourcesContent":[null],"names":["_jsx","_Fragment"],"mappings":";;;;;;;
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/molecules/Carousel/index.tsx"],"sourcesContent":[null],"names":["_jsx","_Fragment"],"mappings":"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"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Reads the visible tab panel's text so the header copy button copies the active snippet.
|
|
5
|
+
*
|
|
6
|
+
* @param root The tabs root. When null, there is no panel to read.
|
|
7
|
+
* @returns Trimmed text of the panel that is not hidden, or an empty string when none is showing.
|
|
8
|
+
*/
|
|
9
|
+
const getActiveTabPanelText = (root) => {
|
|
10
|
+
if (!root)
|
|
11
|
+
return '';
|
|
12
|
+
const activePanel = root.querySelector('[role="tabpanel"]:not([hidden])');
|
|
13
|
+
return activePanel?.textContent?.trim() ?? '';
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
exports.getActiveTabPanelText = getActiveTabPanelText;
|
|
17
|
+
//# sourceMappingURL=codeSnippet.utils.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"codeSnippet.utils.cjs","sources":["../../../../src/components/molecules/CodeSnippet/codeSnippet.utils.ts"],"sourcesContent":[null],"names":[],"mappings":";;AAAA;;;;;AAKG;AACI,MAAM,qBAAqB,GAAG,CAAC,IAAuB,KAAY;AACvE,IAAA,IAAI,CAAC,IAAI;AAAE,QAAA,OAAO,EAAE;IACpB,MAAM,WAAW,GAAG,IAAI,CAAC,aAAa,CAAC,iCAAiC,CAAC;IACzE,OAAO,WAAW,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE;AAC/C;;"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Reads the visible tab panel's text so the header copy button copies the active snippet.
|
|
3
|
+
*
|
|
4
|
+
* @param root The tabs root. When null, there is no panel to read.
|
|
5
|
+
* @returns Trimmed text of the panel that is not hidden, or an empty string when none is showing.
|
|
6
|
+
*/
|
|
7
|
+
export declare const getActiveTabPanelText: (root: ParentNode | null) => string;
|
|
8
|
+
//# sourceMappingURL=codeSnippet.utils.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"codeSnippet.utils.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/CodeSnippet/codeSnippet.utils.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,eAAO,MAAM,qBAAqB,GAAI,MAAM,UAAU,GAAG,IAAI,KAAG,MAI/D,CAAC"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Reads the visible tab panel's text so the header copy button copies the active snippet.
|
|
3
|
+
*
|
|
4
|
+
* @param root The tabs root. When null, there is no panel to read.
|
|
5
|
+
* @returns Trimmed text of the panel that is not hidden, or an empty string when none is showing.
|
|
6
|
+
*/
|
|
7
|
+
const getActiveTabPanelText = (root) => {
|
|
8
|
+
if (!root)
|
|
9
|
+
return '';
|
|
10
|
+
const activePanel = root.querySelector('[role="tabpanel"]:not([hidden])');
|
|
11
|
+
return activePanel?.textContent?.trim() ?? '';
|
|
12
|
+
};
|
|
13
|
+
|
|
14
|
+
export { getActiveTabPanelText };
|
|
15
|
+
//# sourceMappingURL=codeSnippet.utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"codeSnippet.utils.js","sources":["../../../../src/components/molecules/CodeSnippet/codeSnippet.utils.ts"],"sourcesContent":[null],"names":[],"mappings":"AAAA;;;;;AAKG;AACI,MAAM,qBAAqB,GAAG,CAAC,IAAuB,KAAY;AACvE,IAAA,IAAI,CAAC,IAAI;AAAE,QAAA,OAAO,EAAE;IACpB,MAAM,WAAW,GAAG,IAAI,CAAC,aAAa,CAAC,iCAAiC,CAAC;IACzE,OAAO,WAAW,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE;AAC/C;;"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* Measures the code block against `maxHeight` and tracks whether the reader has expanded it.
|
|
7
|
+
* The comparison subtracts 10px, so a block that only barely overflows does not show the toggle.
|
|
8
|
+
*
|
|
9
|
+
* @param options The height cap and the content whose scroll height is measured.
|
|
10
|
+
* @returns The content ref, whether it overflows, whether it is expanded, and a toggle.
|
|
11
|
+
*/
|
|
12
|
+
const useCodeSnippetCollapse = ({ maxHeight, nodes, children }) => {
|
|
13
|
+
const contentRef = React.useRef(null);
|
|
14
|
+
const [expanded, setExpanded] = React.useState(false);
|
|
15
|
+
const [exceedsMaxHeight, setExceedsMaxHeight] = React.useState(false);
|
|
16
|
+
// biome-ignore lint/correctness/useExhaustiveDependencies: nodes and children change the measured scrollHeight without being read
|
|
17
|
+
React.useEffect(() => {
|
|
18
|
+
if (!maxHeight || !contentRef.current)
|
|
19
|
+
return;
|
|
20
|
+
setExceedsMaxHeight(contentRef.current.scrollHeight > maxHeight - 10);
|
|
21
|
+
}, [maxHeight, nodes, children]);
|
|
22
|
+
const toggleExpanded = () => {
|
|
23
|
+
setExpanded(!expanded);
|
|
24
|
+
};
|
|
25
|
+
return { contentRef, exceedsMaxHeight, expanded, toggleExpanded };
|
|
26
|
+
};
|
|
27
|
+
|
|
28
|
+
exports.useCodeSnippetCollapse = useCodeSnippetCollapse;
|
|
29
|
+
//# sourceMappingURL=useCodeSnippetCollapse.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useCodeSnippetCollapse.cjs","sources":["../../../../../src/components/molecules/CodeSnippet/hooks/useCodeSnippetCollapse.ts"],"sourcesContent":[null],"names":["useRef","useState","useEffect"],"mappings":";;;;AAwBA;;;;;;AAMG;AACI,MAAM,sBAAsB,GAAG,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAiC,KAAkC;AACpI,IAAA,MAAM,UAAU,GAAGA,YAAM,CAAiB,IAAI,CAAC;IAC/C,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAGC,cAAQ,CAAC,KAAK,CAAC;IAC/C,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAGA,cAAQ,CAAC,KAAK,CAAC;;IAG/DC,eAAS,CAAC,MAAK;AACb,QAAA,IAAI,CAAC,SAAS,IAAI,CAAC,UAAU,CAAC,OAAO;YAAE;QACvC,mBAAmB,CAAC,UAAU,CAAC,OAAO,CAAC,YAAY,GAAG,SAAS,GAAG,EAAE,CAAC;IACvE,CAAC,EAAE,CAAC,SAAS,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC;IAEhC,MAAM,cAAc,GAAG,MAAK;AAC1B,QAAA,WAAW,CAAC,CAAC,QAAQ,CAAC;AACxB,IAAA,CAAC;IAED,OAAO,EAAE,UAAU,EAAE,gBAAgB,EAAE,QAAQ,EAAE,cAAc,EAAE;AACnE;;"}
|