@shoplflow/base 0.33.1 → 0.33.3

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 CHANGED
@@ -1985,7 +1985,7 @@ exports.PopperTrigger = React3.forwardRef(
1985
1985
  exports.PopperPortal = React3.forwardRef(
1986
1986
  ({ children, animation: initialAnimation, zIndex }, ref) => {
1987
1987
  const { floatingStyles, setFloating, isOpen } = usePopper();
1988
- const animation = initialAnimation != null ? initialAnimation : fadeInOut;
1988
+ const animation2 = initialAnimation != null ? initialAnimation : fadeInOut;
1989
1989
  const refs = useMergeRefs2(ref, setFloating);
1990
1990
  let _floatingStyles = __spreadValues({}, floatingStyles);
1991
1991
  if (zIndex) {
@@ -1997,9 +1997,9 @@ exports.PopperPortal = React3.forwardRef(
1997
1997
  return /* @__PURE__ */ jsxRuntime.jsx(react.FloatingPortal, { children: /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: /* @__PURE__ */ jsxRuntime.jsx(
1998
1998
  framerMotion.motion.div,
1999
1999
  {
2000
- initial: animation.initial,
2001
- animate: animation.animate,
2002
- exit: animation.exit,
2000
+ initial: animation2.initial,
2001
+ animate: animation2.animate,
2002
+ exit: animation2.exit,
2003
2003
  ref: refs,
2004
2004
  style: _floatingStyles,
2005
2005
  children
@@ -4058,6 +4058,7 @@ var TextArea = React3.forwardRef(
4058
4058
  height,
4059
4059
  minHeight,
4060
4060
  width,
4061
+ gap: "0",
4061
4062
  "data-shoplflow": "text-area",
4062
4063
  children: [
4063
4064
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -6528,6 +6529,54 @@ exports.NumberComboboxSizeVariants = {
6528
6529
  S: "S",
6529
6530
  M: "M"
6530
6531
  };
6532
+ var animation = react$1.keyframes`
6533
+ 0% {
6534
+ transform: translateX(-100%);
6535
+ }
6536
+
6537
+ 100% {
6538
+ transform: translateX(200%);
6539
+ }
6540
+ `;
6541
+ var getSkeletonStyles = (width, height, styleVar) => {
6542
+ switch (styleVar) {
6543
+ case "circle":
6544
+ return react$1.css`
6545
+ width: ${width};
6546
+ height: ${width};
6547
+ border-radius: 50%;
6548
+ `;
6549
+ case "rectangle":
6550
+ return react$1.css`
6551
+ width: ${width};
6552
+ height: ${height};
6553
+ `;
6554
+ }
6555
+ };
6556
+ var Container6 = styled6__default.default.div`
6557
+ position: relative;
6558
+ border-radius: 8px;
6559
+ background-color: ${exports.colorTokens.neutral200};
6560
+ overflow: hidden;
6561
+
6562
+ ${({ styleVar, width, height }) => getSkeletonStyles(width, height, styleVar)};
6563
+
6564
+ &::after {
6565
+ content: '';
6566
+ position: absolute;
6567
+ top: 0;
6568
+ left: 0;
6569
+ width: 100%;
6570
+ height: 100%;
6571
+ background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0));
6572
+ transform: translateX(-100%);
6573
+ animation: ${animation} 2s infinite;
6574
+ }
6575
+ `;
6576
+ var Skeleton = ({ styleVar = "rectangle", width = "50px", height = "20px" }) => {
6577
+ return /* @__PURE__ */ jsxRuntime.jsx(Container6, { styleVar, width, height, "data-shoplflow": "Skeleton" });
6578
+ };
6579
+ exports.Skeleton = Skeleton;
6531
6580
  var SpaceMarginWrapper = styled6__default.default(framerMotion.motion.div)`
6532
6581
  position: relative;
6533
6582
  display: flex;
package/dist/index.d.cts CHANGED
@@ -1532,4 +1532,12 @@ declare type NumberComboboxProps = NumberComboboxOptionProps & Omit<InputHTMLAtt
1532
1532
 
1533
1533
  declare const NumberCombobox: ({ disabled, onSelect, onChange, value, width, onBlur, items, isError, sizeVar, placeholder, maxLength, className, floatingZIndex, ...rest }: NumberComboboxProps) => react_jsx_runtime.JSX.Element;
1534
1534
 
1535
- export { AnnualDatepicker, AnnualDatepickerProps, AsProp, Avatar, AvatarOptionProps, AvatarProps, AvatarSizeVariantType, AvatarSizeVariants, BackDropOptionProps, BackDropProps, BorderRadiusTokens, BoxShadowTokens, Button, ButtonComponent, ButtonOptionProps, ButtonProps, ButtonSizeVariantType, ButtonSizeVariants, ButtonStyleVariantType, ButtonStyleVariants, CHECKBOX_SYMBOL_KEY, 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, DangerouslySetInnerHTML, DayCalendarType, DayDatepicker, DayDatepickerHeaderCustomProps, DayDatepickerOptionProps, DayDatepickerProps, DayDatepickerSizeVariantType, DayDatepickerSizeVariants, DomainType, Dropdown, DropdownButton, DropdownButtonContext, DropdownButtonContextType, DropdownButtonOptionProps, DropdownButtonProps, DropdownButtonSizeVariantType, DropdownButtonSizeVariants, DropdownButtonStyleVariantType, DropdownButtonStyleVariants, DropdownContentProps, DropdownOptionProps, DropdownOptionVariantType, DropdownOptionVariants, DropdownProps, DropdownSizeVariantType, DropdownTriggerButtonProps, FontWeightTokens, Icon, IconButton, IconButtonComponent, IconButtonOptionProps, IconButtonProps, IconButtonSizeVariantType, IconButtonSizeVariants, IconButtonStyleVariantType, IconButtonStyleVariants, IconOptionProps, IconProps, IconSizeVariants, IconSizeVariantsType, Input, InputButton, InputButtonOptionProps, InputButtonProps, InputOptionProps, InputProps, InputSizeVariantType, InputSizeVariants, List, ListContent2ColumnsProps, ListOptionProps, ListProps, ListText2RowsProps, MODAL_FOOTER_KEY, MODAL_HEADER_KEY, Menu, MenuOptionProps, MenuProps, MenuSizeVariantType, MenuSizeVariants, MinusBoxOptionProps, MinusBoxProps, MinusButton, Modal, ModalBodyOptionProps, ModalBodyProps, ModalBottomProps, ModalContainerOptionProps, ModalContainerProps, ModalContext, ModalFooterOptionProps, ModalFooterProps, ModalFooterType, ModalHandlerContext, ModalHeaderOptionProps, ModalHeaderProps, ModalHeaderType, ModalPortal as ModalProvider, ModalSize, ModalSizeType, ModalStateType, ModalTopProps, MonthClickDateInfo, MonthDatepicker, MonthDatepickerProps, MonthDatepickerStyleType, MotionStack, MotionStackComponentType, MotionStackContainer, MotionStackContainerComponentType, NumberCombobox, NumberComboboxErrorType, NumberComboboxInputType, NumberComboboxOptionProps, NumberComboboxProps, NumberComboboxSizeVariantType, NumberComboboxSizeVariants, Pagination, PaginationOptionProps, PaginationProps, PaginationSizeSelectorProps, PolymorphicComponentProps, PolymorphicRef, Popper, PopperOptionProps, PopperPortal, PopperPortalProps, PopperProps, PopperTrigger, PopperTriggerProps, RADIO_SYMBOL_KEY, Radio, RadioOptionProps, RadioProps, RemoveModalProps, ScrollArea, ScrollAreaOptionProps, ScrollAreaProps, ScrollbarRefType, SelectInputButton, SelectInputButtonOptionProps, SelectInputButtonProps, ShoplflowProvider, ShoplflowProviderProps, SpacingTokens, SplitButton, SplitButtonContext, SplitButtonContextType, SplitButtonOptionProps, SplitButtonProps, SplitButtonSizeVariantType, SplitButtonSizeVariants, SplitButtonStyleVariantType, SplitButtonStyleVariants, Stack, StackComponentType, StackContainer, StackContainerComponentType, StackContainerGenericProps, StackContainerOptionProps, StackContainerProps, StackGenericProps, StackOptionProps, StackProps, StyledIcon, StyledStack, StyledStackContainer, Switch, SwitchOptionProps, SwitchProps, TREE_SYMBOL_KEY, TabOptionProps, TabProps, TabSizeVariantType, TabSizeVariants, TabStyleVariantType, TabStyleVariants, TabStyledProps, TabTextStyledProps, Tabs, TabsContext, TabsContextType, TabsOptionProps, TabsProps, Tag, TagOptionProps, TagProps, TagSizeVariantType, TagSizeVariants, TagStyleVariantType, TagStyleVariants, Text, Text2Rows, TextArea, TextAreaOptionProps, TextAreaProps, TextOptionProps, TextProps, ToggleButton, ToggleButtonInnerRadioOptionProps, ToggleButtonInnerRadioProps, ToggleButtonOptionProps, ToggleButtonProps, ToggleButtonSizeVariantType, ToggleButtonSizeVariants, Tooltip, TooltipContentProps, TooltipOptionProps, TooltipProps, Tree, TreeItem, TreeItemOptionProps, TreeItemProps, TreeOptionProps, TreeProps, TypographyTokens, WeekClickDateInfo, WeekDatepicker, WeekDatepickerProps, WeekDatepickerStyleType, YearSelectProps, borderRadiusTokens, boxShadowTokens, colorTokens, fontWeightTokens, getDomain, spacingTokens, typographyTokens, useDomain, useDropdownButtonContext, useHandleModal, useModalValue, useSplitButtonContext, useTabs };
1535
+ declare type SkeletonProps = {
1536
+ styleVar?: 'circle' | 'rectangle';
1537
+ width?: string;
1538
+ height?: string;
1539
+ };
1540
+
1541
+ declare const Skeleton: ({ styleVar, width, height }: SkeletonProps) => react_jsx_runtime.JSX.Element;
1542
+
1543
+ export { AnnualDatepicker, AnnualDatepickerProps, AsProp, Avatar, AvatarOptionProps, AvatarProps, AvatarSizeVariantType, AvatarSizeVariants, BackDropOptionProps, BackDropProps, BorderRadiusTokens, BoxShadowTokens, Button, ButtonComponent, ButtonOptionProps, ButtonProps, ButtonSizeVariantType, ButtonSizeVariants, ButtonStyleVariantType, ButtonStyleVariants, CHECKBOX_SYMBOL_KEY, 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, DangerouslySetInnerHTML, DayCalendarType, DayDatepicker, DayDatepickerHeaderCustomProps, DayDatepickerOptionProps, DayDatepickerProps, DayDatepickerSizeVariantType, DayDatepickerSizeVariants, DomainType, Dropdown, DropdownButton, DropdownButtonContext, DropdownButtonContextType, DropdownButtonOptionProps, DropdownButtonProps, DropdownButtonSizeVariantType, DropdownButtonSizeVariants, DropdownButtonStyleVariantType, DropdownButtonStyleVariants, DropdownContentProps, DropdownOptionProps, DropdownOptionVariantType, DropdownOptionVariants, DropdownProps, DropdownSizeVariantType, DropdownTriggerButtonProps, FontWeightTokens, Icon, IconButton, IconButtonComponent, IconButtonOptionProps, IconButtonProps, IconButtonSizeVariantType, IconButtonSizeVariants, IconButtonStyleVariantType, IconButtonStyleVariants, IconOptionProps, IconProps, IconSizeVariants, IconSizeVariantsType, Input, InputButton, InputButtonOptionProps, InputButtonProps, InputOptionProps, InputProps, InputSizeVariantType, InputSizeVariants, List, ListContent2ColumnsProps, ListOptionProps, ListProps, ListText2RowsProps, MODAL_FOOTER_KEY, MODAL_HEADER_KEY, Menu, MenuOptionProps, MenuProps, MenuSizeVariantType, MenuSizeVariants, MinusBoxOptionProps, MinusBoxProps, MinusButton, Modal, ModalBodyOptionProps, ModalBodyProps, ModalBottomProps, ModalContainerOptionProps, ModalContainerProps, ModalContext, ModalFooterOptionProps, ModalFooterProps, ModalFooterType, ModalHandlerContext, ModalHeaderOptionProps, ModalHeaderProps, ModalHeaderType, ModalPortal as ModalProvider, ModalSize, ModalSizeType, ModalStateType, ModalTopProps, MonthClickDateInfo, MonthDatepicker, MonthDatepickerProps, MonthDatepickerStyleType, MotionStack, MotionStackComponentType, MotionStackContainer, MotionStackContainerComponentType, NumberCombobox, NumberComboboxErrorType, NumberComboboxInputType, NumberComboboxOptionProps, NumberComboboxProps, NumberComboboxSizeVariantType, NumberComboboxSizeVariants, Pagination, PaginationOptionProps, PaginationProps, PaginationSizeSelectorProps, PolymorphicComponentProps, PolymorphicRef, Popper, PopperOptionProps, PopperPortal, PopperPortalProps, PopperProps, PopperTrigger, PopperTriggerProps, RADIO_SYMBOL_KEY, Radio, RadioOptionProps, RadioProps, RemoveModalProps, ScrollArea, ScrollAreaOptionProps, ScrollAreaProps, ScrollbarRefType, SelectInputButton, SelectInputButtonOptionProps, SelectInputButtonProps, ShoplflowProvider, ShoplflowProviderProps, Skeleton, SkeletonProps, SpacingTokens, SplitButton, SplitButtonContext, SplitButtonContextType, SplitButtonOptionProps, SplitButtonProps, SplitButtonSizeVariantType, SplitButtonSizeVariants, SplitButtonStyleVariantType, SplitButtonStyleVariants, Stack, StackComponentType, StackContainer, StackContainerComponentType, StackContainerGenericProps, StackContainerOptionProps, StackContainerProps, StackGenericProps, StackOptionProps, StackProps, StyledIcon, StyledStack, StyledStackContainer, Switch, SwitchOptionProps, SwitchProps, TREE_SYMBOL_KEY, TabOptionProps, TabProps, TabSizeVariantType, TabSizeVariants, TabStyleVariantType, TabStyleVariants, TabStyledProps, TabTextStyledProps, Tabs, TabsContext, TabsContextType, TabsOptionProps, TabsProps, Tag, TagOptionProps, TagProps, TagSizeVariantType, TagSizeVariants, TagStyleVariantType, TagStyleVariants, Text, Text2Rows, TextArea, TextAreaOptionProps, TextAreaProps, TextOptionProps, TextProps, ToggleButton, ToggleButtonInnerRadioOptionProps, ToggleButtonInnerRadioProps, ToggleButtonOptionProps, ToggleButtonProps, ToggleButtonSizeVariantType, ToggleButtonSizeVariants, Tooltip, TooltipContentProps, TooltipOptionProps, TooltipProps, Tree, TreeItem, TreeItemOptionProps, TreeItemProps, TreeOptionProps, TreeProps, TypographyTokens, WeekClickDateInfo, WeekDatepicker, WeekDatepickerProps, WeekDatepickerStyleType, YearSelectProps, borderRadiusTokens, boxShadowTokens, colorTokens, fontWeightTokens, getDomain, spacingTokens, typographyTokens, useDomain, useDropdownButtonContext, useHandleModal, useModalValue, useSplitButtonContext, useTabs };
package/dist/index.d.ts CHANGED
@@ -1532,4 +1532,12 @@ declare type NumberComboboxProps = NumberComboboxOptionProps & Omit<InputHTMLAtt
1532
1532
 
1533
1533
  declare const NumberCombobox: ({ disabled, onSelect, onChange, value, width, onBlur, items, isError, sizeVar, placeholder, maxLength, className, floatingZIndex, ...rest }: NumberComboboxProps) => react_jsx_runtime.JSX.Element;
1534
1534
 
1535
- export { AnnualDatepicker, AnnualDatepickerProps, AsProp, Avatar, AvatarOptionProps, AvatarProps, AvatarSizeVariantType, AvatarSizeVariants, BackDropOptionProps, BackDropProps, BorderRadiusTokens, BoxShadowTokens, Button, ButtonComponent, ButtonOptionProps, ButtonProps, ButtonSizeVariantType, ButtonSizeVariants, ButtonStyleVariantType, ButtonStyleVariants, CHECKBOX_SYMBOL_KEY, 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, DangerouslySetInnerHTML, DayCalendarType, DayDatepicker, DayDatepickerHeaderCustomProps, DayDatepickerOptionProps, DayDatepickerProps, DayDatepickerSizeVariantType, DayDatepickerSizeVariants, DomainType, Dropdown, DropdownButton, DropdownButtonContext, DropdownButtonContextType, DropdownButtonOptionProps, DropdownButtonProps, DropdownButtonSizeVariantType, DropdownButtonSizeVariants, DropdownButtonStyleVariantType, DropdownButtonStyleVariants, DropdownContentProps, DropdownOptionProps, DropdownOptionVariantType, DropdownOptionVariants, DropdownProps, DropdownSizeVariantType, DropdownTriggerButtonProps, FontWeightTokens, Icon, IconButton, IconButtonComponent, IconButtonOptionProps, IconButtonProps, IconButtonSizeVariantType, IconButtonSizeVariants, IconButtonStyleVariantType, IconButtonStyleVariants, IconOptionProps, IconProps, IconSizeVariants, IconSizeVariantsType, Input, InputButton, InputButtonOptionProps, InputButtonProps, InputOptionProps, InputProps, InputSizeVariantType, InputSizeVariants, List, ListContent2ColumnsProps, ListOptionProps, ListProps, ListText2RowsProps, MODAL_FOOTER_KEY, MODAL_HEADER_KEY, Menu, MenuOptionProps, MenuProps, MenuSizeVariantType, MenuSizeVariants, MinusBoxOptionProps, MinusBoxProps, MinusButton, Modal, ModalBodyOptionProps, ModalBodyProps, ModalBottomProps, ModalContainerOptionProps, ModalContainerProps, ModalContext, ModalFooterOptionProps, ModalFooterProps, ModalFooterType, ModalHandlerContext, ModalHeaderOptionProps, ModalHeaderProps, ModalHeaderType, ModalPortal as ModalProvider, ModalSize, ModalSizeType, ModalStateType, ModalTopProps, MonthClickDateInfo, MonthDatepicker, MonthDatepickerProps, MonthDatepickerStyleType, MotionStack, MotionStackComponentType, MotionStackContainer, MotionStackContainerComponentType, NumberCombobox, NumberComboboxErrorType, NumberComboboxInputType, NumberComboboxOptionProps, NumberComboboxProps, NumberComboboxSizeVariantType, NumberComboboxSizeVariants, Pagination, PaginationOptionProps, PaginationProps, PaginationSizeSelectorProps, PolymorphicComponentProps, PolymorphicRef, Popper, PopperOptionProps, PopperPortal, PopperPortalProps, PopperProps, PopperTrigger, PopperTriggerProps, RADIO_SYMBOL_KEY, Radio, RadioOptionProps, RadioProps, RemoveModalProps, ScrollArea, ScrollAreaOptionProps, ScrollAreaProps, ScrollbarRefType, SelectInputButton, SelectInputButtonOptionProps, SelectInputButtonProps, ShoplflowProvider, ShoplflowProviderProps, SpacingTokens, SplitButton, SplitButtonContext, SplitButtonContextType, SplitButtonOptionProps, SplitButtonProps, SplitButtonSizeVariantType, SplitButtonSizeVariants, SplitButtonStyleVariantType, SplitButtonStyleVariants, Stack, StackComponentType, StackContainer, StackContainerComponentType, StackContainerGenericProps, StackContainerOptionProps, StackContainerProps, StackGenericProps, StackOptionProps, StackProps, StyledIcon, StyledStack, StyledStackContainer, Switch, SwitchOptionProps, SwitchProps, TREE_SYMBOL_KEY, TabOptionProps, TabProps, TabSizeVariantType, TabSizeVariants, TabStyleVariantType, TabStyleVariants, TabStyledProps, TabTextStyledProps, Tabs, TabsContext, TabsContextType, TabsOptionProps, TabsProps, Tag, TagOptionProps, TagProps, TagSizeVariantType, TagSizeVariants, TagStyleVariantType, TagStyleVariants, Text, Text2Rows, TextArea, TextAreaOptionProps, TextAreaProps, TextOptionProps, TextProps, ToggleButton, ToggleButtonInnerRadioOptionProps, ToggleButtonInnerRadioProps, ToggleButtonOptionProps, ToggleButtonProps, ToggleButtonSizeVariantType, ToggleButtonSizeVariants, Tooltip, TooltipContentProps, TooltipOptionProps, TooltipProps, Tree, TreeItem, TreeItemOptionProps, TreeItemProps, TreeOptionProps, TreeProps, TypographyTokens, WeekClickDateInfo, WeekDatepicker, WeekDatepickerProps, WeekDatepickerStyleType, YearSelectProps, borderRadiusTokens, boxShadowTokens, colorTokens, fontWeightTokens, getDomain, spacingTokens, typographyTokens, useDomain, useDropdownButtonContext, useHandleModal, useModalValue, useSplitButtonContext, useTabs };
1535
+ declare type SkeletonProps = {
1536
+ styleVar?: 'circle' | 'rectangle';
1537
+ width?: string;
1538
+ height?: string;
1539
+ };
1540
+
1541
+ declare const Skeleton: ({ styleVar, width, height }: SkeletonProps) => react_jsx_runtime.JSX.Element;
1542
+
1543
+ export { AnnualDatepicker, AnnualDatepickerProps, AsProp, Avatar, AvatarOptionProps, AvatarProps, AvatarSizeVariantType, AvatarSizeVariants, BackDropOptionProps, BackDropProps, BorderRadiusTokens, BoxShadowTokens, Button, ButtonComponent, ButtonOptionProps, ButtonProps, ButtonSizeVariantType, ButtonSizeVariants, ButtonStyleVariantType, ButtonStyleVariants, CHECKBOX_SYMBOL_KEY, 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, DangerouslySetInnerHTML, DayCalendarType, DayDatepicker, DayDatepickerHeaderCustomProps, DayDatepickerOptionProps, DayDatepickerProps, DayDatepickerSizeVariantType, DayDatepickerSizeVariants, DomainType, Dropdown, DropdownButton, DropdownButtonContext, DropdownButtonContextType, DropdownButtonOptionProps, DropdownButtonProps, DropdownButtonSizeVariantType, DropdownButtonSizeVariants, DropdownButtonStyleVariantType, DropdownButtonStyleVariants, DropdownContentProps, DropdownOptionProps, DropdownOptionVariantType, DropdownOptionVariants, DropdownProps, DropdownSizeVariantType, DropdownTriggerButtonProps, FontWeightTokens, Icon, IconButton, IconButtonComponent, IconButtonOptionProps, IconButtonProps, IconButtonSizeVariantType, IconButtonSizeVariants, IconButtonStyleVariantType, IconButtonStyleVariants, IconOptionProps, IconProps, IconSizeVariants, IconSizeVariantsType, Input, InputButton, InputButtonOptionProps, InputButtonProps, InputOptionProps, InputProps, InputSizeVariantType, InputSizeVariants, List, ListContent2ColumnsProps, ListOptionProps, ListProps, ListText2RowsProps, MODAL_FOOTER_KEY, MODAL_HEADER_KEY, Menu, MenuOptionProps, MenuProps, MenuSizeVariantType, MenuSizeVariants, MinusBoxOptionProps, MinusBoxProps, MinusButton, Modal, ModalBodyOptionProps, ModalBodyProps, ModalBottomProps, ModalContainerOptionProps, ModalContainerProps, ModalContext, ModalFooterOptionProps, ModalFooterProps, ModalFooterType, ModalHandlerContext, ModalHeaderOptionProps, ModalHeaderProps, ModalHeaderType, ModalPortal as ModalProvider, ModalSize, ModalSizeType, ModalStateType, ModalTopProps, MonthClickDateInfo, MonthDatepicker, MonthDatepickerProps, MonthDatepickerStyleType, MotionStack, MotionStackComponentType, MotionStackContainer, MotionStackContainerComponentType, NumberCombobox, NumberComboboxErrorType, NumberComboboxInputType, NumberComboboxOptionProps, NumberComboboxProps, NumberComboboxSizeVariantType, NumberComboboxSizeVariants, Pagination, PaginationOptionProps, PaginationProps, PaginationSizeSelectorProps, PolymorphicComponentProps, PolymorphicRef, Popper, PopperOptionProps, PopperPortal, PopperPortalProps, PopperProps, PopperTrigger, PopperTriggerProps, RADIO_SYMBOL_KEY, Radio, RadioOptionProps, RadioProps, RemoveModalProps, ScrollArea, ScrollAreaOptionProps, ScrollAreaProps, ScrollbarRefType, SelectInputButton, SelectInputButtonOptionProps, SelectInputButtonProps, ShoplflowProvider, ShoplflowProviderProps, Skeleton, SkeletonProps, SpacingTokens, SplitButton, SplitButtonContext, SplitButtonContextType, SplitButtonOptionProps, SplitButtonProps, SplitButtonSizeVariantType, SplitButtonSizeVariants, SplitButtonStyleVariantType, SplitButtonStyleVariants, Stack, StackComponentType, StackContainer, StackContainerComponentType, StackContainerGenericProps, StackContainerOptionProps, StackContainerProps, StackGenericProps, StackOptionProps, StackProps, StyledIcon, StyledStack, StyledStackContainer, Switch, SwitchOptionProps, SwitchProps, TREE_SYMBOL_KEY, TabOptionProps, TabProps, TabSizeVariantType, TabSizeVariants, TabStyleVariantType, TabStyleVariants, TabStyledProps, TabTextStyledProps, Tabs, TabsContext, TabsContextType, TabsOptionProps, TabsProps, Tag, TagOptionProps, TagProps, TagSizeVariantType, TagSizeVariants, TagStyleVariantType, TagStyleVariants, Text, Text2Rows, TextArea, TextAreaOptionProps, TextAreaProps, TextOptionProps, TextProps, ToggleButton, ToggleButtonInnerRadioOptionProps, ToggleButtonInnerRadioProps, ToggleButtonOptionProps, ToggleButtonProps, ToggleButtonSizeVariantType, ToggleButtonSizeVariants, Tooltip, TooltipContentProps, TooltipOptionProps, TooltipProps, Tree, TreeItem, TreeItemOptionProps, TreeItemProps, TreeOptionProps, TreeProps, TypographyTokens, WeekClickDateInfo, WeekDatepicker, WeekDatepickerProps, WeekDatepickerStyleType, YearSelectProps, borderRadiusTokens, boxShadowTokens, colorTokens, fontWeightTokens, getDomain, spacingTokens, typographyTokens, useDomain, useDropdownButtonContext, useHandleModal, useModalValue, useSplitButtonContext, useTabs };
package/dist/index.js CHANGED
@@ -4,7 +4,7 @@ import styled6 from '@emotion/styled';
4
4
  import { motion, AnimatePresence, LayoutGroup, LazyMotion, domAnimation } from 'framer-motion';
5
5
  import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
6
6
  import { createPortal } from 'react-dom';
7
- import { css } from '@emotion/react';
7
+ import { css, keyframes } from '@emotion/react';
8
8
  import { noop, useMergeRefs, useOutsideClick, OutSideClick, useSelect, useParentElementClick, isNullOrUndefined } from '@shoplflow/utils';
9
9
  import Scrollbars from 'react-custom-scrollbars-2';
10
10
  import { FloatingPortal, autoUpdate, offset, autoPlacement } from '@floating-ui/react';
@@ -1958,7 +1958,7 @@ var PopperTrigger = forwardRef(
1958
1958
  var PopperPortal = forwardRef(
1959
1959
  ({ children, animation: initialAnimation, zIndex }, ref) => {
1960
1960
  const { floatingStyles, setFloating, isOpen } = usePopper();
1961
- const animation = initialAnimation != null ? initialAnimation : fadeInOut;
1961
+ const animation2 = initialAnimation != null ? initialAnimation : fadeInOut;
1962
1962
  const refs = useMergeRefs2(ref, setFloating);
1963
1963
  let _floatingStyles = __spreadValues({}, floatingStyles);
1964
1964
  if (zIndex) {
@@ -1970,9 +1970,9 @@ var PopperPortal = forwardRef(
1970
1970
  return /* @__PURE__ */ jsx(FloatingPortal, { children: /* @__PURE__ */ jsx(AnimatePresence, { children: /* @__PURE__ */ jsx(
1971
1971
  motion.div,
1972
1972
  {
1973
- initial: animation.initial,
1974
- animate: animation.animate,
1975
- exit: animation.exit,
1973
+ initial: animation2.initial,
1974
+ animate: animation2.animate,
1975
+ exit: animation2.exit,
1976
1976
  ref: refs,
1977
1977
  style: _floatingStyles,
1978
1978
  children
@@ -4031,6 +4031,7 @@ var TextArea = forwardRef(
4031
4031
  height,
4032
4032
  minHeight,
4033
4033
  width,
4034
+ gap: "0",
4034
4035
  "data-shoplflow": "text-area",
4035
4036
  children: [
4036
4037
  /* @__PURE__ */ jsx(
@@ -6501,6 +6502,54 @@ var NumberComboboxSizeVariants = {
6501
6502
  S: "S",
6502
6503
  M: "M"
6503
6504
  };
6505
+ var animation = keyframes`
6506
+ 0% {
6507
+ transform: translateX(-100%);
6508
+ }
6509
+
6510
+ 100% {
6511
+ transform: translateX(200%);
6512
+ }
6513
+ `;
6514
+ var getSkeletonStyles = (width, height, styleVar) => {
6515
+ switch (styleVar) {
6516
+ case "circle":
6517
+ return css`
6518
+ width: ${width};
6519
+ height: ${width};
6520
+ border-radius: 50%;
6521
+ `;
6522
+ case "rectangle":
6523
+ return css`
6524
+ width: ${width};
6525
+ height: ${height};
6526
+ `;
6527
+ }
6528
+ };
6529
+ var Container6 = styled6.div`
6530
+ position: relative;
6531
+ border-radius: 8px;
6532
+ background-color: ${colorTokens.neutral200};
6533
+ overflow: hidden;
6534
+
6535
+ ${({ styleVar, width, height }) => getSkeletonStyles(width, height, styleVar)};
6536
+
6537
+ &::after {
6538
+ content: '';
6539
+ position: absolute;
6540
+ top: 0;
6541
+ left: 0;
6542
+ width: 100%;
6543
+ height: 100%;
6544
+ background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0));
6545
+ transform: translateX(-100%);
6546
+ animation: ${animation} 2s infinite;
6547
+ }
6548
+ `;
6549
+ var Skeleton = ({ styleVar = "rectangle", width = "50px", height = "20px" }) => {
6550
+ return /* @__PURE__ */ jsx(Container6, { styleVar, width, height, "data-shoplflow": "Skeleton" });
6551
+ };
6552
+ var Skeleton_default = Skeleton;
6504
6553
  var SpaceMarginWrapper = styled6(motion.div)`
6505
6554
  position: relative;
6506
6555
  display: flex;
@@ -6555,4 +6604,4 @@ classnames/index.js:
6555
6604
  *)
6556
6605
  */
6557
6606
 
6558
- export { AnnualDatepicker_default as AnnualDatepicker, Avatar_default as Avatar, AvatarSizeVariants, Button_default as Button, ButtonSizeVariants, ButtonStyleVariants, CHECKBOX_SYMBOL_KEY, Callout_default as Callout, CalloutTypes, Checkbox_default as Checkbox, CheckboxStyleVariants, ChipButton_default as ChipButton, ChipButtonSizeVariants, ChipButtonStyleVariants, ChipToggle_default as ChipToggle, ChipToggleSizeVariants, ChipToggleStyleVariants, DayDatepicker_default as DayDatepicker, DayDatepickerSizeVariants, Dropdown_default as Dropdown, DropdownButton_default as DropdownButton, DropdownButtonContext, DropdownButtonSizeVariants, DropdownButtonStyleVariants, DropdownOptionVariants, Icon_default as Icon, IconButton_default as IconButton, IconButtonSizeVariants, IconButtonStyleVariants, IconSizeVariants, Input_default as Input, InputButton_default as InputButton, InputSizeVariants, List_default as List, MODAL_FOOTER_KEY, MODAL_HEADER_KEY, Menu_default as Menu, MenuSizeVariants, MinusButton_default as MinusButton, Modal, ModalContext, ModalHandlerContext, ModalPortal_default as ModalProvider, ModalSize, MonthDatepicker_default as MonthDatepicker, MotionStack, MotionStackContainer, NumberCombobox_default as NumberCombobox, NumberComboboxSizeVariants, Pagination_default as Pagination, Popper_default as Popper, PopperPortal, PopperTrigger, RADIO_SYMBOL_KEY, Radio_default as Radio, ScrollArea_default as ScrollArea, SelectInputButton_default as SelectInputButton, ShoplflowProvider_default as ShoplflowProvider, SplitButton_default as SplitButton, SplitButtonContext, SplitButtonSizeVariants, SplitButtonStyleVariants, Stack_default as Stack, StackContainer_default as StackContainer, StyledIcon, StyledStack, StyledStackContainer, Switch_default as Switch, TREE_SYMBOL_KEY, TabSizeVariants, TabStyleVariants, Tabs_default as Tabs, TabsContext, Tag_default as Tag, TagSizeVariants, TagStyleVariants, Text_default as Text, Text2Rows, TextArea_default as TextArea, ToggleButton_default as ToggleButton, ToggleButtonSizeVariants, Tooltip_default as Tooltip, Tree_default as Tree, TreeItem, WeekDatepicker_default as WeekDatepicker, borderRadiusTokens, boxShadowTokens, colorTokens, fontWeightTokens, getDomain, spacingTokens, typographyTokens, useDomain, useDropdownButtonContext, useHandleModal, useModalValue, useSplitButtonContext, useTabs };
6607
+ export { AnnualDatepicker_default as AnnualDatepicker, Avatar_default as Avatar, AvatarSizeVariants, Button_default as Button, ButtonSizeVariants, ButtonStyleVariants, CHECKBOX_SYMBOL_KEY, Callout_default as Callout, CalloutTypes, Checkbox_default as Checkbox, CheckboxStyleVariants, ChipButton_default as ChipButton, ChipButtonSizeVariants, ChipButtonStyleVariants, ChipToggle_default as ChipToggle, ChipToggleSizeVariants, ChipToggleStyleVariants, DayDatepicker_default as DayDatepicker, DayDatepickerSizeVariants, Dropdown_default as Dropdown, DropdownButton_default as DropdownButton, DropdownButtonContext, DropdownButtonSizeVariants, DropdownButtonStyleVariants, DropdownOptionVariants, Icon_default as Icon, IconButton_default as IconButton, IconButtonSizeVariants, IconButtonStyleVariants, IconSizeVariants, Input_default as Input, InputButton_default as InputButton, InputSizeVariants, List_default as List, MODAL_FOOTER_KEY, MODAL_HEADER_KEY, Menu_default as Menu, MenuSizeVariants, MinusButton_default as MinusButton, Modal, ModalContext, ModalHandlerContext, ModalPortal_default as ModalProvider, ModalSize, MonthDatepicker_default as MonthDatepicker, MotionStack, MotionStackContainer, NumberCombobox_default as NumberCombobox, NumberComboboxSizeVariants, Pagination_default as Pagination, Popper_default as Popper, PopperPortal, PopperTrigger, RADIO_SYMBOL_KEY, Radio_default as Radio, ScrollArea_default as ScrollArea, SelectInputButton_default as SelectInputButton, ShoplflowProvider_default as ShoplflowProvider, Skeleton_default as Skeleton, SplitButton_default as SplitButton, SplitButtonContext, SplitButtonSizeVariants, SplitButtonStyleVariants, Stack_default as Stack, StackContainer_default as StackContainer, StyledIcon, StyledStack, StyledStackContainer, Switch_default as Switch, TREE_SYMBOL_KEY, TabSizeVariants, TabStyleVariants, Tabs_default as Tabs, TabsContext, Tag_default as Tag, TagSizeVariants, TagStyleVariants, Text_default as Text, Text2Rows, TextArea_default as TextArea, ToggleButton_default as ToggleButton, ToggleButtonSizeVariants, Tooltip_default as Tooltip, Tree_default as Tree, TreeItem, WeekDatepicker_default as WeekDatepicker, borderRadiusTokens, boxShadowTokens, colorTokens, fontWeightTokens, getDomain, spacingTokens, typographyTokens, useDomain, useDropdownButtonContext, useHandleModal, useModalValue, useSplitButtonContext, useTabs };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@shoplflow/base",
3
- "version": "0.33.1",
3
+ "version": "0.33.3",
4
4
  "type": "module",
5
5
  "license": "Apache-2.0",
6
6
  "main": "dist/index.js",