@strapi/design-system 1.4.0-beta.0 → 1.4.0-beta.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/Accordion/Accordion.cjs +8 -8
- package/dist/Accordion/Accordion.js +6 -7
- package/dist/Accordion/AccordionContent.cjs +1 -1
- package/dist/Accordion/AccordionContent.js +37 -17
- package/dist/Accordion/AccordionToggle.cjs +6 -6
- package/dist/Accordion/AccordionToggle.js +96 -75
- package/dist/Alert/Alert.cjs +12 -12
- package/dist/Alert/Alert.js +102 -83
- package/dist/Badge/Badge.cjs +4 -1
- package/dist/Badge/Badge.js +56 -26
- package/dist/BaseButton/BaseButton.cjs +3 -3
- package/dist/BaseButton/BaseButton.js +42 -20
- package/dist/BaseCheckbox/BaseCheckbox.cjs +6 -6
- package/dist/BaseCheckbox/BaseCheckbox.js +56 -36
- package/dist/BaseLink/BaseLink.cjs +2 -2
- package/dist/BaseLink/BaseLink.js +43 -21
- package/dist/BaseRadio/BaseRadio.cjs +8 -8
- package/dist/BaseRadio/BaseRadio.js +51 -31
- package/dist/BaseRadio/RadioGroup.cjs +1 -1
- package/dist/BaseRadio/RadioGroup.js +44 -24
- package/dist/Box/BoxProps.cjs +1 -1
- package/dist/Box/BoxProps.js +19 -10
- package/dist/Breadcrumbs/Breadcrumbs.cjs +4 -4
- package/dist/Breadcrumbs/Breadcrumbs.js +50 -29
- package/dist/Button/Button.cjs +14 -14
- package/dist/Button/Button.js +73 -53
- package/dist/Card/Card.cjs +1 -1
- package/dist/Card/Card.js +37 -17
- package/dist/Card/CardAsset.cjs +4 -4
- package/dist/Card/CardAsset.js +42 -19
- package/dist/Card/CardBadge.cjs +3 -3
- package/dist/Card/CardBadge.js +18 -9
- package/dist/Card/CardBody.cjs +1 -1
- package/dist/Card/CardBody.js +19 -8
- package/dist/Card/CardCheckbox.cjs +1 -1
- package/dist/Card/CardCheckbox.js +22 -12
- package/dist/Card/CardContent.cjs +2 -2
- package/dist/Card/CardContent.js +32 -11
- package/dist/Card/CardHeader.cjs +2 -2
- package/dist/Card/CardHeader.js +19 -9
- package/dist/Card/CardTimer.cjs +2 -2
- package/dist/Card/CardTimer.js +42 -20
- package/dist/Card/CardTitle.cjs +1 -1
- package/dist/Card/CardTitle.js +27 -16
- package/dist/CarouselInput/Carousel.cjs +6 -6
- package/dist/CarouselInput/Carousel.js +107 -77
- package/dist/CarouselInput/CarouselActions.cjs +1 -1
- package/dist/CarouselInput/CarouselActions.js +17 -7
- package/dist/CarouselInput/CarouselImage.cjs +3 -3
- package/dist/CarouselInput/CarouselImage.js +38 -26
- package/dist/CarouselInput/CarouselInput.cjs +1 -1
- package/dist/CarouselInput/CarouselInput.js +84 -49
- package/dist/CarouselInput/CarouselSlide.cjs +2 -2
- package/dist/CarouselInput/CarouselSlide.js +42 -20
- package/dist/Checkbox/Checkbox.cjs +2 -2
- package/dist/Checkbox/Checkbox.js +63 -44
- package/dist/Combobox/Combobox.cjs +1 -1
- package/dist/Combobox/Combobox.js +262 -194
- package/dist/Combobox/ComboboxList.cjs +1 -1
- package/dist/Combobox/ComboboxList.js +5 -5
- package/dist/Combobox/ComboboxOption.cjs +1 -1
- package/dist/Combobox/ComboboxOption.js +47 -25
- package/dist/Combobox/components.cjs +2 -2
- package/dist/Combobox/components.js +1 -1
- package/dist/Combobox/utils.cjs +1 -1
- package/dist/Combobox/utils.js +21 -21
- package/dist/DatePicker/DatePicker.cjs +1 -1
- package/dist/DatePicker/DatePicker.js +110 -80
- package/dist/DatePicker/DatePickerCalendar.cjs +1 -1
- package/dist/DatePicker/DatePickerCalendar.js +18 -13
- package/dist/DatePicker/DatePickerTd.cjs +4 -4
- package/dist/DatePicker/DatePickerTd.js +42 -23
- package/dist/DatePicker/DatePickerTh.cjs +3 -3
- package/dist/DatePicker/DatePickerTh.js +44 -23
- package/dist/DatePicker/utils/getYears.cjs +1 -1
- package/dist/DatePicker/utils/getYears.js +7 -6
- package/dist/DateTimePicker/DateTimePicker.cjs +1 -1
- package/dist/DateTimePicker/DateTimePicker.js +124 -89
- package/dist/DateTimePicker/DateTimePickerProps.cjs +1 -1
- package/dist/DateTimePicker/DateTimePickerProps.js +19 -10
- package/dist/Dialog/Dialog.cjs +5 -5
- package/dist/Dialog/Dialog.js +58 -39
- package/dist/Dialog/DialogBody.cjs +2 -2
- package/dist/Dialog/DialogBody.js +14 -11
- package/dist/DismissibleLayer/DismissibleLayer.cjs +1 -1
- package/dist/DismissibleLayer/DismissibleLayer.js +22 -27
- package/dist/Divider/Divider.cjs +2 -2
- package/dist/Divider/Divider.js +38 -15
- package/dist/Field/Field.cjs +1 -1
- package/dist/Field/Field.js +38 -19
- package/dist/Field/FieldAction.cjs +2 -2
- package/dist/Field/FieldAction.js +35 -13
- package/dist/Field/FieldInput.cjs +6 -6
- package/dist/Field/FieldInput.js +67 -47
- package/dist/Field/FieldLabel.cjs +3 -3
- package/dist/Field/FieldLabel.js +45 -25
- package/dist/Flex/FlexProps.cjs +1 -1
- package/dist/Flex/FlexProps.js +20 -10
- package/dist/FocusTrap/ExampleComponent.cjs +1 -1
- package/dist/FocusTrap/ExampleComponent.js +3 -2
- package/dist/FocusTrap/FocusTrap.cjs +1 -1
- package/dist/FocusTrap/FocusTrap.js +56 -35
- package/dist/Grid/Grid.cjs +3 -3
- package/dist/Grid/Grid.js +42 -20
- package/dist/Grid/GridItem.cjs +2 -2
- package/dist/Grid/GridItem.js +41 -22
- package/dist/Icon/Icon.cjs +2 -2
- package/dist/Icon/Icon.js +27 -17
- package/dist/IconButton/IconButton.cjs +4 -4
- package/dist/IconButton/IconButton.js +68 -49
- package/dist/KeyboardNavigable/KeyboardNavigable.cjs +1 -1
- package/dist/KeyboardNavigable/KeyboardNavigable.js +58 -38
- package/dist/Layout/HeaderLayout.cjs +2 -2
- package/dist/Layout/HeaderLayout.js +96 -78
- package/dist/Link/Link.cjs +6 -6
- package/dist/Link/Link.js +59 -37
- package/dist/LinkButton/LinkButton.cjs +10 -10
- package/dist/LinkButton/LinkButton.js +71 -49
- package/dist/Loader/Loader.cjs +4 -4
- package/dist/Loader/Loader.js +47 -25
- package/dist/Main/Main.cjs +2 -2
- package/dist/Main/Main.js +35 -15
- package/dist/MainNav/MainNav.cjs +2 -2
- package/dist/MainNav/MainNav.js +39 -17
- package/dist/MainNav/NavCondense.cjs +3 -3
- package/dist/MainNav/NavCondense.js +40 -20
- package/dist/MainNav/NavLink.cjs +9 -9
- package/dist/MainNav/NavLink.js +72 -53
- package/dist/MainNav/NavSection.cjs +1 -1
- package/dist/MainNav/NavSection.js +67 -46
- package/dist/MainNav/NavSections.cjs +1 -1
- package/dist/MainNav/NavSections.js +40 -18
- package/dist/MainNav/NavUser.cjs +2 -2
- package/dist/MainNav/NavUser.js +51 -31
- package/dist/ModalLayout/ModalBody.cjs +2 -2
- package/dist/ModalLayout/ModalBody.js +19 -9
- package/dist/ModalLayout/ModalLayout.cjs +3 -3
- package/dist/ModalLayout/ModalLayout.js +52 -30
- package/dist/NumberInput/NumberInput.cjs +6 -6
- package/dist/NumberInput/NumberInput.js +149 -117
- package/dist/Pagination/components.cjs +7 -7
- package/dist/Pagination/components.js +88 -65
- package/dist/Popover/Popover.cjs +3 -3
- package/dist/Popover/Popover.js +93 -66
- package/dist/Portal/Portal.cjs +1 -1
- package/dist/Portal/Portal.js +12 -11
- package/dist/ProgressBar/ProgressBar.cjs +2 -2
- package/dist/ProgressBar/ProgressBar.js +49 -27
- package/dist/Radio/Radio.cjs +2 -2
- package/dist/Radio/Radio.js +40 -19
- package/dist/RawTable/RawCell.cjs +1 -1
- package/dist/RawTable/RawCell.js +97 -62
- package/dist/RawTable/RawTable.cjs +1 -1
- package/dist/RawTable/RawTable.js +67 -46
- package/dist/RawTable/RawTableContext.cjs +1 -1
- package/dist/RawTable/RawTableContext.js +1 -1
- package/dist/RawTable/RawTbody.cjs +1 -1
- package/dist/RawTable/RawTbody.js +30 -11
- package/dist/RawTable/RawThead.cjs +1 -1
- package/dist/RawTable/RawThead.js +29 -10
- package/dist/RawTable/RawTr.cjs +1 -1
- package/dist/RawTable/RawTr.js +34 -14
- package/dist/Searchbar/SearchForm.cjs +1 -1
- package/dist/Searchbar/SearchForm.js +16 -5
- package/dist/Searchbar/Searchbar.cjs +7 -7
- package/dist/Searchbar/Searchbar.js +65 -45
- package/dist/Select/MultiSelectNested.cjs +1 -1
- package/dist/Select/MultiSelectNested.js +45 -23
- package/dist/Select/OptGroup.cjs +1 -1
- package/dist/Select/OptGroup.js +35 -15
- package/dist/Select/Option.cjs +7 -7
- package/dist/Select/Option.js +57 -37
- package/dist/Select/Select.cjs +2 -2
- package/dist/Select/Select.js +187 -148
- package/dist/Select/SelectButton.cjs +2 -2
- package/dist/Select/SelectButton.js +53 -33
- package/dist/SimpleMenu/SimpleMenu.cjs +7 -7
- package/dist/SimpleMenu/SimpleMenu.js +143 -102
- package/dist/Stack/Stack.cjs +3 -3
- package/dist/Stack/Stack.js +50 -29
- package/dist/Status/Status.cjs +4 -4
- package/dist/Status/Status.js +50 -30
- package/dist/SubNav/SubNav.cjs +3 -3
- package/dist/SubNav/SubNav.js +37 -15
- package/dist/SubNav/SubNavHeader.cjs +2 -2
- package/dist/SubNav/SubNavHeader.js +44 -43
- package/dist/SubNav/SubNavLink.cjs +6 -6
- package/dist/SubNav/SubNavLink.js +61 -40
- package/dist/SubNav/SubNavLinkSection.cjs +4 -4
- package/dist/SubNav/SubNavLinkSection.js +8 -7
- package/dist/SubNav/SubNavSection.cjs +2 -2
- package/dist/SubNav/SubNavSection.js +11 -10
- package/dist/SubNav/SubNavSectionLabel.cjs +1 -1
- package/dist/SubNav/SubNavSectionLabel.js +1 -1
- package/dist/SubNav/SubNavSections.cjs +1 -1
- package/dist/SubNav/SubNavSections.js +39 -17
- package/dist/Switch/Switch.cjs +5 -5
- package/dist/Switch/Switch.js +57 -35
- package/dist/Table/Cell.cjs +3 -3
- package/dist/Table/Cell.js +40 -20
- package/dist/Table/TFooter.cjs +3 -3
- package/dist/Table/TFooter.js +50 -28
- package/dist/Table/Table.cjs +5 -5
- package/dist/Table/Table.js +59 -36
- package/dist/Table/Tbody.cjs +2 -2
- package/dist/Table/Tbody.js +17 -8
- package/dist/Table/Thead.cjs +2 -2
- package/dist/Table/Thead.js +17 -8
- package/dist/Table/Tr.cjs +2 -2
- package/dist/Table/Tr.js +17 -8
- package/dist/Tabs/TabGroup.cjs +1 -1
- package/dist/Tabs/TabGroup.js +46 -27
- package/dist/Tabs/TabPanels.cjs +1 -1
- package/dist/Tabs/TabPanels.js +43 -24
- package/dist/Tabs/Tabs.cjs +2 -2
- package/dist/Tabs/Tabs.js +112 -94
- package/dist/Tabs/useTabsFocus.cjs +1 -1
- package/dist/Tabs/useTabsFocus.js +12 -11
- package/dist/Tag/Tag.cjs +4 -4
- package/dist/Tag/Tag.js +50 -27
- package/dist/TextButton/TextButton.cjs +6 -6
- package/dist/TextButton/TextButton.js +59 -39
- package/dist/TextInput/TextInput.cjs +1 -1
- package/dist/TextInput/TextInput.js +69 -49
- package/dist/Textarea/Textarea.cjs +3 -3
- package/dist/Textarea/Textarea.js +63 -43
- package/dist/Textarea/TextareaInput.cjs +4 -4
- package/dist/Textarea/TextareaInput.js +49 -29
- package/dist/TimePicker/TimePicker.cjs +3 -3
- package/dist/TimePicker/TimePicker.js +93 -60
- package/dist/ToggleCheckbox/ToggleCheckbox.cjs +8 -8
- package/dist/ToggleCheckbox/ToggleCheckbox.js +75 -53
- package/dist/ToggleInput/ToggleInput.cjs +3 -3
- package/dist/ToggleInput/ToggleInput.js +98 -66
- package/dist/Tooltip/Tooltip.cjs +2 -2
- package/dist/Tooltip/Tooltip.js +57 -38
- package/dist/Tooltip/hooks/useTooltipLayout.cjs +1 -1
- package/dist/Tooltip/hooks/useTooltipLayout.js +9 -9
- package/dist/Typography/TypographyProps.cjs +1 -1
- package/dist/Typography/TypographyProps.js +22 -13
- package/dist/helpers/getDefaultLocale.cjs +1 -1
- package/dist/helpers/getDefaultLocale.js +1 -1
- package/dist/helpers/handleResponsiveValues.cjs +5 -5
- package/dist/helpers/handleResponsiveValues.js +14 -14
- package/dist/helpers/useIntersection.cjs +1 -1
- package/dist/helpers/useIntersection.js +13 -11
- package/dist/helpers/useResizeObserver.cjs +1 -1
- package/dist/helpers/useResizeObserver.js +10 -8
- package/dist/hooks/useControllableState.cjs +1 -0
- package/dist/hooks/useControllableState.js +25 -0
- package/dist/index.cjs +1 -1
- package/dist/index.js +285 -284
- package/dist/themes/ColorButton.cjs +2 -2
- package/dist/themes/ColorButton.js +4 -4
- package/dist/themes/darkTheme/index.cjs +1 -1
- package/dist/themes/darkTheme/index.js +18 -8
- package/dist/themes/extendTheme.cjs +5 -5
- package/dist/themes/extendTheme.js +30 -19
- package/dist/themes/lightTheme/index.cjs +1 -1
- package/dist/themes/lightTheme/index.js +18 -8
- package/dist/themes/sizes.cjs +1 -1
- package/dist/themes/sizes.js +4 -0
- package/dist/v2/Breadcrumbs/Breadcrumbs.cjs +2 -2
- package/dist/v2/Breadcrumbs/Breadcrumbs.js +43 -23
- package/dist/v2/Breadcrumbs/Crumb.cjs +1 -1
- package/dist/v2/Breadcrumbs/Crumb.js +44 -22
- package/dist/v2/Breadcrumbs/CrumbLink.cjs +2 -2
- package/dist/v2/Breadcrumbs/CrumbLink.js +35 -14
- package/dist/v2/Breadcrumbs/CrumbSimpleMenu.cjs +2 -2
- package/dist/v2/Breadcrumbs/CrumbSimpleMenu.js +41 -19
- package/dist/v2/Link/Link.cjs +5 -5
- package/dist/v2/Link/Link.js +64 -42
- package/dist/v2/LinkButton/LinkButton.cjs +10 -10
- package/dist/v2/LinkButton/LinkButton.js +77 -53
- package/dist/v2/MainNav/MainNav.cjs +2 -2
- package/dist/v2/MainNav/MainNav.js +39 -17
- package/dist/v2/MainNav/NavBrand.cjs +3 -3
- package/dist/v2/MainNav/NavBrand.js +78 -57
- package/dist/v2/MainNav/NavCondense.cjs +3 -3
- package/dist/v2/MainNav/NavCondense.js +40 -20
- package/dist/v2/MainNav/NavLink.cjs +9 -9
- package/dist/v2/MainNav/NavLink.js +77 -56
- package/dist/v2/MainNav/NavSection.cjs +1 -1
- package/dist/v2/MainNav/NavSection.js +67 -46
- package/dist/v2/MainNav/NavSections.cjs +1 -1
- package/dist/v2/MainNav/NavSections.js +40 -18
- package/dist/v2/MainNav/NavUser.cjs +2 -2
- package/dist/v2/MainNav/NavUser.js +51 -31
- package/dist/v2/Pagination/components.cjs +7 -7
- package/dist/v2/Pagination/components.js +89 -65
- package/dist/v2/SimpleMenu/SimpleMenu.cjs +7 -7
- package/dist/v2/SimpleMenu/SimpleMenu.js +155 -120
- package/dist/v2/SubNav/SubNav.cjs +3 -3
- package/dist/v2/SubNav/SubNav.js +37 -15
- package/dist/v2/SubNav/SubNavHeader.cjs +2 -2
- package/dist/v2/SubNav/SubNavHeader.js +44 -43
- package/dist/v2/SubNav/SubNavLink.cjs +6 -6
- package/dist/v2/SubNav/SubNavLink.js +64 -43
- package/dist/v2/SubNav/SubNavLinkSection.cjs +4 -4
- package/dist/v2/SubNav/SubNavLinkSection.js +8 -8
- package/dist/v2/SubNav/SubNavSection.cjs +2 -2
- package/dist/v2/SubNav/SubNavSection.js +1 -1
- package/dist/v2/SubNav/SubNavSectionLabel.cjs +1 -1
- package/dist/v2/SubNav/SubNavSectionLabel.js +1 -1
- package/dist/v2/SubNav/SubNavSections.cjs +1 -1
- package/dist/v2/SubNav/SubNavSections.js +39 -17
- package/package.json +8 -15
|
@@ -1,8 +1,19 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
var f = Object.defineProperty, l = Object.defineProperties;
|
|
2
|
+
var h = Object.getOwnPropertyDescriptors;
|
|
3
|
+
var t = Object.getOwnPropertySymbols;
|
|
4
|
+
var n = Object.prototype.hasOwnProperty, p = Object.prototype.propertyIsEnumerable;
|
|
5
|
+
var a = (r, e, o) => e in r ? f(r, e, { enumerable: !0, configurable: !0, writable: !0, value: o }) : r[e] = o, c = (r, e) => {
|
|
6
|
+
for (var o in e || (e = {}))
|
|
7
|
+
n.call(e, o) && a(r, o, e[o]);
|
|
8
|
+
if (t)
|
|
9
|
+
for (var o of t(e))
|
|
10
|
+
p.call(e, o) && a(r, o, e[o]);
|
|
11
|
+
return r;
|
|
12
|
+
}, m = (r, e) => l(r, h(e));
|
|
13
|
+
import s from "react";
|
|
14
|
+
const i = (r) => /* @__PURE__ */ s.createElement("form", m(c({}, r), {
|
|
4
15
|
role: "search"
|
|
5
|
-
});
|
|
16
|
+
}));
|
|
6
17
|
export {
|
|
7
|
-
|
|
18
|
+
i as SearchForm
|
|
8
19
|
};
|
|
@@ -1,29 +1,29 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use strict";var $=Object.defineProperty;var n=Object.getOwnPropertySymbols;var h=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable;var F=(e,l,t)=>l in e?$(e,l,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[l]=t,m=(e,l)=>{for(var t in l||(l={}))h.call(l,t)&&F(e,t,l[t]);if(n)for(var t of n(l))y.call(l,t)&&F(e,t,l[t]);return e};var q=(e,l)=>{var t={};for(var r in e)h.call(e,r)&&l.indexOf(r)<0&&(t[r]=e[r]);if(e!=null&&n)for(var r of n(e))l.indexOf(r)<0&&y.call(e,r)&&(t[r]=e[r]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("react"),z=require("prop-types"),I=require("styled-components"),T=require("@strapi/icons/Search"),w=require("@strapi/icons/Cross"),A=require("../themes/sizes.cjs"),L=require("../Field/Field.cjs"),W=require("../Field/FieldLabel.cjs"),d=require("../Field/FieldInput.cjs");require("../Field/FieldContext.cjs");require("../Typography/Typography.cjs");const H=require("../Field/FieldAction.cjs"),P=require("../VisuallyHidden/VisuallyHidden.cjs"),V=require("../themes/utils.cjs"),b=require("../Flex/Flex.cjs"),i=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},s=i(c),a=i(z),o=i(I),M=i(T),O=i(w),k=o.default(b.Flex)`
|
|
2
2
|
font-size: 0.5rem;
|
|
3
3
|
svg path {
|
|
4
4
|
fill: ${({theme:e})=>e.colors.neutral400};
|
|
5
5
|
}
|
|
6
|
-
`,o
|
|
6
|
+
`,g=o.default(b.Flex)`
|
|
7
7
|
font-size: 0.8rem;
|
|
8
8
|
|
|
9
9
|
svg path {
|
|
10
10
|
fill: ${({theme:e})=>e.colors.neutral800};
|
|
11
11
|
}
|
|
12
|
-
`,
|
|
12
|
+
`,D=o.default.div`
|
|
13
13
|
border-radius: ${({theme:e})=>e.borderRadius};
|
|
14
14
|
box-shadow: ${({theme:e})=>e.shadows.filterShadow};
|
|
15
15
|
|
|
16
16
|
&:focus-within {
|
|
17
|
-
${
|
|
17
|
+
${g} {
|
|
18
18
|
svg path {
|
|
19
19
|
fill: ${({theme:e})=>e.colors.primary600};
|
|
20
20
|
}
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
23
|
|
|
24
|
-
${
|
|
24
|
+
${d.InputWrapper} {
|
|
25
25
|
border: 1px solid transparent;
|
|
26
26
|
}
|
|
27
27
|
|
|
28
|
-
${
|
|
29
|
-
`,
|
|
28
|
+
${V.inputFocusStyle(d.InputWrapper)}
|
|
29
|
+
`,u=c.forwardRef((N,R)=>{var f=N,{name:e,size:l,children:t,value:r,onClear:j,clearLabel:_}=f,S=q(f,["name","size","children","value","onClear","clearLabel"]);const p=c.useRef(null),E=r.length>0,C=x=>{j(x),p.current.focus()},v=R||p;return s.default.createElement(D,null,s.default.createElement(L.Field,{name:e},s.default.createElement(P.VisuallyHidden,null,s.default.createElement(W.FieldLabel,null,t)),s.default.createElement(d.FieldInput,m({ref:v,value:r,startAction:s.default.createElement(g,null,s.default.createElement(M.default,{"aria-hidden":!0})),size:l,endAction:E?s.default.createElement(H.FieldAction,{label:_,onClick:C},s.default.createElement(k,null,s.default.createElement(O.default,null))):void 0},S))))});u.displayName="Searchbar";u.defaultProps={value:"",size:"M"};u.propTypes={children:a.default.node.isRequired,clearLabel:a.default.string.isRequired,name:a.default.string.isRequired,onClear:a.default.func.isRequired,size:a.default.oneOf(Object.keys(A.sizes.input)),value:a.default.string};exports.Searchbar=u;
|
|
@@ -1,79 +1,99 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
1
|
+
var z = Object.defineProperty;
|
|
2
|
+
var n = Object.getOwnPropertySymbols;
|
|
3
|
+
var u = Object.prototype.hasOwnProperty, d = Object.prototype.propertyIsEnumerable;
|
|
4
|
+
var c = (e, t, r) => t in e ? z(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r, f = (e, t) => {
|
|
5
|
+
for (var r in t || (t = {}))
|
|
6
|
+
u.call(t, r) && c(e, r, t[r]);
|
|
7
|
+
if (n)
|
|
8
|
+
for (var r of n(t))
|
|
9
|
+
d.call(t, r) && c(e, r, t[r]);
|
|
10
|
+
return e;
|
|
11
|
+
};
|
|
12
|
+
var h = (e, t) => {
|
|
13
|
+
var r = {};
|
|
14
|
+
for (var o in e)
|
|
15
|
+
u.call(e, o) && t.indexOf(o) < 0 && (r[o] = e[o]);
|
|
16
|
+
if (e != null && n)
|
|
17
|
+
for (var o of n(e))
|
|
18
|
+
t.indexOf(o) < 0 && d.call(e, o) && (r[o] = e[o]);
|
|
19
|
+
return r;
|
|
20
|
+
};
|
|
21
|
+
import l, { forwardRef as q, useRef as x } from "react";
|
|
22
|
+
import i from "prop-types";
|
|
23
|
+
import a from "styled-components";
|
|
24
|
+
import I from "@strapi/icons/Search";
|
|
25
|
+
import W from "@strapi/icons/Cross";
|
|
26
|
+
import { sizes as A } from "../themes/sizes.js";
|
|
27
|
+
import { Field as k } from "../Field/Field.js";
|
|
28
|
+
import { FieldLabel as L } from "../Field/FieldLabel.js";
|
|
29
|
+
import { InputWrapper as b, FieldInput as O } from "../Field/FieldInput.js";
|
|
10
30
|
import "../Field/FieldContext.js";
|
|
11
31
|
import "../Typography/Typography.js";
|
|
12
|
-
import { FieldAction as
|
|
13
|
-
import { VisuallyHidden as
|
|
14
|
-
import { inputFocusStyle as
|
|
15
|
-
import { Flex as
|
|
16
|
-
const
|
|
32
|
+
import { FieldAction as P } from "../Field/FieldAction.js";
|
|
33
|
+
import { VisuallyHidden as T } from "../VisuallyHidden/VisuallyHidden.js";
|
|
34
|
+
import { inputFocusStyle as _ } from "../themes/utils.js";
|
|
35
|
+
import { Flex as E } from "../Flex/Flex.js";
|
|
36
|
+
const j = a(E)`
|
|
17
37
|
font-size: 0.5rem;
|
|
18
38
|
svg path {
|
|
19
39
|
fill: ${({ theme: e }) => e.colors.neutral400};
|
|
20
40
|
}
|
|
21
|
-
`,
|
|
41
|
+
`, R = a(E)`
|
|
22
42
|
font-size: 0.8rem;
|
|
23
43
|
|
|
24
44
|
svg path {
|
|
25
45
|
fill: ${({ theme: e }) => e.colors.neutral800};
|
|
26
46
|
}
|
|
27
|
-
`,
|
|
47
|
+
`, H = a.div`
|
|
28
48
|
border-radius: ${({ theme: e }) => e.borderRadius};
|
|
29
49
|
box-shadow: ${({ theme: e }) => e.shadows.filterShadow};
|
|
30
50
|
|
|
31
51
|
&:focus-within {
|
|
32
|
-
${
|
|
52
|
+
${R} {
|
|
33
53
|
svg path {
|
|
34
54
|
fill: ${({ theme: e }) => e.colors.primary600};
|
|
35
55
|
}
|
|
36
56
|
}
|
|
37
57
|
}
|
|
38
58
|
|
|
39
|
-
${
|
|
59
|
+
${b} {
|
|
40
60
|
border: 1px solid transparent;
|
|
41
61
|
}
|
|
42
62
|
|
|
43
|
-
${
|
|
44
|
-
`,
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
63
|
+
${_(b)}
|
|
64
|
+
`, s = q((M, S) => {
|
|
65
|
+
var m = M, { name: e, size: t, children: r, value: o, onClear: g, clearLabel: y } = m, $ = h(m, ["name", "size", "children", "value", "onClear", "clearLabel"]);
|
|
66
|
+
const p = x(null), v = o.length > 0, C = (w) => {
|
|
67
|
+
g(w), p.current.focus();
|
|
68
|
+
}, F = S || p;
|
|
69
|
+
return /* @__PURE__ */ l.createElement(H, null, /* @__PURE__ */ l.createElement(k, {
|
|
49
70
|
name: e
|
|
50
|
-
}, /* @__PURE__ */
|
|
51
|
-
ref:
|
|
52
|
-
value:
|
|
53
|
-
startAction: /* @__PURE__ */
|
|
71
|
+
}, /* @__PURE__ */ l.createElement(T, null, /* @__PURE__ */ l.createElement(L, null, r)), /* @__PURE__ */ l.createElement(O, f({
|
|
72
|
+
ref: F,
|
|
73
|
+
value: o,
|
|
74
|
+
startAction: /* @__PURE__ */ l.createElement(R, null, /* @__PURE__ */ l.createElement(I, {
|
|
54
75
|
"aria-hidden": !0
|
|
55
76
|
})),
|
|
56
|
-
size:
|
|
57
|
-
endAction:
|
|
58
|
-
label:
|
|
59
|
-
onClick:
|
|
60
|
-
}, /* @__PURE__ */
|
|
61
|
-
|
|
62
|
-
})));
|
|
77
|
+
size: t,
|
|
78
|
+
endAction: v ? /* @__PURE__ */ l.createElement(P, {
|
|
79
|
+
label: y,
|
|
80
|
+
onClick: C
|
|
81
|
+
}, /* @__PURE__ */ l.createElement(j, null, /* @__PURE__ */ l.createElement(W, null))) : void 0
|
|
82
|
+
}, $))));
|
|
63
83
|
});
|
|
64
|
-
|
|
65
|
-
|
|
84
|
+
s.displayName = "Searchbar";
|
|
85
|
+
s.defaultProps = {
|
|
66
86
|
value: "",
|
|
67
87
|
size: "M"
|
|
68
88
|
};
|
|
69
|
-
|
|
70
|
-
children:
|
|
71
|
-
clearLabel:
|
|
72
|
-
name:
|
|
73
|
-
onClear:
|
|
74
|
-
size:
|
|
75
|
-
value:
|
|
89
|
+
s.propTypes = {
|
|
90
|
+
children: i.node.isRequired,
|
|
91
|
+
clearLabel: i.string.isRequired,
|
|
92
|
+
name: i.string.isRequired,
|
|
93
|
+
onClear: i.func.isRequired,
|
|
94
|
+
size: i.oneOf(Object.keys(A.input)),
|
|
95
|
+
value: i.string
|
|
76
96
|
};
|
|
77
97
|
export {
|
|
78
|
-
|
|
98
|
+
s as Searchbar
|
|
79
99
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use strict";var j=Object.defineProperty;var a=Object.getOwnPropertySymbols;var f=Object.prototype.hasOwnProperty,i=Object.prototype.propertyIsEnumerable;var n=(e,t,u)=>t in e?j(e,t,{enumerable:!0,configurable:!0,writable:!0,value:u}):e[t]=u,y=(e,t)=>{for(var u in t||(t={}))f.call(t,u)&&n(e,u,t[u]);if(a)for(var u of a(t))i.call(t,u)&&n(e,u,t[u]);return e};var d=(e,t)=>{var u={};for(var o in e)f.call(e,o)&&t.indexOf(o)<0&&(u[o]=e[o]);if(e!=null&&a)for(var o of a(e))t.indexOf(o)<0&&i.call(e,o)&&(u[o]=e[o]);return u};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const q=require("react"),v=require("prop-types"),E=require("./OptGroup.cjs"),O=require("./Option.cjs"),M=require("./Select.cjs"),S=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},p=S(q),m=S(v),_=u=>{var o=u,{options:e}=o,t=d(o,["options"]);return p.default.createElement(M.Select,y({multi:!0},t),e.map(({label:s,value:l,children:r})=>r?p.default.createElement(E.OptGroup,{key:s,label:s},r==null?void 0:r.map(c=>p.default.createElement(O.Option,{key:c.value,value:c.value},c.label))):p.default.createElement(O.Option,{key:l,value:l},s)))};_.propTypes={options:m.default.arrayOf(m.default.object).isRequired};exports.MultiSelectNested=_;
|
|
@@ -1,26 +1,48 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
1
|
+
var l = Object.defineProperty;
|
|
2
|
+
var p = Object.getOwnPropertySymbols;
|
|
3
|
+
var i = Object.prototype.hasOwnProperty, E = Object.prototype.propertyIsEnumerable;
|
|
4
|
+
var y = (e, t, o) => t in e ? l(e, t, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[t] = o, k = (e, t) => {
|
|
5
|
+
for (var o in t || (t = {}))
|
|
6
|
+
i.call(t, o) && y(e, o, t[o]);
|
|
7
|
+
if (p)
|
|
8
|
+
for (var o of p(t))
|
|
9
|
+
E.call(t, o) && y(e, o, t[o]);
|
|
10
|
+
return e;
|
|
11
|
+
};
|
|
12
|
+
var n = (e, t) => {
|
|
13
|
+
var o = {};
|
|
14
|
+
for (var r in e)
|
|
15
|
+
i.call(e, r) && t.indexOf(r) < 0 && (o[r] = e[r]);
|
|
16
|
+
if (e != null && p)
|
|
17
|
+
for (var r of p(e))
|
|
18
|
+
t.indexOf(r) < 0 && E.call(e, r) && (o[r] = e[r]);
|
|
19
|
+
return o;
|
|
20
|
+
};
|
|
21
|
+
import a from "react";
|
|
22
|
+
import O from "prop-types";
|
|
23
|
+
import { OptGroup as v } from "./OptGroup.js";
|
|
24
|
+
import { Option as c } from "./Option.js";
|
|
25
|
+
import { Select as R } from "./Select.js";
|
|
26
|
+
const S = (o) => {
|
|
27
|
+
var r = o, { options: e } = r, t = n(r, ["options"]);
|
|
28
|
+
return /* @__PURE__ */ a.createElement(R, k({
|
|
29
|
+
multi: !0
|
|
30
|
+
}, t), e.map(
|
|
31
|
+
({ label: u, value: s, children: m }) => m ? /* @__PURE__ */ a.createElement(v, {
|
|
32
|
+
key: u,
|
|
33
|
+
label: u
|
|
34
|
+
}, m == null ? void 0 : m.map((f) => /* @__PURE__ */ a.createElement(c, {
|
|
35
|
+
key: f.value,
|
|
36
|
+
value: f.value
|
|
37
|
+
}, f.label))) : /* @__PURE__ */ a.createElement(c, {
|
|
38
|
+
key: s,
|
|
39
|
+
value: s
|
|
40
|
+
}, u)
|
|
41
|
+
));
|
|
42
|
+
};
|
|
43
|
+
S.propTypes = {
|
|
44
|
+
options: O.arrayOf(O.object).isRequired
|
|
23
45
|
};
|
|
24
46
|
export {
|
|
25
|
-
|
|
47
|
+
S as MultiSelectNested
|
|
26
48
|
};
|
package/dist/Select/OptGroup.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use strict";var m=Object.defineProperty;var o=Object.getOwnPropertySymbols;var i=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable;var s=(e,t,r)=>t in e?m(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,c=(e,t)=>{for(var r in t||(t={}))i.call(t,r)&&s(e,r,t[r]);if(o)for(var r of o(t))d.call(t,r)&&s(e,r,t[r]);return e};var f=(e,t)=>{var r={};for(var a in e)i.call(e,a)&&t.indexOf(a)<0&&(r[a]=e[a]);if(e!=null&&o)for(var a of o(e))t.indexOf(a)<0&&d.call(e,a)&&(r[a]=e[a]);return r};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const _=require("prop-types"),q=require("react"),b=require("./Option.cjs"),y=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},u=y(_),p=y(q),l=a=>{var n=a,{children:e,label:t}=n,r=f(n,["children","label"]);const g=e.map(O=>O.props.value);return p.default.createElement(p.default.Fragment,null,p.default.createElement(b.Option,c({"data-opt-group":!0,"data-opt-group-children":g,"aria-label":`${t}, ${e.length} items`},r),t),e)};l.propTypes={children:u.default.arrayOf(u.default.node).isRequired,label:u.default.string.isRequired};l.displayName="OptGroup";exports.OptGroup=l;
|
package/dist/Select/OptGroup.js
CHANGED
|
@@ -1,20 +1,40 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
var y = Object.defineProperty;
|
|
2
|
+
var o = Object.getOwnPropertySymbols;
|
|
3
|
+
var n = Object.prototype.hasOwnProperty, u = Object.prototype.propertyIsEnumerable;
|
|
4
|
+
var m = (e, r, t) => r in e ? y(e, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[r] = t, s = (e, r) => {
|
|
5
|
+
for (var t in r || (r = {}))
|
|
6
|
+
n.call(r, t) && m(e, t, r[t]);
|
|
7
|
+
if (o)
|
|
8
|
+
for (var t of o(r))
|
|
9
|
+
u.call(r, t) && m(e, t, r[t]);
|
|
10
|
+
return e;
|
|
11
|
+
};
|
|
12
|
+
var d = (e, r) => {
|
|
13
|
+
var t = {};
|
|
14
|
+
for (var p in e)
|
|
15
|
+
n.call(e, p) && r.indexOf(p) < 0 && (t[p] = e[p]);
|
|
16
|
+
if (e != null && o)
|
|
17
|
+
for (var p of o(e))
|
|
18
|
+
r.indexOf(p) < 0 && u.call(e, p) && (t[p] = e[p]);
|
|
19
|
+
return t;
|
|
20
|
+
};
|
|
21
|
+
import a from "prop-types";
|
|
22
|
+
import i from "react";
|
|
23
|
+
import { Option as O } from "./Option.js";
|
|
24
|
+
const c = (p) => {
|
|
25
|
+
var l = p, { children: e, label: r } = l, t = d(l, ["children", "label"]);
|
|
26
|
+
const f = e.map((g) => g.props.value);
|
|
27
|
+
return /* @__PURE__ */ i.createElement(i.Fragment, null, /* @__PURE__ */ i.createElement(O, s({
|
|
7
28
|
"data-opt-group": !0,
|
|
8
|
-
"data-opt-group-children":
|
|
9
|
-
"aria-label": `${
|
|
10
|
-
|
|
11
|
-
}, p), e);
|
|
29
|
+
"data-opt-group-children": f,
|
|
30
|
+
"aria-label": `${r}, ${e.length} items`
|
|
31
|
+
}, t), r), e);
|
|
12
32
|
};
|
|
13
|
-
|
|
14
|
-
children:
|
|
15
|
-
label:
|
|
33
|
+
c.propTypes = {
|
|
34
|
+
children: a.arrayOf(a.node).isRequired,
|
|
35
|
+
label: a.string.isRequired
|
|
16
36
|
};
|
|
17
|
-
|
|
37
|
+
c.displayName = "OptGroup";
|
|
18
38
|
export {
|
|
19
|
-
|
|
39
|
+
c as OptGroup
|
|
20
40
|
};
|
package/dist/Select/Option.cjs
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use strict";var v=Object.defineProperty;var n=Object.getOwnPropertySymbols;var f=Object.prototype.hasOwnProperty,g=Object.prototype.propertyIsEnumerable;var p=(e,t,o)=>t in e?v(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,h=(e,t)=>{for(var o in t||(t={}))f.call(t,o)&&p(e,o,t[o]);if(n)for(var o of n(t))g.call(t,o)&&p(e,o,t[o]);return e};var y=(e,t)=>{var o={};for(var r in e)f.call(e,r)&&t.indexOf(r)<0&&(o[r]=e[r]);if(e!=null&&n)for(var r of n(e))t.indexOf(r)<0&&g.call(e,r)&&(o[r]=e[r]);return o};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const b=require("react"),q=require("prop-types"),B=require("styled-components"),d=require("../Box/Box.cjs"),_=require("../Typography/Typography.cjs"),$=require("../Flex/Flex.cjs"),O=require("../BaseCheckbox/assets/checkmark.cjs"),s=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},l=s(b),a=s(q),m=s(B),j=m.default.div`
|
|
2
2
|
border: 1px solid
|
|
3
|
-
${({theme:e,selected:
|
|
3
|
+
${({theme:e,selected:t,indeterminate:o})=>t||o?e.colors.primary600:e.colors.neutral300};
|
|
4
4
|
border-radius: ${({theme:e})=>e.borderRadius};
|
|
5
5
|
height: 18px;
|
|
6
6
|
width: 18px;
|
|
7
7
|
position: relative;
|
|
8
8
|
z-index: 1;
|
|
9
9
|
overflow: hidden;
|
|
10
|
-
background-color: ${({theme:e,selected:
|
|
10
|
+
background-color: ${({theme:e,selected:t,indeterminate:o})=>t||o?e.colors.primary600:e.colors.neutral0};
|
|
11
11
|
|
|
12
|
-
${({theme:e,indeterminate:
|
|
12
|
+
${({theme:e,indeterminate:t})=>t&&`&::after {
|
|
13
13
|
content: '';
|
|
14
14
|
display: block;
|
|
15
15
|
position: relative;
|
|
@@ -27,14 +27,14 @@
|
|
|
27
27
|
${({selected:e})=>e&&`
|
|
28
28
|
&::after {
|
|
29
29
|
content: '';
|
|
30
|
-
background: url(${
|
|
30
|
+
background: url(${O}) no-repeat no-repeat center center;
|
|
31
31
|
width: 100%;
|
|
32
32
|
height: 100%;
|
|
33
33
|
position: absolute;
|
|
34
34
|
}
|
|
35
35
|
|
|
36
36
|
`}
|
|
37
|
-
`,
|
|
37
|
+
`,w=m.default(d.Box)`
|
|
38
38
|
width: 100%;
|
|
39
39
|
border: none;
|
|
40
40
|
text-align: left;
|
|
@@ -46,4 +46,4 @@
|
|
|
46
46
|
&:hover {
|
|
47
47
|
background: ${({theme:e})=>e.colors.primary100};
|
|
48
48
|
}
|
|
49
|
-
`,
|
|
49
|
+
`,i=E=>{var c=E,{selected:e,indeterminate:t,children:o,value:r,multi:x,isChild:k,startIcon:u}=c,R=y(c,["selected","indeterminate","children","value","multi","isChild","startIcon"]);const T=b.useRef(null);return l.default.createElement(w,h({as:"li",hasRadius:!0,paddingLeft:k?7:4,paddingRight:4,paddingTop:2,paddingBottom:2,ref:T,role:"option","aria-selected":e,background:"neutral0","data-strapi-value":r},R),l.default.createElement($.Flex,null,u&&l.default.createElement(d.Box,{paddingRight:2,"aria-hidden":!0},u),x&&l.default.createElement(d.Box,{paddingRight:2,"aria-hidden":!0},l.default.createElement(j,{selected:e,indeterminate:t})),l.default.createElement(_.Typography,{textColor:e?"primary600":"neutral800",fontWeight:e?"bold":null},o)))};i.defaultProps={isChild:!1,multi:!1,selected:!1,startIcon:void 0,indeterminate:!1};i.propTypes={children:a.default.oneOfType([a.default.string,a.default.number]).isRequired,indeterminate:a.default.bool,isChild:a.default.bool,multi:a.default.bool,selected:a.default.bool,startIcon:a.default.node,value:a.default.oneOfType([a.default.string,a.default.number]).isRequired};i.displayName="Option";exports.Option=i;
|
package/dist/Select/Option.js
CHANGED
|
@@ -1,22 +1,42 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
var R = Object.defineProperty;
|
|
2
|
+
var n = Object.getOwnPropertySymbols;
|
|
3
|
+
var u = Object.prototype.hasOwnProperty, m = Object.prototype.propertyIsEnumerable;
|
|
4
|
+
var c = (e, o, r) => o in e ? R(e, o, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[o] = r, f = (e, o) => {
|
|
5
|
+
for (var r in o || (o = {}))
|
|
6
|
+
u.call(o, r) && c(e, r, o[r]);
|
|
7
|
+
if (n)
|
|
8
|
+
for (var r of n(o))
|
|
9
|
+
m.call(o, r) && c(e, r, o[r]);
|
|
10
|
+
return e;
|
|
11
|
+
};
|
|
12
|
+
var h = (e, o) => {
|
|
13
|
+
var r = {};
|
|
14
|
+
for (var t in e)
|
|
15
|
+
u.call(e, t) && o.indexOf(t) < 0 && (r[t] = e[t]);
|
|
16
|
+
if (e != null && n)
|
|
17
|
+
for (var t of n(e))
|
|
18
|
+
o.indexOf(t) < 0 && m.call(e, t) && (r[t] = e[t]);
|
|
19
|
+
return r;
|
|
20
|
+
};
|
|
21
|
+
import a, { useRef as $ } from "react";
|
|
22
|
+
import i from "prop-types";
|
|
23
|
+
import g from "styled-components";
|
|
24
|
+
import { Box as l } from "../Box/Box.js";
|
|
25
|
+
import { Typography as v } from "../Typography/Typography.js";
|
|
26
|
+
import { Flex as w } from "../Flex/Flex.js";
|
|
27
|
+
import E from "../BaseCheckbox/assets/checkmark.js";
|
|
28
|
+
const T = g.div`
|
|
9
29
|
border: 1px solid
|
|
10
|
-
${({ theme: e, selected:
|
|
30
|
+
${({ theme: e, selected: o, indeterminate: r }) => o || r ? e.colors.primary600 : e.colors.neutral300};
|
|
11
31
|
border-radius: ${({ theme: e }) => e.borderRadius};
|
|
12
32
|
height: 18px;
|
|
13
33
|
width: 18px;
|
|
14
34
|
position: relative;
|
|
15
35
|
z-index: 1;
|
|
16
36
|
overflow: hidden;
|
|
17
|
-
background-color: ${({ theme: e, selected:
|
|
37
|
+
background-color: ${({ theme: e, selected: o, indeterminate: r }) => o || r ? e.colors.primary600 : e.colors.neutral0};
|
|
18
38
|
|
|
19
|
-
${({ theme: e, indeterminate:
|
|
39
|
+
${({ theme: e, indeterminate: o }) => o && `&::after {
|
|
20
40
|
content: '';
|
|
21
41
|
display: block;
|
|
22
42
|
position: relative;
|
|
@@ -34,14 +54,14 @@ const y = d.div`
|
|
|
34
54
|
${({ selected: e }) => e && `
|
|
35
55
|
&::after {
|
|
36
56
|
content: '';
|
|
37
|
-
background: url(${
|
|
57
|
+
background: url(${E}) no-repeat no-repeat center center;
|
|
38
58
|
width: 100%;
|
|
39
59
|
height: 100%;
|
|
40
60
|
position: absolute;
|
|
41
61
|
}
|
|
42
62
|
|
|
43
63
|
`}
|
|
44
|
-
`,
|
|
64
|
+
`, O = g(l)`
|
|
45
65
|
width: 100%;
|
|
46
66
|
border: none;
|
|
47
67
|
text-align: left;
|
|
@@ -53,52 +73,52 @@ const y = d.div`
|
|
|
53
73
|
&:hover {
|
|
54
74
|
background: ${({ theme: e }) => e.colors.primary100};
|
|
55
75
|
}
|
|
56
|
-
`,
|
|
57
|
-
|
|
58
|
-
|
|
76
|
+
`, d = (C) => {
|
|
77
|
+
var s = C, { selected: e, indeterminate: o, children: r, value: t, multi: b, isChild: y, startIcon: p } = s, x = h(s, ["selected", "indeterminate", "children", "value", "multi", "isChild", "startIcon"]);
|
|
78
|
+
const k = $(null);
|
|
79
|
+
return /* @__PURE__ */ a.createElement(O, f({
|
|
59
80
|
as: "li",
|
|
60
81
|
hasRadius: !0,
|
|
61
|
-
paddingLeft:
|
|
82
|
+
paddingLeft: y ? 7 : 4,
|
|
62
83
|
paddingRight: 4,
|
|
63
84
|
paddingTop: 2,
|
|
64
85
|
paddingBottom: 2,
|
|
65
|
-
ref:
|
|
86
|
+
ref: k,
|
|
66
87
|
role: "option",
|
|
67
88
|
"aria-selected": e,
|
|
68
89
|
background: "neutral0",
|
|
69
|
-
"data-strapi-value":
|
|
70
|
-
|
|
71
|
-
}, /* @__PURE__ */ t.createElement(g, null, l && /* @__PURE__ */ t.createElement(a, {
|
|
90
|
+
"data-strapi-value": t
|
|
91
|
+
}, x), /* @__PURE__ */ a.createElement(w, null, p && /* @__PURE__ */ a.createElement(l, {
|
|
72
92
|
paddingRight: 2,
|
|
73
93
|
"aria-hidden": !0
|
|
74
|
-
},
|
|
94
|
+
}, p), b && /* @__PURE__ */ a.createElement(l, {
|
|
75
95
|
paddingRight: 2,
|
|
76
96
|
"aria-hidden": !0
|
|
77
|
-
}, /* @__PURE__ */
|
|
97
|
+
}, /* @__PURE__ */ a.createElement(T, {
|
|
78
98
|
selected: e,
|
|
79
|
-
indeterminate:
|
|
80
|
-
})), /* @__PURE__ */
|
|
99
|
+
indeterminate: o
|
|
100
|
+
})), /* @__PURE__ */ a.createElement(v, {
|
|
81
101
|
textColor: e ? "primary600" : "neutral800",
|
|
82
102
|
fontWeight: e ? "bold" : null
|
|
83
|
-
},
|
|
103
|
+
}, r)));
|
|
84
104
|
};
|
|
85
|
-
|
|
105
|
+
d.defaultProps = {
|
|
86
106
|
isChild: !1,
|
|
87
107
|
multi: !1,
|
|
88
108
|
selected: !1,
|
|
89
109
|
startIcon: void 0,
|
|
90
110
|
indeterminate: !1
|
|
91
111
|
};
|
|
92
|
-
|
|
93
|
-
children:
|
|
94
|
-
indeterminate:
|
|
95
|
-
isChild:
|
|
96
|
-
multi:
|
|
97
|
-
selected:
|
|
98
|
-
startIcon:
|
|
99
|
-
value:
|
|
112
|
+
d.propTypes = {
|
|
113
|
+
children: i.oneOfType([i.string, i.number]).isRequired,
|
|
114
|
+
indeterminate: i.bool,
|
|
115
|
+
isChild: i.bool,
|
|
116
|
+
multi: i.bool,
|
|
117
|
+
selected: i.bool,
|
|
118
|
+
startIcon: i.node,
|
|
119
|
+
value: i.oneOfType([i.string, i.number]).isRequired
|
|
100
120
|
};
|
|
101
|
-
|
|
121
|
+
d.displayName = "Option";
|
|
102
122
|
export {
|
|
103
|
-
|
|
123
|
+
d as Option
|
|
104
124
|
};
|
package/dist/Select/Select.cjs
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use strict";var ie=Object.defineProperty;var j=Object.getOwnPropertySymbols;var J=Object.prototype.hasOwnProperty,K=Object.prototype.propertyIsEnumerable;var N=(l,a,o)=>a in l?ie(l,a,{enumerable:!0,configurable:!0,writable:!0,value:o}):l[a]=o,Q=(l,a)=>{for(var o in a||(a={}))J.call(a,o)&&N(l,o,a[o]);if(j)for(var o of j(a))K.call(a,o)&&N(l,o,a[o]);return l};var U=(l,a)=>{var o={};for(var s in l)J.call(l,s)&&a.indexOf(s)<0&&(o[s]=l[s]);if(l!=null&&j)for(var s of j(l))a.indexOf(s)<0&&K.call(l,s)&&(o[s]=l[s]);return o};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const y=require("react"),ce=require("prop-types"),de=require("@strapi/icons/CarretDown"),ue=require("@strapi/icons/Cross"),fe=require("styled-components"),pe=require("../themes/sizes.cjs"),ye=require("./SelectButton.cjs"),he=require("../Field/Field.cjs"),me=require("../Field/FieldLabel.cjs");require("../Field/FieldInput.cjs");const Ee=require("../Field/FieldHint.cjs"),ge=require("../Field/FieldError.cjs");require("../Field/FieldContext.cjs");require("../Field/FieldAction.cjs");const be=require("../Popover/Popover.cjs"),qe=require("../Stack/Stack.cjs"),V=require("../Typography/Typography.cjs"),R=require("../Flex/Flex.cjs"),X=require("../Box/Box.cjs"),Fe=require("../helpers/useId.cjs"),Se=require("./SelectList.cjs"),_=require("./components.cjs"),je=require("./hooks/useButtonRef.cjs"),Y=require("../VisuallyHidden/VisuallyHidden.cjs"),Be=require("./constants.cjs"),Z=require("../helpers/escapeSelector.cjs"),Te=require("./SelectTags.cjs"),m=l=>l&&typeof l=="object"&&"default"in l?l:{default:l},r=m(y),e=m(ce),xe=m(de),ve=m(ue),Ce=m(fe),Ie=Ce.default(R.Flex)`
|
|
2
2
|
width: 100%;
|
|
3
|
-
`,
|
|
3
|
+
`,L=Oe=>{var k=Oe,{label:l,labelAction:a,id:o,children:s,customizeContent:E,placeholder:B,onChange:T,value:n,hint:x,error:g,disabled:u,clearLabel:D,onClear:$,onReachEnd:ee,multi:c,required:te,selectButtonTitle:le,size:re,startIcon:w,withTags:b}=k,ne=U(k,["label","labelAction","id","children","customizeContent","placeholder","onChange","value","hint","error","disabled","clearLabel","onClear","onReachEnd","multi","required","selectButtonTitle","size","startIcon","withTags"]);const i=Fe.useId("select",o),[q,F]=y.useState(void 0),H=je.useButtonRef(q),M=y.useRef(null),v=`${i}-label`,S=`${i}-content`,P=typeof g=="string";let C;if(P?C=`${i}-error`:x&&(C=`${i}-hint`),b&&!c)throw new Error('The "withTags" props can only be used when the "multi" prop is present');const oe=()=>{F(void 0)},ae=()=>{u||($(),H.current.focus())},A=t=>{t.preventDefault(),!u&&(t.nativeEvent.which===3||t.nativeEvent.button===2||F(Be.DownState.Mouse))},I=(t,d=!0)=>{c?T(n.includes(t)?n.filter(f=>f!==t):[...n,t]):(T(t),d&&F(void 0))},z=t=>{T(n.includes(t[0])?n.filter((d,f,h)=>h.indexOf(d)<0,t):[...n,...t])};let O,G=[];const W=(t,d)=>{const f=`${i}-option-${t.props.value}`,h=c?n.includes(t.props.value):t.props.value===n;return h&&(b?G.push({label:t.props.children,value:t.props.value}):O=t.props.children),y.cloneElement(t,{id:Z.escapeSelector(f),onClick:()=>I(t.props.value),selected:h,multi:c,isChild:d})},se=y.Children.toArray(s).map(t=>{if(t.type.displayName==="OptGroup"){const d=`${i}-option-${t.props.label}`,f=t.props.children.every(p=>n.includes(p.props.value)),h=!f&&t.props.children.some(p=>n.includes(p.props.value));return y.cloneElement(t,{id:Z.escapeSelector(d),onClick:()=>z(t.props.children.map(p=>p.props.value)),selected:f,indeterminate:h,multi:c,children:y.Children.toArray(t.props.children).map(p=>W(p,!0)),value:t.props.label})}return W(t)});return r.default.createElement(he.Field,{hint:x,error:g,id:i},r.default.createElement(qe.Stack,{spacing:l||x||P?1:0},l&&r.default.createElement(me.FieldLabel,{required:te,as:"span",id:v,action:a},l),r.default.createElement(_.SelectButtonWrapper,{size:re,hasError:Boolean(g),disabled:u,ref:M},r.default.createElement(ye.SelectButton,Q({ref:H,labelledBy:`${v} ${S}`,"aria-describedby":C,expanded:Boolean(q),onTrigger:F,id:i,hasError:Boolean(g),disabled:u,onMouseDown:A},ne)),r.default.createElement(Ie,{justifyContent:"space-between"},r.default.createElement(R.Flex,null,w&&r.default.createElement(X.Box,{paddingLeft:3,"aria-hidden":!0},w),b&&r.default.createElement(Te.SelectTags,{tags:G,onRemoveTag:I,disabled:u}),r.default.createElement(X.Box,{paddingLeft:4,paddingRight:4},b?r.default.createElement(r.default.Fragment,null,!n||n.length===0?r.default.createElement(V.Typography,{ellipsis:!0,id:S,textColor:"neutral600"},B):null,r.default.createElement(Y.VisuallyHidden,{as:"span",id:S},E?E(n):O||B,n.join(", "))):r.default.createElement(V.Typography,{ellipsis:!0,id:S,textColor:n?"neutral800":"neutral600"},E?E(n):O||B,c&&r.default.createElement(Y.VisuallyHidden,{as:"span"},n.join(", "))))),r.default.createElement(R.Flex,null,(c&&n&&n.length||!c&&n)&&$&&r.default.createElement(_.IconBox,{as:"button",type:"button",onClick:ae,"aria-label":D,"aria-disabled":u,title:D},r.default.createElement(ve.default,null)),r.default.createElement(_.CaretBox,{paddingLeft:3,"aria-hidden":!0,as:"button",type:"button",onMouseDown:A,tabIndex:-1,disabled:u,title:le},r.default.createElement(xe.default,null))))),r.default.createElement(Ee.FieldHint,null),r.default.createElement(ge.FieldError,null)),q&&r.default.createElement(be.Popover,{source:M,spacing:4,fullWidth:!0,intersectionId:`select-list-intersection-${i}`,onReachEnd:ee},r.default.createElement(Se.SelectList,{selectId:i,labelledBy:l?v:void 0,onEscape:oe,expanded:q,onSelectItem:(t,d)=>d?z(t):I(t,!1),multi:c},se)))};L.defaultProps={"aria-label":void 0,children:[],clearLabel:"Clear",customizeContent:void 0,disabled:!1,id:void 0,label:void 0,labelAction:void 0,multi:!1,onChange(){},onClear:void 0,onReachEnd:void 0,value:void 0,hint:void 0,error:void 0,placeholder:"Select...",required:!1,selectButtonTitle:"Carret Down Button",size:"M",startIcon:void 0,withTags:!1};L.propTypes={"aria-label":e.default.string,children:e.default.oneOfType([e.default.arrayOf(e.default.node),e.default.node]),clearLabel:e.default.string,customizeContent:e.default.func,disabled:e.default.bool,error:e.default.oneOfType([e.default.string,e.default.bool]),hint:e.default.oneOfType([e.default.string,e.default.node,e.default.arrayOf(e.default.node)]),id:e.default.oneOfType([e.default.string,e.default.number]),label:e.default.string,labelAction:e.default.element,multi:e.default.bool,onChange:e.default.func,onClear:e.default.func,onReachEnd:e.default.func,placeholder:e.default.string,required:e.default.bool,selectButtonTitle:e.default.string,size:e.default.oneOf(Object.keys(pe.sizes.input)),startIcon:e.default.element,value:e.default.oneOfType([e.default.arrayOf(e.default.oneOfType([e.default.string,e.default.number])),e.default.string,e.default.number]),withTags:e.default.bool};exports.Select=L;
|