@strapi/design-system 1.6.4 → 1.6.5
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/Accordion/Accordion.cjs +1 -1
- package/dist/Accordion/Accordion.js +1 -1
- package/dist/Accordion/AccordionToggle.cjs +6 -6
- package/dist/Accordion/AccordionToggle.js +48 -51
- package/dist/BaseRadio/BaseRadio.cjs +1 -1
- package/dist/BaseRadio/BaseRadio.js +1 -1
- package/dist/Box/Box.cjs +3 -3
- package/dist/Box/Box.js +26 -26
- package/dist/Card/Card.cjs +1 -1
- package/dist/Card/Card.js +1 -1
- package/dist/CarouselInput/CarouselActions.cjs +1 -1
- package/dist/CarouselInput/CarouselActions.js +16 -4
- package/dist/CarouselInput/CarouselInput.cjs +1 -1
- package/dist/CarouselInput/CarouselInput.js +13 -13
- package/dist/Checkbox/Checkbox.cjs +2 -2
- package/dist/Checkbox/Checkbox.js +13 -13
- package/dist/Combobox/Combobox.cjs +1 -1
- package/dist/Combobox/Combobox.js +62 -63
- package/dist/DatePicker/DatePickerCalendar.cjs +1 -1
- package/dist/DatePicker/DatePickerCalendar.js +2 -1
- package/dist/DatePicker/DatePickerTd.cjs +3 -3
- package/dist/DatePicker/DatePickerTd.js +8 -9
- package/dist/DatePicker/DatePickerTh.cjs +2 -2
- package/dist/DatePicker/DatePickerTh.js +3 -4
- package/dist/DateTimePicker/DateTimePicker.cjs +1 -1
- package/dist/DateTimePicker/DateTimePicker.js +28 -28
- package/dist/Dialog/Dialog.cjs +4 -4
- package/dist/Dialog/Dialog.js +2 -2
- package/dist/Dialog/DialogFooter.cjs +3 -3
- package/dist/Dialog/DialogFooter.js +2 -2
- package/dist/Field/Field.cjs +1 -1
- package/dist/Field/Field.js +31 -27
- package/dist/Field/FieldAction.cjs +2 -8
- package/dist/Field/FieldAction.js +27 -16
- package/dist/Field/FieldContext.cjs +1 -1
- package/dist/Field/FieldContext.js +2 -2
- package/dist/Field/FieldError.cjs +1 -1
- package/dist/Field/FieldError.js +14 -4
- package/dist/Field/FieldHint.cjs +1 -1
- package/dist/Field/FieldHint.js +17 -7
- package/dist/Field/FieldInput.cjs +14 -16
- package/dist/Field/FieldInput.js +104 -72
- package/dist/Field/FieldLabel.cjs +3 -3
- package/dist/Field/FieldLabel.js +43 -25
- package/dist/FocusTrap/FocusTrap.cjs +1 -1
- package/dist/FocusTrap/FocusTrap.js +34 -38
- package/dist/JSONInput/JSONInput.cjs +1 -1
- package/dist/JSONInput/JSONInput.js +29 -27
- package/dist/Layout/HeaderLayout.cjs +2 -2
- package/dist/Layout/HeaderLayout.js +3 -3
- package/dist/MainNav/NavSection.cjs +1 -1
- package/dist/MainNav/NavSection.js +33 -13
- package/dist/MainNav/NavSections.cjs +2 -2
- package/dist/MainNav/NavSections.js +20 -10
- package/dist/ModalLayout/ModalLayout.cjs +1 -1
- package/dist/ModalLayout/ModalLayout.js +1 -1
- package/dist/NumberInput/NumberInput.cjs +2 -2
- package/dist/NumberInput/NumberInput.js +32 -32
- package/dist/Popover/Popover.cjs +3 -3
- package/dist/Popover/Popover.js +1 -1
- package/dist/RawTable/RawCell.cjs +1 -1
- package/dist/RawTable/RawCell.js +61 -67
- package/dist/RawTable/RawTable.cjs +1 -1
- package/dist/RawTable/RawTable.js +39 -37
- package/dist/RawTable/RawTbody.cjs +1 -1
- package/dist/RawTable/RawTbody.js +14 -11
- package/dist/RawTable/RawThead.cjs +1 -1
- package/dist/RawTable/RawThead.js +13 -8
- package/dist/RawTable/RawTr.cjs +1 -1
- package/dist/RawTable/RawTr.js +20 -13
- package/dist/Searchbar/Searchbar.cjs +2 -2
- package/dist/Searchbar/Searchbar.js +7 -6
- package/dist/Select/Select.cjs +2 -2
- package/dist/Select/Select.js +24 -25
- package/dist/Select/SelectList.cjs +1 -1
- package/dist/Select/SelectList.js +10 -8
- package/dist/SimpleMenu/SimpleMenu.cjs +1 -1
- package/dist/SimpleMenu/SimpleMenu.js +1 -1
- package/dist/SubNav/SubNavHeader.cjs +2 -2
- package/dist/SubNav/SubNavHeader.js +2 -2
- package/dist/SubNav/SubNavLinkSection.cjs +3 -3
- package/dist/SubNav/SubNavLinkSection.js +1 -1
- package/dist/SubNav/SubNavSection.cjs +2 -2
- package/dist/SubNav/SubNavSection.js +7 -7
- package/dist/SubNav/SubNavSections.cjs +1 -1
- package/dist/SubNav/SubNavSections.js +17 -7
- package/dist/Tabs/TabGroup.cjs +1 -1
- package/dist/Tabs/TabGroup.js +1 -1
- package/dist/Tag/Tag.cjs +8 -8
- package/dist/Tag/Tag.js +52 -49
- package/dist/TextInput/TextInput.cjs +1 -1
- package/dist/TextInput/TextInput.js +13 -13
- package/dist/Textarea/Textarea.cjs +2 -2
- package/dist/Textarea/Textarea.js +12 -13
- package/dist/Textarea/TextareaInput.cjs +4 -4
- package/dist/Textarea/TextareaInput.js +13 -12
- package/dist/TimePicker/TimePicker.cjs +2 -2
- package/dist/TimePicker/TimePicker.js +1 -1
- package/dist/ToggleCheckbox/ToggleCheckbox.cjs +2 -2
- package/dist/ToggleCheckbox/ToggleCheckbox.js +1 -0
- package/dist/ToggleInput/ToggleInput.cjs +3 -3
- package/dist/ToggleInput/ToggleInput.js +28 -29
- package/dist/Tooltip/Tooltip.cjs +1 -1
- package/dist/Tooltip/Tooltip.js +1 -1
- package/dist/helpers/deprecations.cjs +1 -1
- package/dist/helpers/deprecations.js +7 -7
- package/dist/helpers/useElementOnScreen.cjs +1 -1
- package/dist/helpers/useElementOnScreen.js +4 -13
- package/dist/helpers/useId.cjs +1 -1
- package/dist/helpers/useId.js +4 -11
- package/dist/helpers/useIntersection.cjs +1 -1
- package/dist/helpers/useIntersection.js +4 -21
- package/dist/helpers/useLockScroll.cjs +1 -1
- package/dist/helpers/useLockScroll.js +4 -7
- package/dist/helpers/usePrevious.cjs +1 -1
- package/dist/helpers/usePrevious.js +4 -8
- package/dist/helpers/useResizeObserver.cjs +1 -1
- package/dist/helpers/useResizeObserver.js +4 -14
- package/dist/hooks/useElementOnScreen.cjs +1 -0
- package/dist/hooks/useElementOnScreen.js +15 -0
- package/dist/hooks/useIntersection.cjs +1 -1
- package/dist/hooks/useIntersection.js +3 -3
- package/dist/hooks/useLockScroll.cjs +1 -0
- package/dist/hooks/useLockScroll.js +9 -0
- package/dist/hooks/usePrevious.cjs +1 -0
- package/dist/hooks/usePrevious.js +10 -0
- package/dist/hooks/useResizeObserver.cjs +1 -0
- package/dist/hooks/useResizeObserver.js +16 -0
- package/dist/v2/MainNav/NavSection.cjs +1 -1
- package/dist/v2/MainNav/NavSection.js +33 -13
- package/dist/v2/MainNav/NavSections.cjs +2 -2
- package/dist/v2/MainNav/NavSections.js +20 -10
- package/dist/v2/SimpleMenu/SimpleMenu.cjs +1 -1
- package/dist/v2/SimpleMenu/SimpleMenu.js +1 -1
- package/dist/v2/SubNav/SubNavHeader.cjs +2 -2
- package/dist/v2/SubNav/SubNavHeader.js +2 -2
- package/dist/v2/SubNav/SubNavLinkSection.cjs +3 -3
- package/dist/v2/SubNav/SubNavLinkSection.js +1 -1
- package/dist/v2/SubNav/SubNavSection.cjs +2 -2
- package/dist/v2/SubNav/SubNavSection.js +10 -10
- package/dist/v2/SubNav/SubNavSections.cjs +1 -1
- package/dist/v2/SubNav/SubNavSections.js +17 -7
- package/package.json +4 -3
- package/dist/Select/SingleSelect.cjs +0 -82
- package/dist/Select/SingleSelect.js +0 -285
|
@@ -1,45 +1,41 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import { getFocusableNodes as
|
|
4
|
-
import { KeyboardKeys as
|
|
5
|
-
const
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
import { jsx as a } from "react/jsx-runtime";
|
|
2
|
+
import { useRef as m, useEffect as l } from "react";
|
|
3
|
+
import { getFocusableNodes as u } from "../helpers/getFocusableNodes.js";
|
|
4
|
+
import { KeyboardKeys as c } from "../helpers/keyboardKeys.js";
|
|
5
|
+
const v = ({
|
|
6
|
+
onEscape: r,
|
|
7
|
+
restoreFocus: o = !0,
|
|
8
|
+
...i
|
|
9
|
+
}) => {
|
|
10
|
+
const n = m(null);
|
|
11
|
+
return l(() => {
|
|
8
12
|
let e = null;
|
|
9
|
-
return
|
|
13
|
+
return o && (e = document.activeElement), () => {
|
|
10
14
|
e && e.focus();
|
|
11
15
|
};
|
|
12
|
-
}, [
|
|
13
|
-
if (!
|
|
16
|
+
}, [o]), l(() => {
|
|
17
|
+
if (!n.current)
|
|
14
18
|
return;
|
|
15
|
-
const e =
|
|
16
|
-
e.length > 0 ? e[0].focus() : console.warn(
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
};
|
|
35
|
-
a.defaultProps = {
|
|
36
|
-
onEscape: void 0,
|
|
37
|
-
restoreFocus: !0
|
|
38
|
-
};
|
|
39
|
-
a.propTypes = {
|
|
40
|
-
onEscape: u.func,
|
|
41
|
-
restoreFocus: u.bool
|
|
19
|
+
const e = u(n.current);
|
|
20
|
+
e.length > 0 ? e[0].focus() : console.warn("[FocusTrap]: it seems there are no focusable elements in the focus trap tree. Make sure there s at least one.");
|
|
21
|
+
}, []), a("div", {
|
|
22
|
+
ref: n,
|
|
23
|
+
onKeyDown: (e) => {
|
|
24
|
+
if (e.key === c.ESCAPE && r) {
|
|
25
|
+
r();
|
|
26
|
+
return;
|
|
27
|
+
}
|
|
28
|
+
if (e.key !== c.TAB)
|
|
29
|
+
return;
|
|
30
|
+
const t = u(n.current);
|
|
31
|
+
if (t.length > 0) {
|
|
32
|
+
const s = t[0], f = t[t.length - 1];
|
|
33
|
+
e.shiftKey ? s === document.activeElement && (e.preventDefault(), f.focus()) : f === document.activeElement && (e.preventDefault(), s.focus());
|
|
34
|
+
}
|
|
35
|
+
},
|
|
36
|
+
...i
|
|
37
|
+
});
|
|
42
38
|
};
|
|
43
39
|
export {
|
|
44
|
-
|
|
40
|
+
v as FocusTrap
|
|
45
41
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),l=require("react"),j=require("@codemirror/lang-json"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),l=require("react"),j=require("@codemirror/lang-json"),N=require("@uiw/react-codemirror"),k=require("./JSONInputContainer.cjs"),u=require("./utils/decorationExtension.cjs"),H=require("../Field/Field.cjs"),R=require("../Field/FieldLabel.cjs");require("../Field/FieldInput.cjs");const L=require("../Field/FieldHint.cjs"),A=require("../Field/FieldError.cjs");require("../Field/FieldContext.cjs");require("../Field/FieldAction.cjs");const y=require("../Flex/Flex.cjs"),z=({label:d,error:a,hint:E,labelAction:x,value:S="",required:m=!1,disabled:h=!1,onChange:q=()=>null,...p})=>{const i=l.useRef(),o=l.useRef(),c=l.useRef(),C=Boolean(a),b=e=>{const r=o.current?.doc;if(r){const{text:s,to:t}=r.line(e),g=t-s.trimStart().length;t>g&&c.current?.dispatch({effects:u.addMarks.of([u.lineHighlightMark.range(g,t)])})}},I=()=>{const e=o.current?.doc;if(e){const r=e.length||0;c.current?.dispatch({effects:u.filterMarks.of((s,t)=>t<=0||s>=r)})}},F=({state:e,view:r})=>{c.current=r,o.current=e,I();const t=j.jsonParseLinter()(r);t.length&&b(e.doc.lineAt(t[0].from).number)},O=(e,r)=>{F(r),q(e)},J=(e,r)=>{c.current=e,o.current=r,F({view:e,state:r})},{setContainer:f}=N.useCodeMirror({value:S,onCreateEditor:J,container:i.current,editable:!h,extensions:[j.json(),u.markField],onChange:O,theme:"dark",basicSetup:{lineNumbers:!0,bracketMatching:!0,closeBrackets:!0,indentOnInput:!0,syntaxHighlighting:!0,highlightSelectionMatches:!0,tabSize:2}}),M=()=>{h||i.current?.children[0].children[1].children[1]?.focus()};return l.useEffect(()=>{const e=i.current;e&&f(e)},[f]),n.jsx(H.Field,{error:a,hint:E,required:m,children:n.jsxs(y.Flex,{direction:"column",alignItems:"stretch",gap:1,children:[d&&n.jsx(R.FieldLabel,{onClick:M,action:x,children:d}),n.jsx(k.JSONInputContainer,{ref:i,hasError:C,alignItems:"stretch",fontSize:2,hasRadius:!0,...p}),n.jsx(A.FieldError,{}),n.jsx(L.FieldHint,{})]})})};exports.JSONInput=z;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as n, jsxs as O } from "react/jsx-runtime";
|
|
2
2
|
import { useRef as l, useEffect as J } from "react";
|
|
3
3
|
import { json as j, jsonParseLinter as H } from "@codemirror/lang-json";
|
|
4
4
|
import { useCodeMirror as L } from "@uiw/react-codemirror";
|
|
@@ -11,8 +11,8 @@ import { FieldHint as V } from "../Field/FieldHint.js";
|
|
|
11
11
|
import { FieldError as D } from "../Field/FieldError.js";
|
|
12
12
|
import "../Field/FieldContext.js";
|
|
13
13
|
import "../Field/FieldAction.js";
|
|
14
|
-
import {
|
|
15
|
-
const
|
|
14
|
+
import { Flex as G } from "../Flex/Flex.js";
|
|
15
|
+
const er = ({
|
|
16
16
|
label: a,
|
|
17
17
|
error: d,
|
|
18
18
|
hint: p,
|
|
@@ -23,35 +23,35 @@ const nr = ({
|
|
|
23
23
|
onChange: k = () => null,
|
|
24
24
|
...C
|
|
25
25
|
}) => {
|
|
26
|
-
const o = l(), i = l(), c = l(),
|
|
26
|
+
const o = l(), i = l(), c = l(), F = Boolean(d), b = (r) => {
|
|
27
27
|
const t = i.current?.doc;
|
|
28
28
|
if (t) {
|
|
29
29
|
const {
|
|
30
30
|
text: s,
|
|
31
|
-
to:
|
|
32
|
-
} = t.line(r), m =
|
|
33
|
-
|
|
34
|
-
effects: B.of([R.range(m,
|
|
31
|
+
to: e
|
|
32
|
+
} = t.line(r), m = e - s.trimStart().length;
|
|
33
|
+
e > m && c.current?.dispatch({
|
|
34
|
+
effects: B.of([R.range(m, e)])
|
|
35
35
|
});
|
|
36
36
|
}
|
|
37
|
-
},
|
|
37
|
+
}, x = () => {
|
|
38
38
|
const r = i.current?.doc;
|
|
39
39
|
if (r) {
|
|
40
40
|
const t = r.length || 0;
|
|
41
41
|
c.current?.dispatch({
|
|
42
|
-
effects: q.of((s,
|
|
42
|
+
effects: q.of((s, e) => e <= 0 || s >= t)
|
|
43
43
|
});
|
|
44
44
|
}
|
|
45
45
|
}, f = ({
|
|
46
46
|
state: r,
|
|
47
47
|
view: t
|
|
48
48
|
}) => {
|
|
49
|
-
c.current = t, i.current = r,
|
|
50
|
-
const
|
|
51
|
-
|
|
52
|
-
},
|
|
49
|
+
c.current = t, i.current = r, x();
|
|
50
|
+
const e = H()(t);
|
|
51
|
+
e.length && b(r.doc.lineAt(e[0].from).number);
|
|
52
|
+
}, M = (r, t) => {
|
|
53
53
|
f(t), k(r);
|
|
54
|
-
},
|
|
54
|
+
}, I = (r, t) => {
|
|
55
55
|
c.current = r, i.current = t, f({
|
|
56
56
|
view: r,
|
|
57
57
|
state: t
|
|
@@ -60,11 +60,11 @@ const nr = ({
|
|
|
60
60
|
setContainer: h
|
|
61
61
|
} = L({
|
|
62
62
|
value: E,
|
|
63
|
-
onCreateEditor:
|
|
63
|
+
onCreateEditor: I,
|
|
64
64
|
container: o.current,
|
|
65
65
|
editable: !u,
|
|
66
66
|
extensions: [j(), A],
|
|
67
|
-
onChange:
|
|
67
|
+
onChange: M,
|
|
68
68
|
theme: "dark",
|
|
69
69
|
basicSetup: {
|
|
70
70
|
lineNumbers: !0,
|
|
@@ -75,33 +75,35 @@ const nr = ({
|
|
|
75
75
|
highlightSelectionMatches: !0,
|
|
76
76
|
tabSize: 2
|
|
77
77
|
}
|
|
78
|
-
}),
|
|
78
|
+
}), N = () => {
|
|
79
79
|
u || o.current?.children[0].children[1].children[1]?.focus();
|
|
80
80
|
};
|
|
81
81
|
return J(() => {
|
|
82
82
|
const r = o.current;
|
|
83
83
|
r && h(r);
|
|
84
|
-
}, [h]),
|
|
84
|
+
}, [h]), n(y, {
|
|
85
85
|
error: d,
|
|
86
86
|
hint: p,
|
|
87
87
|
required: S,
|
|
88
|
-
children:
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
88
|
+
children: O(G, {
|
|
89
|
+
direction: "column",
|
|
90
|
+
alignItems: "stretch",
|
|
91
|
+
gap: 1,
|
|
92
|
+
children: [a && n(P, {
|
|
93
|
+
onClick: N,
|
|
92
94
|
action: g,
|
|
93
95
|
children: a
|
|
94
|
-
}),
|
|
96
|
+
}), n(z, {
|
|
95
97
|
ref: o,
|
|
96
|
-
hasError:
|
|
98
|
+
hasError: F,
|
|
97
99
|
alignItems: "stretch",
|
|
98
100
|
fontSize: 2,
|
|
99
101
|
hasRadius: !0,
|
|
100
102
|
...C
|
|
101
|
-
}),
|
|
103
|
+
}), n(D, {}), n(V, {})]
|
|
102
104
|
})
|
|
103
105
|
});
|
|
104
106
|
};
|
|
105
107
|
export {
|
|
106
|
-
|
|
108
|
+
er as JSONInput
|
|
107
109
|
};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("react"),E=require("prop-types"),v=require("styled-components"),d=require("../Box/Box.cjs"),i=require("../Flex/Flex.cjs"),B=require("../
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("react"),E=require("prop-types"),v=require("styled-components"),d=require("../Box/Box.cjs"),i=require("../Flex/Flex.cjs"),B=require("../hooks/useElementOnScreen.cjs"),b=require("../hooks/useResizeObserver.cjs"),s=require("../Typography/Typography.cjs"),p=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=p(c),a=p(E),R=p(v),T=()=>{const t=c.useRef(null),[l,r]=c.useState(null),[n,o]=B.useElementOnScreen({root:null,rootMargin:"0px",threshold:0});return b.useResizeObserver(n,()=>{n.current&&r(n.current.getBoundingClientRect())}),c.useEffect(()=>{t.current&&r(t.current.getBoundingClientRect())},[t]),{containerRef:n,isVisible:o,baseHeaderLayoutRef:t,headerSize:l}},f=t=>{const{containerRef:l,isVisible:r,baseHeaderLayoutRef:n,headerSize:o}=T();return e.default.createElement(e.default.Fragment,null,e.default.createElement("div",{style:{height:o?.height},ref:l},r&&e.default.createElement(u,{ref:n,...t})),!r&&e.default.createElement(u,{...t,sticky:!0,width:o?.width}))};f.displayName="HeaderLayout";const L=R.default(d.Box)`
|
|
2
2
|
width: ${t=>t.width}px;
|
|
3
|
-
`,u=e.default.forwardRef(({navigationAction:t,primaryAction:l,secondaryAction:r,subtitle:n,title:o,sticky:m,width:h,...y},x)=>{const g=typeof n=="string";return m?e.default.createElement(L,{paddingLeft:6,paddingRight:6,paddingTop:3,paddingBottom:3,position:"fixed",top:0,right:0,background:"neutral0",shadow:"tableShadow",width:h,zIndex:4,"data-strapi-header-sticky":!0},e.default.createElement(i.Flex,{justifyContent:"space-between"},e.default.createElement(i.Flex,null,t&&e.default.createElement(d.Box,{paddingRight:3},t),e.default.createElement(d.Box,null,e.default.createElement(s.Typography,{variant:"beta",as:"h1",...y},o),g?e.default.createElement(s.Typography,{variant:"pi",textColor:"neutral600"},n):n),r?e.default.createElement(d.Box,{paddingLeft:4},r):null),e.default.createElement(i.Flex,null,l?e.default.createElement(d.Box,{paddingLeft:2},l):void 0))):e.default.createElement(d.Box,{ref:x,paddingLeft:10,paddingRight:10,paddingBottom:8,paddingTop:t?6:8,background:"neutral100","data-strapi-header":!0},t?e.default.createElement(d.Box,{paddingBottom:2},t):null,e.default.createElement(i.Flex,{justifyContent:"space-between"},e.default.createElement(i.Flex,
|
|
3
|
+
`,u=e.default.forwardRef(({navigationAction:t,primaryAction:l,secondaryAction:r,subtitle:n,title:o,sticky:m,width:h,...y},x)=>{const g=typeof n=="string";return m?e.default.createElement(L,{paddingLeft:6,paddingRight:6,paddingTop:3,paddingBottom:3,position:"fixed",top:0,right:0,background:"neutral0",shadow:"tableShadow",width:h,zIndex:4,"data-strapi-header-sticky":!0},e.default.createElement(i.Flex,{justifyContent:"space-between"},e.default.createElement(i.Flex,null,t&&e.default.createElement(d.Box,{paddingRight:3},t),e.default.createElement(d.Box,null,e.default.createElement(s.Typography,{variant:"beta",as:"h1",...y},o),g?e.default.createElement(s.Typography,{variant:"pi",textColor:"neutral600"},n):n),r?e.default.createElement(d.Box,{paddingLeft:4},r):null),e.default.createElement(i.Flex,null,l?e.default.createElement(d.Box,{paddingLeft:2},l):void 0))):e.default.createElement(d.Box,{ref:x,paddingLeft:10,paddingRight:10,paddingBottom:8,paddingTop:t?6:8,background:"neutral100","data-strapi-header":!0},t?e.default.createElement(d.Box,{paddingBottom:2},t):null,e.default.createElement(i.Flex,{justifyContent:"space-between"},e.default.createElement(i.Flex,{minWidth:0},e.default.createElement(s.Typography,{as:"h1",variant:"alpha",...y},o),r?e.default.createElement(d.Box,{paddingLeft:4},r):null),l),g?e.default.createElement(s.Typography,{variant:"epsilon",textColor:"neutral600",as:"p"},n):n)});u.displayName="BaseHeaderLayout";u.defaultProps={navigationAction:void 0,primaryAction:void 0,secondaryAction:void 0,subtitle:void 0,sticky:!1,width:void 0};u.propTypes={navigationAction:a.default.node,primaryAction:a.default.node,secondaryAction:a.default.node,sticky:a.default.bool,subtitle:a.default.oneOfType([a.default.string,a.default.node]),title:a.default.string.isRequired,width:a.default.number};f.defaultProps={navigationAction:void 0,primaryAction:void 0,secondaryAction:void 0,subtitle:void 0};f.propTypes={navigationAction:a.default.node,primaryAction:a.default.node,secondaryAction:a.default.node,subtitle:a.default.oneOfType([a.default.string,a.default.node]),title:a.default.string.isRequired};exports.BaseHeaderLayout=u;exports.HeaderLayout=f;
|
|
@@ -3,8 +3,8 @@ import t from "prop-types";
|
|
|
3
3
|
import R from "styled-components";
|
|
4
4
|
import { Box as i } from "../Box/Box.js";
|
|
5
5
|
import { Flex as l } from "../Flex/Flex.js";
|
|
6
|
-
import { useElementOnScreen as b } from "../
|
|
7
|
-
import { useResizeObserver as w } from "../
|
|
6
|
+
import { useElementOnScreen as b } from "../hooks/useElementOnScreen.js";
|
|
7
|
+
import { useResizeObserver as w } from "../hooks/useResizeObserver.js";
|
|
8
8
|
import { Typography as c } from "../Typography/Typography.js";
|
|
9
9
|
const L = () => {
|
|
10
10
|
const n = h(null), [o, a] = E(null), [r, d] = b({
|
|
@@ -61,7 +61,7 @@ const x = R(i)`
|
|
|
61
61
|
"data-strapi-header": !0
|
|
62
62
|
},
|
|
63
63
|
n ? /* @__PURE__ */ e.createElement(i, { paddingBottom: 2 }, n) : null,
|
|
64
|
-
/* @__PURE__ */ e.createElement(l, { justifyContent: "space-between" }, /* @__PURE__ */ e.createElement(l,
|
|
64
|
+
/* @__PURE__ */ e.createElement(l, { justifyContent: "space-between" }, /* @__PURE__ */ e.createElement(l, { minWidth: 0 }, /* @__PURE__ */ e.createElement(c, { as: "h1", variant: "alpha", ...u }, d), a ? /* @__PURE__ */ e.createElement(i, { paddingLeft: 4 }, a) : null), o),
|
|
65
65
|
m ? /* @__PURE__ */ e.createElement(c, { variant: "epsilon", textColor: "neutral600", as: "p" }, r) : r
|
|
66
66
|
);
|
|
67
67
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react"),g=require("prop-types"),f=require("./MainNavContext.cjs"),s=require("../Box/Box.cjs"),y=require("../Divider/Divider.cjs"),n=require("../Flex/Flex.cjs"),x=require("../Typography/Typography.cjs"),v=require("../VisuallyHidden/VisuallyHidden.cjs"),p=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=p(i),o=p(g),m=({label:t,children:d,spacing:u=2,horizontal:a=!1,...c})=>f.useMainNav()?e.default.createElement(n.Flex,{direction:"column",alignItems:"stretch",gap:2},e.default.createElement(s.Box,{paddingTop:1,paddingBottom:1,background:"neutral0",hasRadius:!0,as:"span"},e.default.createElement(y.Divider,null),e.default.createElement(v.VisuallyHidden,null,e.default.createElement("span",null,t))),e.default.createElement(n.Flex,{as:"ul",gap:u,direction:a?"row":"column",alignItems:a?"center":"stretch",...c},i.Children.map(d,(r,l)=>e.default.createElement("li",{key:l},r)))):e.default.createElement(n.Flex,{direction:"column",alignItems:"stretch",gap:2},e.default.createElement(s.Box,{paddingTop:1,paddingBottom:1,background:"neutral0",paddingRight:3,paddingLeft:3,hasRadius:!0,as:"span"},e.default.createElement(x.Typography,{variant:"sigma",textColor:"neutral600"},t)),e.default.createElement(n.Flex,{as:"ul",gap:u,direction:a?"row":"column",alignItems:a?"center":"stretch",...c},i.Children.map(d,(r,l)=>e.default.createElement("li",{key:l},r))));m.propTypes={children:o.default.node.isRequired,label:o.default.string.isRequired};exports.NavSection=m;
|
|
@@ -1,16 +1,36 @@
|
|
|
1
|
-
import e, { Children as
|
|
2
|
-
import
|
|
3
|
-
import { useMainNav as
|
|
4
|
-
import { Box as
|
|
5
|
-
import { Divider as
|
|
6
|
-
import {
|
|
7
|
-
import { Typography as
|
|
8
|
-
import { VisuallyHidden as
|
|
9
|
-
const
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
1
|
+
import e, { Children as c } from "react";
|
|
2
|
+
import d from "prop-types";
|
|
3
|
+
import { useMainNav as s } from "./MainNavContext.js";
|
|
4
|
+
import { Box as p } from "../Box/Box.js";
|
|
5
|
+
import { Divider as u } from "../Divider/Divider.js";
|
|
6
|
+
import { Flex as r } from "../Flex/Flex.js";
|
|
7
|
+
import { Typography as g } from "../Typography/Typography.js";
|
|
8
|
+
import { VisuallyHidden as f } from "../VisuallyHidden/VisuallyHidden.js";
|
|
9
|
+
const E = ({ label: i, children: m, spacing: o = 2, horizontal: t = !1, ...l }) => s() ? /* @__PURE__ */ e.createElement(r, { direction: "column", alignItems: "stretch", gap: 2 }, /* @__PURE__ */ e.createElement(p, { paddingTop: 1, paddingBottom: 1, background: "neutral0", hasRadius: !0, as: "span" }, /* @__PURE__ */ e.createElement(u, null), /* @__PURE__ */ e.createElement(f, null, /* @__PURE__ */ e.createElement("span", null, i))), /* @__PURE__ */ e.createElement(
|
|
10
|
+
r,
|
|
11
|
+
{
|
|
12
|
+
as: "ul",
|
|
13
|
+
gap: o,
|
|
14
|
+
direction: t ? "row" : "column",
|
|
15
|
+
alignItems: t ? "center" : "stretch",
|
|
16
|
+
...l
|
|
17
|
+
},
|
|
18
|
+
c.map(m, (n, a) => /* @__PURE__ */ e.createElement("li", { key: a }, n))
|
|
19
|
+
)) : /* @__PURE__ */ e.createElement(r, { direction: "column", alignItems: "stretch", gap: 2 }, /* @__PURE__ */ e.createElement(p, { paddingTop: 1, paddingBottom: 1, background: "neutral0", paddingRight: 3, paddingLeft: 3, hasRadius: !0, as: "span" }, /* @__PURE__ */ e.createElement(g, { variant: "sigma", textColor: "neutral600" }, i)), /* @__PURE__ */ e.createElement(
|
|
20
|
+
r,
|
|
21
|
+
{
|
|
22
|
+
as: "ul",
|
|
23
|
+
gap: o,
|
|
24
|
+
direction: t ? "row" : "column",
|
|
25
|
+
alignItems: t ? "center" : "stretch",
|
|
26
|
+
...l
|
|
27
|
+
},
|
|
28
|
+
c.map(m, (n, a) => /* @__PURE__ */ e.createElement("li", { key: a }, n))
|
|
29
|
+
));
|
|
30
|
+
E.propTypes = {
|
|
31
|
+
children: d.node.isRequired,
|
|
32
|
+
label: d.string.isRequired
|
|
13
33
|
};
|
|
14
34
|
export {
|
|
15
|
-
|
|
35
|
+
E as NavSection
|
|
16
36
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react"),u=require("prop-types"),i=require("styled-components"),p=require("../Box/Box.cjs"),f=require("../Flex/Flex.cjs"),o=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=o(l),y=o(u),g=o(i),x=g.default(p.Box)`
|
|
2
2
|
flex-grow: 1;
|
|
3
3
|
overflow-y: auto;
|
|
4
|
-
`,
|
|
4
|
+
`,n=({children:e,spacing:a=4,horizontal:r=!1,...s})=>t.default.createElement(x,{paddingLeft:3,paddingRight:2,paddingTop:3,paddingBottom:8},t.default.createElement(f.Flex,{as:"ul",gap:a,direction:r?"row":"column",alignItems:r?"center":"stretch",...s},l.Children.map(e,(c,d)=>t.default.createElement("li",{key:d},c))));n.propTypes={children:y.default.node.isRequired};exports.NavSections=n;
|
|
@@ -1,15 +1,25 @@
|
|
|
1
|
-
import e, { Children as
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import { Box as
|
|
5
|
-
import {
|
|
6
|
-
const
|
|
1
|
+
import e, { Children as m } from "react";
|
|
2
|
+
import a from "prop-types";
|
|
3
|
+
import d from "styled-components";
|
|
4
|
+
import { Box as l } from "../Box/Box.js";
|
|
5
|
+
import { Flex as c } from "../Flex/Flex.js";
|
|
6
|
+
const s = d(l)`
|
|
7
7
|
flex-grow: 1;
|
|
8
8
|
overflow-y: auto;
|
|
9
|
-
`,
|
|
10
|
-
c
|
|
11
|
-
|
|
9
|
+
`, f = ({ children: t, spacing: o = 4, horizontal: r = !1, ...i }) => /* @__PURE__ */ e.createElement(s, { paddingLeft: 3, paddingRight: 2, paddingTop: 3, paddingBottom: 8 }, /* @__PURE__ */ e.createElement(
|
|
10
|
+
c,
|
|
11
|
+
{
|
|
12
|
+
as: "ul",
|
|
13
|
+
gap: o,
|
|
14
|
+
direction: r ? "row" : "column",
|
|
15
|
+
alignItems: r ? "center" : "stretch",
|
|
16
|
+
...i
|
|
17
|
+
},
|
|
18
|
+
m.map(t, (n, p) => /* @__PURE__ */ e.createElement("li", { key: p }, n))
|
|
19
|
+
));
|
|
20
|
+
f.propTypes = {
|
|
21
|
+
children: a.node.isRequired
|
|
12
22
|
};
|
|
13
23
|
export {
|
|
14
|
-
|
|
24
|
+
f as NavSections
|
|
15
25
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("react"),i=require("prop-types"),d=require("styled-components"),p=require("./ModalContext.cjs"),f=require("../Box/Box.cjs"),y=require("../DismissibleLayer/DismissibleLayer.cjs"),m=require("../Flex/Flex.cjs"),x=require("../FocusTrap/FocusTrap.cjs"),b=require("../
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("react"),i=require("prop-types"),d=require("styled-components"),p=require("./ModalContext.cjs"),f=require("../Box/Box.cjs"),y=require("../DismissibleLayer/DismissibleLayer.cjs"),m=require("../Flex/Flex.cjs"),x=require("../FocusTrap/FocusTrap.cjs"),b=require("../hooks/useLockScroll.cjs"),q=require("../Portal/Portal.cjs"),o=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=o(c),r=o(i),a=o(d),g=a.default(m.Flex)`
|
|
2
2
|
inset: 0;
|
|
3
3
|
background: ${({theme:e})=>`${e.colors.neutral800}1F`};
|
|
4
4
|
`,j=a.default(f.Box)`
|
|
@@ -6,7 +6,7 @@ import { Box as m } from "../Box/Box.js";
|
|
|
6
6
|
import { DismissibleLayer as p } from "../DismissibleLayer/DismissibleLayer.js";
|
|
7
7
|
import { Flex as d } from "../Flex/Flex.js";
|
|
8
8
|
import { FocusTrap as s } from "../FocusTrap/FocusTrap.js";
|
|
9
|
-
import u from "../
|
|
9
|
+
import u from "../hooks/useLockScroll.js";
|
|
10
10
|
import { Portal as c } from "../Portal/Portal.js";
|
|
11
11
|
const f = t(d)`
|
|
12
12
|
inset: 0;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("react"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("react"),y=require("@internationalized/number"),q=require("@strapi/icons"),O=require("prop-types"),T=require("styled-components"),$=require("../Field/Field.cjs"),B=require("../Field/FieldLabel.cjs"),H=require("../Field/FieldInput.cjs"),M=require("../Field/FieldHint.cjs"),U=require("../Field/FieldError.cjs");require("../Field/FieldContext.cjs");require("../Field/FieldAction.cjs");const W=require("../Flex/Flex.cjs"),X=require("../helpers/getDefaultLocale.cjs"),h=require("../helpers/keyboardKeys.cjs"),Y=require("../hooks/useControllableState.cjs"),G=require("../hooks/useId.cjs"),I=require("../Icon/Icon.cjs"),J=require("../themes/sizes.cjs"),m=r=>r&&typeof r=="object"&&"default"in r?r:{default:r},a=m(f),t=m(O),Q=m(T),v=Q.default.button`
|
|
2
2
|
display: flex;
|
|
3
3
|
height: 1rem;
|
|
4
4
|
align-items: ${({reverse:r})=>r?"flex-end":"flex-start"};
|
|
@@ -9,4 +9,4 @@
|
|
|
9
9
|
height: ${4/16}rem;
|
|
10
10
|
transform: ${({reverse:r})=>r?"rotateX(180deg)":void 0};
|
|
11
11
|
}
|
|
12
|
-
`,Z="",d=a.default.forwardRef(({size:r,startAction:N,name:j,hint:w,error:E,label:p,labelAction:
|
|
12
|
+
`,Z="",d=a.default.forwardRef(({size:r,startAction:N,name:j,hint:w,error:E,label:p,labelAction:x,locale:D,id:A,onValueChange:C,value:k,step:o,required:V,disabled:u,..._},L)=>{const P=G.useId(A),b=D||X.getDefaultLocale(),s=f.useRef(new y.NumberParser(b,{style:"decimal"})),c=f.useRef(new y.NumberFormatter(b,{maximumFractionDigits:20})),[l,R]=Y.useControllableState({prop(e){const n=String(k);return isNaN(n)||n!==e&&e!==""?e:n},defaultProp:Z,onChange(e){const n=s.current.parse(e);C(isNaN(n)?void 0:n)}}),i=e=>{R(String(e))},K=({target:{value:e}})=>{s.current.isValidPartialNumber(e)&&i(e)},F=()=>{if(!l){i(o);return}const e=s.current.parse(l),n=isNaN(e)?o:e+o;i(c.current.format(n))},g=()=>{if(!l){i(-o);return}const e=s.current.parse(l),n=isNaN(e)?-o:e-o;i(c.current.format(n))},S=e=>{if(!u)switch(e.key){case h.KeyboardKeys.DOWN:{e.preventDefault(),g();break}case h.KeyboardKeys.UP:{e.preventDefault(),F();break}}},z=()=>{if(l){const e=s.current.parse(l),n=isNaN(e)?"":c.current.format(e);i(n)}};return a.default.createElement($.Field,{name:j,hint:w,error:E,id:P,required:V},a.default.createElement(W.Flex,{direction:"column",alignItems:"stretch",gap:1},p&&a.default.createElement(B.FieldLabel,{action:x},p),a.default.createElement(H.FieldInput,{ref:L,startAction:N,disabled:u,type:"text",inputmode:"decimal",onChange:K,onKeyDown:S,onBlur:z,value:l,size:r,endAction:a.default.createElement(a.default.Fragment,null,a.default.createElement(v,{disabled:u,"aria-hidden":!0,reverse:!0,onClick:F,tabIndex:-1,type:"button","data-testid":"ArrowUp"},a.default.createElement(I.Icon,{as:q.CarretDown,color:"neutral500"})),a.default.createElement(v,{disabled:u,"aria-hidden":!0,onClick:g,tabIndex:-1,type:"button","data-testid":"ArrowDown"},a.default.createElement(I.Icon,{as:q.CarretDown,color:"neutral500"}))),..._}),a.default.createElement(M.FieldHint,null),a.default.createElement(U.FieldError,null)))});d.displayName="NumberInput";d.defaultProps={"aria-label":void 0,disabled:!1,error:void 0,hint:void 0,id:void 0,label:void 0,labelAction:void 0,locale:void 0,required:!1,size:"M",startAction:void 0,step:1,value:void 0};d.propTypes={"aria-label":t.default.string,disabled:t.default.bool,error:t.default.string,hint:t.default.oneOfType([t.default.string,t.default.node,t.default.arrayOf(t.default.node)]),id:t.default.string,label:t.default.string,labelAction:t.default.element,locale:t.default.string,name:t.default.string.isRequired,onValueChange:t.default.func.isRequired,required:t.default.bool,size:t.default.oneOf(Object.keys(J.sizes.input)),startAction:t.default.element,step:t.default.number,value:t.default.number};exports.NumberInput=d;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import t, { useRef as g } from "react";
|
|
2
|
-
import { NumberParser as
|
|
2
|
+
import { NumberParser as S, NumberFormatter as T } from "@internationalized/number";
|
|
3
3
|
import { CarretDown as v } from "@strapi/icons";
|
|
4
4
|
import r from "prop-types";
|
|
5
5
|
import z from "styled-components";
|
|
@@ -10,12 +10,12 @@ import { FieldHint as j } from "../Field/FieldHint.js";
|
|
|
10
10
|
import { FieldError as H } from "../Field/FieldError.js";
|
|
11
11
|
import "../Field/FieldContext.js";
|
|
12
12
|
import "../Field/FieldAction.js";
|
|
13
|
-
import {
|
|
13
|
+
import { Flex as M } from "../Flex/Flex.js";
|
|
14
|
+
import { getDefaultLocale as W } from "../helpers/getDefaultLocale.js";
|
|
14
15
|
import { KeyboardKeys as N } from "../helpers/keyboardKeys.js";
|
|
15
|
-
import { useId as W } from "../helpers/useId.js";
|
|
16
16
|
import { useControllableState as X } from "../hooks/useControllableState.js";
|
|
17
|
+
import { useId as Y } from "../hooks/useId.js";
|
|
17
18
|
import { Icon as y } from "../Icon/Icon.js";
|
|
18
|
-
import { Stack as Y } from "../Stack/Stack.js";
|
|
19
19
|
import { sizes as G } from "../themes/sizes.js";
|
|
20
20
|
const h = z.button`
|
|
21
21
|
display: flex;
|
|
@@ -34,48 +34,48 @@ const h = z.button`
|
|
|
34
34
|
startAction: w,
|
|
35
35
|
name: E,
|
|
36
36
|
hint: I,
|
|
37
|
-
error:
|
|
37
|
+
error: x,
|
|
38
38
|
label: d,
|
|
39
|
-
labelAction:
|
|
40
|
-
locale:
|
|
41
|
-
id:
|
|
42
|
-
onValueChange:
|
|
43
|
-
value:
|
|
39
|
+
labelAction: A,
|
|
40
|
+
locale: V,
|
|
41
|
+
id: F,
|
|
42
|
+
onValueChange: D,
|
|
43
|
+
value: C,
|
|
44
44
|
step: i,
|
|
45
|
-
required:
|
|
46
|
-
disabled:
|
|
45
|
+
required: k,
|
|
46
|
+
disabled: s,
|
|
47
47
|
...P
|
|
48
48
|
}, R) => {
|
|
49
|
-
const O =
|
|
49
|
+
const O = Y(F), p = V || W(), m = g(new S(p, { style: "decimal" })), c = g(new T(p, { maximumFractionDigits: 20 })), [a, $] = X({
|
|
50
50
|
prop(e) {
|
|
51
|
-
const o = String(
|
|
51
|
+
const o = String(C);
|
|
52
52
|
return isNaN(o) || o !== e && e !== "" ? e : o;
|
|
53
53
|
},
|
|
54
54
|
defaultProp: J,
|
|
55
55
|
onChange(e) {
|
|
56
|
-
const o =
|
|
57
|
-
|
|
56
|
+
const o = m.current.parse(e);
|
|
57
|
+
D(isNaN(o) ? void 0 : o);
|
|
58
58
|
}
|
|
59
59
|
}), l = (e) => {
|
|
60
|
-
|
|
61
|
-
},
|
|
62
|
-
|
|
60
|
+
$(String(e));
|
|
61
|
+
}, q = ({ target: { value: e } }) => {
|
|
62
|
+
m.current.isValidPartialNumber(e) && l(e);
|
|
63
63
|
}, f = () => {
|
|
64
64
|
if (!a) {
|
|
65
65
|
l(i);
|
|
66
66
|
return;
|
|
67
67
|
}
|
|
68
|
-
const e =
|
|
68
|
+
const e = m.current.parse(a), o = isNaN(e) ? i : e + i;
|
|
69
69
|
l(c.current.format(o));
|
|
70
70
|
}, b = () => {
|
|
71
71
|
if (!a) {
|
|
72
72
|
l(-i);
|
|
73
73
|
return;
|
|
74
74
|
}
|
|
75
|
-
const e =
|
|
75
|
+
const e = m.current.parse(a), o = isNaN(e) ? -i : e - i;
|
|
76
76
|
l(c.current.format(o));
|
|
77
|
-
},
|
|
78
|
-
if (!
|
|
77
|
+
}, K = (e) => {
|
|
78
|
+
if (!s)
|
|
79
79
|
switch (e.key) {
|
|
80
80
|
case N.DOWN: {
|
|
81
81
|
e.preventDefault(), b();
|
|
@@ -86,29 +86,29 @@ const h = z.button`
|
|
|
86
86
|
break;
|
|
87
87
|
}
|
|
88
88
|
}
|
|
89
|
-
},
|
|
89
|
+
}, L = () => {
|
|
90
90
|
if (a) {
|
|
91
|
-
const e =
|
|
91
|
+
const e = m.current.parse(a), o = isNaN(e) ? "" : c.current.format(e);
|
|
92
92
|
l(o);
|
|
93
93
|
}
|
|
94
94
|
};
|
|
95
|
-
return /* @__PURE__ */ t.createElement(B, { name: E, hint: I, error:
|
|
95
|
+
return /* @__PURE__ */ t.createElement(B, { name: E, hint: I, error: x, id: O, required: k }, /* @__PURE__ */ t.createElement(M, { direction: "column", alignItems: "stretch", gap: 1 }, d && /* @__PURE__ */ t.createElement(U, { action: A }, d), /* @__PURE__ */ t.createElement(
|
|
96
96
|
_,
|
|
97
97
|
{
|
|
98
98
|
ref: R,
|
|
99
99
|
startAction: w,
|
|
100
|
-
disabled:
|
|
100
|
+
disabled: s,
|
|
101
101
|
type: "text",
|
|
102
102
|
inputmode: "decimal",
|
|
103
|
-
onChange:
|
|
104
|
-
onKeyDown:
|
|
105
|
-
onBlur:
|
|
103
|
+
onChange: q,
|
|
104
|
+
onKeyDown: K,
|
|
105
|
+
onBlur: L,
|
|
106
106
|
value: a,
|
|
107
107
|
size: n,
|
|
108
108
|
endAction: /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(
|
|
109
109
|
h,
|
|
110
110
|
{
|
|
111
|
-
disabled:
|
|
111
|
+
disabled: s,
|
|
112
112
|
"aria-hidden": !0,
|
|
113
113
|
reverse: !0,
|
|
114
114
|
onClick: f,
|
|
@@ -120,7 +120,7 @@ const h = z.button`
|
|
|
120
120
|
), /* @__PURE__ */ t.createElement(
|
|
121
121
|
h,
|
|
122
122
|
{
|
|
123
|
-
disabled:
|
|
123
|
+
disabled: s,
|
|
124
124
|
"aria-hidden": !0,
|
|
125
125
|
onClick: b,
|
|
126
126
|
tabIndex: -1,
|
package/dist/Popover/Popover.cjs
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),w=require("react"),a=require("@floating-ui/react-dom"),y=require("styled-components"),u=require("../Box/Box.cjs"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),w=require("react"),a=require("@floating-ui/react-dom"),y=require("styled-components"),u=require("../Box/Box.cjs"),k=require("../hooks/useIntersection.cjs"),_=require("../Portal/Portal.cjs"),v=e=>e&&typeof e=="object"&&"default"in e?e:{default:e};function S(e){if(e&&e.__esModule)return e;const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const o in e)if(o!=="default"){const r=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(t,o,r.get?r:{enumerable:!0,get:()=>e[o]})}}return t.default=e,Object.freeze(t)}const l=S(w),f=v(y),O=["top","top-start","top-end","right","right-start","right-end","bottom","bottom-start","bottom-end","left","left-start","left-end"],$=f.default(u.Box)`
|
|
2
2
|
box-shadow: ${({theme:e})=>e.shadows.filterShadow};
|
|
3
3
|
z-index: 4;
|
|
4
4
|
border: 1px solid ${({theme:e})=>e.colors.neutral150};
|
|
5
5
|
background: ${({theme:e})=>e.colors.neutral0};
|
|
6
|
-
`,p=({source:e,children:t,spacing:o=0,fullWidth:r=!1,placement:s="bottom-start",centered:i=!1,...c})=>{const[h,g]=l.useState(void 0),{x:m,y:x,reference:d,floating:j,strategy:P}=a.useFloating({strategy:"fixed",placement:i?"bottom":s,middleware:[a.offset({mainAxis:o}),a.shift(),a.flip()],whileElementsMounted:a.autoUpdate});return l.useLayoutEffect(()=>{d(e.current)},[e,d]),l.useLayoutEffect(()=>{r&&g(e.current.offsetWidth)},[r,e]),n.jsx($,{ref:j,style:{left:m,top:x,position:P,width:h||void 0},hasRadius:!0,background:"neutral0",padding:1,...c,children:t})},b=({children:e,intersectionId:t,onReachEnd:o,...r})=>{const s=l.useRef(null);return
|
|
6
|
+
`,p=({source:e,children:t,spacing:o=0,fullWidth:r=!1,placement:s="bottom-start",centered:i=!1,...c})=>{const[h,g]=l.useState(void 0),{x:m,y:x,reference:d,floating:j,strategy:P}=a.useFloating({strategy:"fixed",placement:i?"bottom":s,middleware:[a.offset({mainAxis:o}),a.shift(),a.flip()],whileElementsMounted:a.autoUpdate});return l.useLayoutEffect(()=>{d(e.current)},[e,d]),l.useLayoutEffect(()=>{r&&g(e.current.offsetWidth)},[r,e]),n.jsx($,{ref:j,style:{left:m,top:x,position:P,width:h||void 0},hasRadius:!0,background:"neutral0",padding:1,...c,children:t})},b=({children:e,intersectionId:t,onReachEnd:o,...r})=>{const s=l.useRef(null);return k.useIntersection(s,o??(()=>{}),{selectorToWatch:`#${t}`,skipWhen:!t||!o}),n.jsxs(q,{ref:s,...r,children:[e,t&&o&&n.jsx(u.Box,{id:t,width:"100%",height:"1px"})]})},q=f.default(u.Box)`
|
|
7
7
|
// 16 is base base size, 3 is the factor to get closer to 40px and 5 is the number of elements visible in the list
|
|
8
8
|
max-height: ${3*5}rem;
|
|
9
9
|
overflow-y: auto;
|
|
@@ -23,4 +23,4 @@
|
|
|
23
23
|
border-radius: ${({theme:e})=>e.borderRadius};
|
|
24
24
|
margin-right: 10px;
|
|
25
25
|
}
|
|
26
|
-
`,E=({children:e,source:t,spacing:o,fullWidth:r,placement:s,centered:i,...c})=>n.jsx(
|
|
26
|
+
`,E=({children:e,source:t,spacing:o,fullWidth:r,placement:s,centered:i,...c})=>n.jsx(_.Portal,{children:n.jsx(p,{source:t,spacing:o,fullWidth:r,placement:s,centered:i,children:n.jsx(b,{...c,children:e})})});exports.Content=p;exports.POPOVER_PLACEMENTS=O;exports.Popover=E;exports.Scrolling=b;
|
package/dist/Popover/Popover.js
CHANGED
|
@@ -3,7 +3,7 @@ import * as a from "react";
|
|
|
3
3
|
import { useFloating as w, offset as k, shift as y, flip as $, autoUpdate as v } from "@floating-ui/react-dom";
|
|
4
4
|
import c from "styled-components";
|
|
5
5
|
import { Box as d } from "../Box/Box.js";
|
|
6
|
-
import { useIntersection as P } from "../
|
|
6
|
+
import { useIntersection as P } from "../hooks/useIntersection.js";
|
|
7
7
|
import { Portal as S } from "../Portal/Portal.js";
|
|
8
8
|
const T = ["top", "top-start", "top-end", "right", "right-start", "right-end", "bottom", "bottom-start", "bottom-end", "left", "left-start", "left-end"], W = c(d)`
|
|
9
9
|
box-shadow: ${({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const g=require("react/jsx-runtime"),l=require("react"),F=require("./RawTableContext.cjs"),v=require("../Box/Box.cjs"),s=require("../helpers/getFocusableNodes.cjs"),d=require("../helpers/keyboardKeys.cjs"),m=n=>g.jsx(y,{...n,as:"th"}),y=({coords:n,as:h="td",...x})=>{const a=l.useRef(null),{rowIndex:T,colIndex:E,setTableValues:N}=F.useTable(),[c,i]=l.useState(!1),K=e=>{const t=s.getFocusableNodes(a.current,!0);if(t.length===0||t.length===1&&s.getFocusableNodesWithKeyboardNav(t).length===0)return;if(t.length>1&&!t.find(u=>u.tagName!=="BUTTON")){e.preventDefault();const u=t.findIndex(r=>r===document.activeElement);if(e.key===d.KeyboardKeys.RIGHT){const r=t[u+1];r&&(e.stopPropagation(),r.focus())}else if(e.key===d.KeyboardKeys.LEFT){const r=t[u-1];r&&(e.stopPropagation(),r.focus())}return}const o=e.key===d.KeyboardKeys.ENTER;if(o&&!c)i(!0);else if((e.key===d.KeyboardKeys.ESCAPE||o)&&c){if(o&&document.activeElement?.tagName==="A")return;i(!1),a.current.focus()}else c&&e.stopPropagation()},f=T===n.row-1&&E===n.col-1;l.useLayoutEffect(()=>{const e=s.getFocusableNodes(a.current,!0);e.length===0||e.length===1&&s.getFocusableNodesWithKeyboardNav(e).length!==0||e.length>1&&Boolean(e.find(t=>t.tagName!=="BUTTON"))?(a.current.setAttribute("tabIndex",!c&&f?"0":"-1"),e.forEach((t,o)=>{t.setAttribute("tabIndex",c?"0":"-1"),c&&o===0&&t.focus()})):e.forEach(t=>{t.setAttribute("tabIndex",f?"0":"-1")})},[c,f]);const b=l.useCallback(()=>{const e=s.getFocusableNodes(a.current,!0);e.length>=1&&(s.getFocusableNodesWithKeyboardNav(e).length!==0||!e.find(t=>t.tagName!=="BUTTON"))&&i(!0),N({rowIndex:n.row-1,colIndex:n.col-1})},[n,N]);return l.useLayoutEffect(()=>{const e=a.current;return s.getFocusableNodes(e,!0).forEach(o=>{o.addEventListener("focus",b)}),()=>{s.getFocusableNodes(e,!0).forEach(u=>{u.removeEventListener("focus",b)})}},[b]),g.jsx(v.Box,{role:"gridcell",as:h,ref:a,onKeyDown:K,...x})};exports.RawTd=y;exports.RawTh=m;
|