@shoplflow/base 0.20.0 → 0.21.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +67 -14
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +12 -5
- package/dist/index.d.ts +12 -5
- package/dist/index.js +68 -15
- package/dist/index.js.map +1 -1
- package/package.json +3 -3
package/dist/index.d.cts
CHANGED
|
@@ -1030,13 +1030,20 @@ declare const DropdownButtonIcon: _emotion_styled.StyledComponent<{
|
|
|
1030
1030
|
theme?: _emotion_react.Theme | undefined;
|
|
1031
1031
|
} & DropdownButtonProps, {}, {}>;
|
|
1032
1032
|
|
|
1033
|
+
declare const MenuSizeVariants: {
|
|
1034
|
+
readonly XS: "XS";
|
|
1035
|
+
readonly S: "S";
|
|
1036
|
+
readonly M: "M";
|
|
1037
|
+
};
|
|
1038
|
+
declare type MenuSizeVariantKey = $Values<typeof MenuSizeVariants>;
|
|
1033
1039
|
interface MenuProps extends MenuOptionProps, HTMLAttributes<HTMLLIElement> {
|
|
1034
1040
|
}
|
|
1035
|
-
interface MenuOptionProps extends ChildrenProps, DisableProps, RightElementProps, LeftElementProps, SelectedProps, DefaultSelectedProps {
|
|
1041
|
+
interface MenuOptionProps extends ChildrenProps, DisableProps, RightElementProps, LeftElementProps, SelectedProps, DefaultSelectedProps, SizeVariantProps<MenuSizeVariantKey> {
|
|
1036
1042
|
}
|
|
1037
1043
|
|
|
1038
|
-
declare const Menu: ({ leftSource, rightSource, children, isSelected, defaultSelected, onClick, disabled, ...rest }: MenuProps) => react_jsx_runtime.JSX.Element;
|
|
1044
|
+
declare const Menu: ({ leftSource, rightSource, children, isSelected, defaultSelected, onClick, sizeVar, disabled, ...rest }: MenuProps) => react_jsx_runtime.JSX.Element;
|
|
1039
1045
|
|
|
1046
|
+
declare const getFontStylesBySizeVar: (sizeVar: MenuOptionProps['sizeVar']) => "body1_400" | "body2_400";
|
|
1040
1047
|
declare const StyledMenu: _emotion_styled.StyledComponent<{
|
|
1041
1048
|
theme?: _emotion_react.Theme | undefined;
|
|
1042
1049
|
as?: React$1.ElementType<any> | undefined;
|
|
@@ -1044,7 +1051,7 @@ declare const StyledMenu: _emotion_styled.StyledComponent<{
|
|
|
1044
1051
|
|
|
1045
1052
|
interface ListProps extends ListOptionProps {
|
|
1046
1053
|
}
|
|
1047
|
-
interface ListOptionProps extends ChildrenProps, DisableProps, SelectedProps, LeftNodeProps, RightNodeProps {
|
|
1054
|
+
interface ListOptionProps extends ChildrenProps, DisableProps, SelectedProps, LeftNodeProps, RightNodeProps, HTMLAttributes<HTMLLIElement> {
|
|
1048
1055
|
}
|
|
1049
1056
|
interface ListContent2ColumnsProps extends ChildrenProps {
|
|
1050
1057
|
}
|
|
@@ -1062,7 +1069,7 @@ declare const Text2Rows: ({ title, subTitle }: ListText2RowsProps) => react_jsx_
|
|
|
1062
1069
|
declare const StyledList: _emotion_styled.StyledComponent<{
|
|
1063
1070
|
theme?: _emotion_react.Theme | undefined;
|
|
1064
1071
|
as?: React$1.ElementType<any> | undefined;
|
|
1065
|
-
} & ListOptionProps, React$1.DetailedHTMLProps<React$1.
|
|
1072
|
+
} & ListOptionProps, React$1.DetailedHTMLProps<React$1.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, {}>;
|
|
1066
1073
|
declare const StyledText2Rows: _emotion_styled.StyledComponent<{
|
|
1067
1074
|
theme?: _emotion_react.Theme | undefined;
|
|
1068
1075
|
as?: React$1.ElementType<any> | undefined;
|
|
@@ -1209,4 +1216,4 @@ interface RadioOptionProps extends SelectedProps, DefaultSelectedProps, DisableP
|
|
|
1209
1216
|
|
|
1210
1217
|
declare const Radio: ({ isSelected, defaultSelected, disabled, onClick, onMouseEnter, onMouseLeave, ...rest }: RadioProps) => react_jsx_runtime.JSX.Element;
|
|
1211
1218
|
|
|
1212
|
-
export { BackDropOptionProps, BackDropProps, BorderRadiusTokens, BoxShadowTokens, Button, ButtonComponent, ButtonOptionProps, ButtonProps, ButtonSizeVar, ButtonStyleVar, Callout, CalloutOptionProps, CalloutProps, CalloutType, CalloutTypes, Checkbox, CheckboxOptionProps, CheckboxProps, CheckboxStyleVariantType, CheckboxStyleVariants, ChipButton, ChipButtonOptionProps, ChipButtonProps, ChipButtonSizeVariantType, ChipButtonSizeVariants, ChipButtonStyleVariantType, ChipButtonStyleVariants, ChipToggle, ChipToggleOptionProps, ChipToggleProps, ChipToggleSizeVariantType, ChipToggleSizeVariants, ChipToggleStyleVariantType, ChipToggleStyleVariants, ColorTokens, Dropdown, DropdownButtonIcon, DropdownButtonProps, DropdownContentProps, DropdownOptionProps, DropdownOptionVar, DropdownProps, DropdownSizeVariantType, FontWeightTokens, Icon, IconButton, IconButtonComponent, IconButtonOptionProps, IconButtonProps, IconButtonSizeVar, IconButtonStyleVar, IconOptionProps, IconProps, IconSizeVariants, IconSizeVariantsType, Input, InputButton, InputButtonOptionProps, InputButtonProps, InputOptionProps, InputProps, List, ListContent2ColumnsProps, ListOptionProps, ListProps, ListText2RowsProps, MODAL_FOOTER_KEY, MODAL_HEADER_KEY, Menu, MenuOptionProps, MenuProps, MinusBoxOptionProps, MinusBoxProps, MinusButton, Modal, ModalBodyOptionProps, ModalBodyProps, ModalContainerOptionProps, ModalContainerProps, ModalFooterOptionProps, ModalFooterProps, ModalFooterType, ModalHeaderOptionProps, ModalHeaderProps, ModalHeaderType, ModalPortal as ModalProvider, ModalSize, ModalSizeType, MotionStack, MotionStackComponentType, Popper, PopperOptionProps, PopperPortal, PopperPortalProps, PopperProps, PopperTrigger, PopperTriggerProps, Radio, RadioOptionProps, RadioProps, ScrollArea, ScrollAreaOptionProps, ScrollAreaProps, ShoplflowProvider, ShoplflowProviderProps, SpacingTokens, Stack, StackComponentType, StackGenericProps, StackOptionProps, StackProps, StyledDropdown, StyledDropdownButton, StyledDropdownContent, StyledIcon, StyledInputButton, StyledInputButtonContent, StyledList, StyledMenu, StyledPopper, StyledStack, StyledText2Rows, Switch, SwitchOptionProps, SwitchProps, Tag, TagOptionProps, TagProps, TagSizeVariantType, TagSizeVariants, TagStyleVariantType, TagStyleVariants, Text, Text2Rows, TextArea, TextAreaOptionProps, TextAreaProps, TextOptionProps, TextProps, TypographyTokens, borderRadiusTokens, boxShadowTokens, buttonSizeVar, buttonStyleVar, colorTokens, fontWeightTokens, getDomain, getDropdownFontSizeBySizeVar, getDropdownHeightBySizeVar, getDropdownIconSizeBySizeVar, getDropdownStyleBySizeVar, iconButtonSizeVar, iconButtonStyleVar, spacingTokens, typographyTokens, useDomain, useHandleModal, useModalValue };
|
|
1219
|
+
export { BackDropOptionProps, BackDropProps, BorderRadiusTokens, BoxShadowTokens, Button, ButtonComponent, ButtonOptionProps, ButtonProps, ButtonSizeVar, ButtonStyleVar, Callout, CalloutOptionProps, CalloutProps, CalloutType, CalloutTypes, Checkbox, CheckboxOptionProps, CheckboxProps, CheckboxStyleVariantType, CheckboxStyleVariants, ChipButton, ChipButtonOptionProps, ChipButtonProps, ChipButtonSizeVariantType, ChipButtonSizeVariants, ChipButtonStyleVariantType, ChipButtonStyleVariants, ChipToggle, ChipToggleOptionProps, ChipToggleProps, ChipToggleSizeVariantType, ChipToggleSizeVariants, ChipToggleStyleVariantType, ChipToggleStyleVariants, ColorTokens, Dropdown, DropdownButtonIcon, DropdownButtonProps, DropdownContentProps, DropdownOptionProps, DropdownOptionVar, DropdownProps, DropdownSizeVariantType, FontWeightTokens, Icon, IconButton, IconButtonComponent, IconButtonOptionProps, IconButtonProps, IconButtonSizeVar, IconButtonStyleVar, IconOptionProps, IconProps, IconSizeVariants, IconSizeVariantsType, Input, InputButton, InputButtonOptionProps, InputButtonProps, InputOptionProps, InputProps, List, ListContent2ColumnsProps, ListOptionProps, ListProps, ListText2RowsProps, MODAL_FOOTER_KEY, MODAL_HEADER_KEY, Menu, MenuOptionProps, MenuProps, MenuSizeVariantKey, MenuSizeVariants, MinusBoxOptionProps, MinusBoxProps, MinusButton, Modal, ModalBodyOptionProps, ModalBodyProps, ModalContainerOptionProps, ModalContainerProps, ModalFooterOptionProps, ModalFooterProps, ModalFooterType, ModalHeaderOptionProps, ModalHeaderProps, ModalHeaderType, ModalPortal as ModalProvider, ModalSize, ModalSizeType, MotionStack, MotionStackComponentType, Popper, PopperOptionProps, PopperPortal, PopperPortalProps, PopperProps, PopperTrigger, PopperTriggerProps, Radio, RadioOptionProps, RadioProps, ScrollArea, ScrollAreaOptionProps, ScrollAreaProps, ShoplflowProvider, ShoplflowProviderProps, SpacingTokens, Stack, StackComponentType, StackGenericProps, StackOptionProps, StackProps, StyledDropdown, StyledDropdownButton, StyledDropdownContent, StyledIcon, StyledInputButton, StyledInputButtonContent, StyledList, StyledMenu, StyledPopper, StyledStack, StyledText2Rows, Switch, SwitchOptionProps, SwitchProps, Tag, TagOptionProps, TagProps, TagSizeVariantType, TagSizeVariants, TagStyleVariantType, TagStyleVariants, Text, Text2Rows, TextArea, TextAreaOptionProps, TextAreaProps, TextOptionProps, TextProps, TypographyTokens, borderRadiusTokens, boxShadowTokens, buttonSizeVar, buttonStyleVar, colorTokens, fontWeightTokens, getDomain, getDropdownFontSizeBySizeVar, getDropdownHeightBySizeVar, getDropdownIconSizeBySizeVar, getDropdownStyleBySizeVar, getFontStylesBySizeVar, iconButtonSizeVar, iconButtonStyleVar, spacingTokens, typographyTokens, useDomain, useHandleModal, useModalValue };
|
package/dist/index.d.ts
CHANGED
|
@@ -1030,13 +1030,20 @@ declare const DropdownButtonIcon: _emotion_styled.StyledComponent<{
|
|
|
1030
1030
|
theme?: _emotion_react.Theme | undefined;
|
|
1031
1031
|
} & DropdownButtonProps, {}, {}>;
|
|
1032
1032
|
|
|
1033
|
+
declare const MenuSizeVariants: {
|
|
1034
|
+
readonly XS: "XS";
|
|
1035
|
+
readonly S: "S";
|
|
1036
|
+
readonly M: "M";
|
|
1037
|
+
};
|
|
1038
|
+
declare type MenuSizeVariantKey = $Values<typeof MenuSizeVariants>;
|
|
1033
1039
|
interface MenuProps extends MenuOptionProps, HTMLAttributes<HTMLLIElement> {
|
|
1034
1040
|
}
|
|
1035
|
-
interface MenuOptionProps extends ChildrenProps, DisableProps, RightElementProps, LeftElementProps, SelectedProps, DefaultSelectedProps {
|
|
1041
|
+
interface MenuOptionProps extends ChildrenProps, DisableProps, RightElementProps, LeftElementProps, SelectedProps, DefaultSelectedProps, SizeVariantProps<MenuSizeVariantKey> {
|
|
1036
1042
|
}
|
|
1037
1043
|
|
|
1038
|
-
declare const Menu: ({ leftSource, rightSource, children, isSelected, defaultSelected, onClick, disabled, ...rest }: MenuProps) => react_jsx_runtime.JSX.Element;
|
|
1044
|
+
declare const Menu: ({ leftSource, rightSource, children, isSelected, defaultSelected, onClick, sizeVar, disabled, ...rest }: MenuProps) => react_jsx_runtime.JSX.Element;
|
|
1039
1045
|
|
|
1046
|
+
declare const getFontStylesBySizeVar: (sizeVar: MenuOptionProps['sizeVar']) => "body1_400" | "body2_400";
|
|
1040
1047
|
declare const StyledMenu: _emotion_styled.StyledComponent<{
|
|
1041
1048
|
theme?: _emotion_react.Theme | undefined;
|
|
1042
1049
|
as?: React$1.ElementType<any> | undefined;
|
|
@@ -1044,7 +1051,7 @@ declare const StyledMenu: _emotion_styled.StyledComponent<{
|
|
|
1044
1051
|
|
|
1045
1052
|
interface ListProps extends ListOptionProps {
|
|
1046
1053
|
}
|
|
1047
|
-
interface ListOptionProps extends ChildrenProps, DisableProps, SelectedProps, LeftNodeProps, RightNodeProps {
|
|
1054
|
+
interface ListOptionProps extends ChildrenProps, DisableProps, SelectedProps, LeftNodeProps, RightNodeProps, HTMLAttributes<HTMLLIElement> {
|
|
1048
1055
|
}
|
|
1049
1056
|
interface ListContent2ColumnsProps extends ChildrenProps {
|
|
1050
1057
|
}
|
|
@@ -1062,7 +1069,7 @@ declare const Text2Rows: ({ title, subTitle }: ListText2RowsProps) => react_jsx_
|
|
|
1062
1069
|
declare const StyledList: _emotion_styled.StyledComponent<{
|
|
1063
1070
|
theme?: _emotion_react.Theme | undefined;
|
|
1064
1071
|
as?: React$1.ElementType<any> | undefined;
|
|
1065
|
-
} & ListOptionProps, React$1.DetailedHTMLProps<React$1.
|
|
1072
|
+
} & ListOptionProps, React$1.DetailedHTMLProps<React$1.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, {}>;
|
|
1066
1073
|
declare const StyledText2Rows: _emotion_styled.StyledComponent<{
|
|
1067
1074
|
theme?: _emotion_react.Theme | undefined;
|
|
1068
1075
|
as?: React$1.ElementType<any> | undefined;
|
|
@@ -1209,4 +1216,4 @@ interface RadioOptionProps extends SelectedProps, DefaultSelectedProps, DisableP
|
|
|
1209
1216
|
|
|
1210
1217
|
declare const Radio: ({ isSelected, defaultSelected, disabled, onClick, onMouseEnter, onMouseLeave, ...rest }: RadioProps) => react_jsx_runtime.JSX.Element;
|
|
1211
1218
|
|
|
1212
|
-
export { BackDropOptionProps, BackDropProps, BorderRadiusTokens, BoxShadowTokens, Button, ButtonComponent, ButtonOptionProps, ButtonProps, ButtonSizeVar, ButtonStyleVar, Callout, CalloutOptionProps, CalloutProps, CalloutType, CalloutTypes, Checkbox, CheckboxOptionProps, CheckboxProps, CheckboxStyleVariantType, CheckboxStyleVariants, ChipButton, ChipButtonOptionProps, ChipButtonProps, ChipButtonSizeVariantType, ChipButtonSizeVariants, ChipButtonStyleVariantType, ChipButtonStyleVariants, ChipToggle, ChipToggleOptionProps, ChipToggleProps, ChipToggleSizeVariantType, ChipToggleSizeVariants, ChipToggleStyleVariantType, ChipToggleStyleVariants, ColorTokens, Dropdown, DropdownButtonIcon, DropdownButtonProps, DropdownContentProps, DropdownOptionProps, DropdownOptionVar, DropdownProps, DropdownSizeVariantType, FontWeightTokens, Icon, IconButton, IconButtonComponent, IconButtonOptionProps, IconButtonProps, IconButtonSizeVar, IconButtonStyleVar, IconOptionProps, IconProps, IconSizeVariants, IconSizeVariantsType, Input, InputButton, InputButtonOptionProps, InputButtonProps, InputOptionProps, InputProps, List, ListContent2ColumnsProps, ListOptionProps, ListProps, ListText2RowsProps, MODAL_FOOTER_KEY, MODAL_HEADER_KEY, Menu, MenuOptionProps, MenuProps, MinusBoxOptionProps, MinusBoxProps, MinusButton, Modal, ModalBodyOptionProps, ModalBodyProps, ModalContainerOptionProps, ModalContainerProps, ModalFooterOptionProps, ModalFooterProps, ModalFooterType, ModalHeaderOptionProps, ModalHeaderProps, ModalHeaderType, ModalPortal as ModalProvider, ModalSize, ModalSizeType, MotionStack, MotionStackComponentType, Popper, PopperOptionProps, PopperPortal, PopperPortalProps, PopperProps, PopperTrigger, PopperTriggerProps, Radio, RadioOptionProps, RadioProps, ScrollArea, ScrollAreaOptionProps, ScrollAreaProps, ShoplflowProvider, ShoplflowProviderProps, SpacingTokens, Stack, StackComponentType, StackGenericProps, StackOptionProps, StackProps, StyledDropdown, StyledDropdownButton, StyledDropdownContent, StyledIcon, StyledInputButton, StyledInputButtonContent, StyledList, StyledMenu, StyledPopper, StyledStack, StyledText2Rows, Switch, SwitchOptionProps, SwitchProps, Tag, TagOptionProps, TagProps, TagSizeVariantType, TagSizeVariants, TagStyleVariantType, TagStyleVariants, Text, Text2Rows, TextArea, TextAreaOptionProps, TextAreaProps, TextOptionProps, TextProps, TypographyTokens, borderRadiusTokens, boxShadowTokens, buttonSizeVar, buttonStyleVar, colorTokens, fontWeightTokens, getDomain, getDropdownFontSizeBySizeVar, getDropdownHeightBySizeVar, getDropdownIconSizeBySizeVar, getDropdownStyleBySizeVar, iconButtonSizeVar, iconButtonStyleVar, spacingTokens, typographyTokens, useDomain, useHandleModal, useModalValue };
|
|
1219
|
+
export { BackDropOptionProps, BackDropProps, BorderRadiusTokens, BoxShadowTokens, Button, ButtonComponent, ButtonOptionProps, ButtonProps, ButtonSizeVar, ButtonStyleVar, Callout, CalloutOptionProps, CalloutProps, CalloutType, CalloutTypes, Checkbox, CheckboxOptionProps, CheckboxProps, CheckboxStyleVariantType, CheckboxStyleVariants, ChipButton, ChipButtonOptionProps, ChipButtonProps, ChipButtonSizeVariantType, ChipButtonSizeVariants, ChipButtonStyleVariantType, ChipButtonStyleVariants, ChipToggle, ChipToggleOptionProps, ChipToggleProps, ChipToggleSizeVariantType, ChipToggleSizeVariants, ChipToggleStyleVariantType, ChipToggleStyleVariants, ColorTokens, Dropdown, DropdownButtonIcon, DropdownButtonProps, DropdownContentProps, DropdownOptionProps, DropdownOptionVar, DropdownProps, DropdownSizeVariantType, FontWeightTokens, Icon, IconButton, IconButtonComponent, IconButtonOptionProps, IconButtonProps, IconButtonSizeVar, IconButtonStyleVar, IconOptionProps, IconProps, IconSizeVariants, IconSizeVariantsType, Input, InputButton, InputButtonOptionProps, InputButtonProps, InputOptionProps, InputProps, List, ListContent2ColumnsProps, ListOptionProps, ListProps, ListText2RowsProps, MODAL_FOOTER_KEY, MODAL_HEADER_KEY, Menu, MenuOptionProps, MenuProps, MenuSizeVariantKey, MenuSizeVariants, MinusBoxOptionProps, MinusBoxProps, MinusButton, Modal, ModalBodyOptionProps, ModalBodyProps, ModalContainerOptionProps, ModalContainerProps, ModalFooterOptionProps, ModalFooterProps, ModalFooterType, ModalHeaderOptionProps, ModalHeaderProps, ModalHeaderType, ModalPortal as ModalProvider, ModalSize, ModalSizeType, MotionStack, MotionStackComponentType, Popper, PopperOptionProps, PopperPortal, PopperPortalProps, PopperProps, PopperTrigger, PopperTriggerProps, Radio, RadioOptionProps, RadioProps, ScrollArea, ScrollAreaOptionProps, ScrollAreaProps, ShoplflowProvider, ShoplflowProviderProps, SpacingTokens, Stack, StackComponentType, StackGenericProps, StackOptionProps, StackProps, StyledDropdown, StyledDropdownButton, StyledDropdownContent, StyledIcon, StyledInputButton, StyledInputButtonContent, StyledList, StyledMenu, StyledPopper, StyledStack, StyledText2Rows, Switch, SwitchOptionProps, SwitchProps, Tag, TagOptionProps, TagProps, TagSizeVariantType, TagSizeVariants, TagStyleVariantType, TagStyleVariants, Text, Text2Rows, TextArea, TextAreaOptionProps, TextAreaProps, TextOptionProps, TextProps, TypographyTokens, borderRadiusTokens, boxShadowTokens, buttonSizeVar, buttonStyleVar, colorTokens, fontWeightTokens, getDomain, getDropdownFontSizeBySizeVar, getDropdownHeightBySizeVar, getDropdownIconSizeBySizeVar, getDropdownStyleBySizeVar, getFontStylesBySizeVar, iconButtonSizeVar, iconButtonStyleVar, spacingTokens, typographyTokens, useDomain, useHandleModal, useModalValue };
|
package/dist/index.js
CHANGED
|
@@ -905,10 +905,10 @@ var useOnToggle = (selected, defaultSelected) => {
|
|
|
905
905
|
}
|
|
906
906
|
}, [isControlled, selected]);
|
|
907
907
|
useEffect(() => {
|
|
908
|
-
if (defaultSelected !== void 0) {
|
|
908
|
+
if (!isControlled && defaultSelected !== void 0) {
|
|
909
909
|
setIsToggle(defaultSelected);
|
|
910
910
|
}
|
|
911
|
-
}, [defaultSelected]);
|
|
911
|
+
}, [defaultSelected, isControlled]);
|
|
912
912
|
return [isToggle, handleToggle];
|
|
913
913
|
};
|
|
914
914
|
var Switch = (_a) => {
|
|
@@ -1895,21 +1895,54 @@ var Dropdown = ({
|
|
|
1895
1895
|
Dropdown.Button = DropdownButton;
|
|
1896
1896
|
Dropdown.Content = DropdownContent;
|
|
1897
1897
|
var Dropdown_default = Dropdown;
|
|
1898
|
+
var getStylesBySizeVar = (sizeVar) => {
|
|
1899
|
+
switch (sizeVar) {
|
|
1900
|
+
case "XS":
|
|
1901
|
+
return css`
|
|
1902
|
+
min-height: 28px;
|
|
1903
|
+
`;
|
|
1904
|
+
case "S":
|
|
1905
|
+
return css`
|
|
1906
|
+
min-height: 36px;
|
|
1907
|
+
`;
|
|
1908
|
+
case "M":
|
|
1909
|
+
return css`
|
|
1910
|
+
height: 48px;
|
|
1911
|
+
`;
|
|
1912
|
+
default:
|
|
1913
|
+
return css`
|
|
1914
|
+
height: 48px;
|
|
1915
|
+
`;
|
|
1916
|
+
}
|
|
1917
|
+
};
|
|
1918
|
+
var getFontStylesBySizeVar = (sizeVar) => {
|
|
1919
|
+
switch (sizeVar) {
|
|
1920
|
+
case "XS":
|
|
1921
|
+
return "body2_400";
|
|
1922
|
+
case "S":
|
|
1923
|
+
return "body1_400";
|
|
1924
|
+
case "M":
|
|
1925
|
+
return "body1_400";
|
|
1926
|
+
default:
|
|
1927
|
+
return "body1_400";
|
|
1928
|
+
}
|
|
1929
|
+
};
|
|
1898
1930
|
var StyledMenu = styled5.li`
|
|
1899
1931
|
display: flex;
|
|
1900
|
-
flex-direction: row;
|
|
1901
|
-
padding: 6px;
|
|
1902
1932
|
width: 100%;
|
|
1933
|
+
flex-direction: row;
|
|
1903
1934
|
align-items: center;
|
|
1935
|
+
padding: 6px;
|
|
1904
1936
|
gap: 4px;
|
|
1905
|
-
cursor: pointer;
|
|
1906
1937
|
border-radius: 4px;
|
|
1907
|
-
|
|
1938
|
+
cursor: pointer;
|
|
1939
|
+
background: transparent;
|
|
1940
|
+
${({ sizeVar }) => getStylesBySizeVar(sizeVar)};
|
|
1908
1941
|
&:hover {
|
|
1909
|
-
background: ${colorTokens.
|
|
1942
|
+
background: ${colorTokens.neutral400_5};
|
|
1910
1943
|
}
|
|
1911
1944
|
${({ disabled }) => disabled && getDisabledStyle(disabled)}
|
|
1912
|
-
${({ isSelected, leftSource }) => isSelected && !leftSource && css`
|
|
1945
|
+
${({ isSelected, leftSource }) => isSelected === true && !leftSource && css`
|
|
1913
1946
|
background: ${colorTokens.neutral200};
|
|
1914
1947
|
&:hover {
|
|
1915
1948
|
background: ${colorTokens.neutral200};
|
|
@@ -1924,6 +1957,7 @@ var Menu = (_a) => {
|
|
|
1924
1957
|
isSelected,
|
|
1925
1958
|
defaultSelected = false,
|
|
1926
1959
|
onClick,
|
|
1960
|
+
sizeVar = "XS",
|
|
1927
1961
|
disabled = false
|
|
1928
1962
|
} = _b, rest = __objRest(_b, [
|
|
1929
1963
|
"leftSource",
|
|
@@ -1932,6 +1966,7 @@ var Menu = (_a) => {
|
|
|
1932
1966
|
"isSelected",
|
|
1933
1967
|
"defaultSelected",
|
|
1934
1968
|
"onClick",
|
|
1969
|
+
"sizeVar",
|
|
1935
1970
|
"disabled"
|
|
1936
1971
|
]);
|
|
1937
1972
|
const [selected, handleToggle] = useOnToggle(isSelected, defaultSelected);
|
|
@@ -1942,14 +1977,32 @@ var Menu = (_a) => {
|
|
|
1942
1977
|
!disabled && handleToggle();
|
|
1943
1978
|
!disabled && onClick && onClick(e);
|
|
1944
1979
|
};
|
|
1945
|
-
return /* @__PURE__ */ jsxs(
|
|
1946
|
-
|
|
1947
|
-
|
|
1948
|
-
|
|
1949
|
-
|
|
1980
|
+
return /* @__PURE__ */ jsxs(
|
|
1981
|
+
StyledMenu,
|
|
1982
|
+
__spreadProps(__spreadValues({
|
|
1983
|
+
sizeVar,
|
|
1984
|
+
isSelected: selected,
|
|
1985
|
+
leftSource,
|
|
1986
|
+
onClick: handleOnClick
|
|
1987
|
+
}, rest), {
|
|
1988
|
+
"data-shoplflow": "Menu",
|
|
1989
|
+
children: [
|
|
1990
|
+
leftSource && LeftSourceClone,
|
|
1991
|
+
/* @__PURE__ */ jsx(Stack_default.Horizontal, { width: "100%", height: "100%", align: "center", className: getFontStylesBySizeVar(sizeVar), children }),
|
|
1992
|
+
rightSource && rightSource
|
|
1993
|
+
]
|
|
1994
|
+
})
|
|
1995
|
+
);
|
|
1950
1996
|
};
|
|
1951
1997
|
var Menu_default = Menu;
|
|
1952
|
-
|
|
1998
|
+
|
|
1999
|
+
// src/components/Menu/Menu.types.ts
|
|
2000
|
+
var MenuSizeVariants = {
|
|
2001
|
+
XS: "XS",
|
|
2002
|
+
S: "S",
|
|
2003
|
+
M: "M"
|
|
2004
|
+
};
|
|
2005
|
+
var StyledList = styled5.li`
|
|
1953
2006
|
display: flex;
|
|
1954
2007
|
flex-direction: row;
|
|
1955
2008
|
width: 100%;
|
|
@@ -2856,6 +2909,6 @@ classnames/index.js:
|
|
|
2856
2909
|
*)
|
|
2857
2910
|
*/
|
|
2858
2911
|
|
|
2859
|
-
export { Button_default as Button, Callout_default as Callout, CalloutTypes, Checkbox_default as Checkbox, CheckboxStyleVariants, ChipButton_default as ChipButton, ChipButtonSizeVariants, ChipButtonStyleVariants, ChipToggle_default as ChipToggle, ChipToggleSizeVariants, ChipToggleStyleVariants, Dropdown_default as Dropdown, DropdownButtonIcon, Icon_default as Icon, IconButton_default as IconButton, IconSizeVariants, Input_default as Input, InputButton_default as InputButton, List_default as List, MODAL_FOOTER_KEY, MODAL_HEADER_KEY, Menu_default as Menu, MinusButton_default as MinusButton, Modal, ModalPortal_default as ModalProvider, ModalSize, MotionStack, Popper_default as Popper, PopperPortal2 as PopperPortal, PopperTrigger, Radio_default as Radio, ScrollArea_default as ScrollArea, ShoplflowProvider_default as ShoplflowProvider, Stack_default as Stack, StyledDropdown, StyledDropdownButton, StyledDropdownContent, StyledIcon, StyledInputButton, StyledInputButtonContent, StyledList, StyledMenu, StyledPopper, StyledStack, StyledText2Rows, Switch_default as Switch, Tag_default as Tag, TagSizeVariants, TagStyleVariants, Text_default as Text, Text2Rows, TextArea_default as TextArea, borderRadiusTokens, boxShadowTokens, buttonSizeVar, buttonStyleVar, colorTokens, fontWeightTokens, getDomain, getDropdownFontSizeBySizeVar, getDropdownHeightBySizeVar, getDropdownIconSizeBySizeVar, getDropdownStyleBySizeVar, iconButtonSizeVar, iconButtonStyleVar, spacingTokens, typographyTokens, useDomain, useHandleModal, useModalValue };
|
|
2912
|
+
export { Button_default as Button, Callout_default as Callout, CalloutTypes, Checkbox_default as Checkbox, CheckboxStyleVariants, ChipButton_default as ChipButton, ChipButtonSizeVariants, ChipButtonStyleVariants, ChipToggle_default as ChipToggle, ChipToggleSizeVariants, ChipToggleStyleVariants, Dropdown_default as Dropdown, DropdownButtonIcon, Icon_default as Icon, IconButton_default as IconButton, IconSizeVariants, Input_default as Input, InputButton_default as InputButton, List_default as List, MODAL_FOOTER_KEY, MODAL_HEADER_KEY, Menu_default as Menu, MenuSizeVariants, MinusButton_default as MinusButton, Modal, ModalPortal_default as ModalProvider, ModalSize, MotionStack, Popper_default as Popper, PopperPortal2 as PopperPortal, PopperTrigger, Radio_default as Radio, ScrollArea_default as ScrollArea, ShoplflowProvider_default as ShoplflowProvider, Stack_default as Stack, StyledDropdown, StyledDropdownButton, StyledDropdownContent, StyledIcon, StyledInputButton, StyledInputButtonContent, StyledList, StyledMenu, StyledPopper, StyledStack, StyledText2Rows, Switch_default as Switch, Tag_default as Tag, TagSizeVariants, TagStyleVariants, Text_default as Text, Text2Rows, TextArea_default as TextArea, borderRadiusTokens, boxShadowTokens, buttonSizeVar, buttonStyleVar, colorTokens, fontWeightTokens, getDomain, getDropdownFontSizeBySizeVar, getDropdownHeightBySizeVar, getDropdownIconSizeBySizeVar, getDropdownStyleBySizeVar, getFontStylesBySizeVar, iconButtonSizeVar, iconButtonStyleVar, spacingTokens, typographyTokens, useDomain, useHandleModal, useModalValue };
|
|
2860
2913
|
//# sourceMappingURL=out.js.map
|
|
2861
2914
|
//# sourceMappingURL=index.js.map
|