@doist/reactist 10.0.0-beta.4 → 10.0.0-beta.8

package/es/components/menu/menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu.js","sources":["../../../src/components/menu/menu.tsx"],"sourcesContent":["import * as React from 'react'\nimport classNames from 'classnames'\nimport { polymorphicComponent } from '../../utils/polymorphism'\n\n//\n// Reactist menu is a thin wrapper around Reakit's menu components. This may or may not be\n// temporary. Our goal is to make it transparent for the users of Reactist of this implementation\n// detail. We may change in the future the external lib we use, or even implement it all internally,\n// as long as we keep the same outer interface as intact as possible.\n//\n// Around the heavy lifting of the external lib we just add some features to better integrate the\n// menu to Reactist's more opinionated approach (e.g. using our button with its custom variants and\n// other features, easily show keyboard shortcuts in menu items, etc.)\n//\nimport * as Reakit from 'reakit/Menu'\nimport { PopoverBackdrop } from 'reakit/Popover'\n\nimport './menu.less'\n\ntype NativeProps<E extends HTMLElement> = React.DetailedHTMLProps<React.HTMLAttributes<E>, E>\n\ntype MenuContextState = Reakit.MenuStateReturn & {\n    handleItemSelect: (value: string | null | undefined) => void\n}\n\nconst MenuContext = React.createContext<MenuContextState>(\n    // Reakit gives us no means to obtain a valid initial/default value of type MenuStateReturn\n    // (it is normally obtained by calling useMenuState but we can't call hooks outside components).\n    // This is however of little consequence since this value is only used if some of the components\n    // are used outside Menu, something that should not happen and we do not support.\n    // @ts-expect-error\n    {},\n)\n\n//\n// Menu\n//\n\ntype MenuProps = Omit<Reakit.MenuInitialState, 'visible'> & {\n    /**\n     * The `Menu` must contain a `MenuList` that defines the menu options. It must also contain a\n     * `MenuButton` that triggers the menu to be opened or closed.\n     */\n    children: React.ReactNode\n\n    /**\n     * An optional callback that will be called back whenever a menu item is selected. It receives\n     * the `value` of the selected `MenuItem`.\n     *\n     * If you pass down this callback, it is recommended that you properly memoize it so it does not\n     * change on every render.\n     */\n    onItemSelect?: (value: string | null | undefined) => void\n}\n\n/**\n * Wrapper component to control a menu. It does not render anything, only providing the state\n * management for the menu components inside it.\n */\nfunction Menu({ children, onItemSelect, ...props }: MenuProps) {\n    const state = Reakit.useMenuState({ loop: true, ...props })\n\n    const handleItemSelect = React.useCallback(\n        function handleItemSelect(value: string | null | undefined) {\n            if (onItemSelect) onItemSelect(value)\n        },\n        [onItemSelect],\n    )\n\n    const value: MenuContextState = React.useMemo(\n        () => ({\n            ...state,\n            handleItemSelect,\n        }),\n        [state, handleItemSelect],\n    )\n\n    return <MenuContext.Provider value={value}>{children}</MenuContext.Provider>\n}\n\n//\n// MenuButton\n//\n\ntype MenuButtonProps = Omit<Reakit.MenuButtonProps, keyof Reakit.MenuStateReturn>\n\n/**\n * A button to toggle a dropdown menu open or closed.\n */\nconst MenuButton = polymorphicComponent<'button', MenuButtonProps>(function MenuButton(\n    { exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { handleItemSelect, ...state } = React.useContext(MenuContext)\n    return (\n        <Reakit.MenuButton\n            {...props}\n            {...state}\n            ref={ref}\n            className={classNames('reactist_menubutton', exceptionallySetClassName)}\n        />\n    )\n})\n\n//\n// MenuList\n//\n\ntype MenuBackdropProps = Reakit.MenuStateReturn & {\n    children: React.ReactNode\n}\n\nconst BACKDROP_STYLE: React.CSSProperties = {\n    width: '100%',\n    height: '100%',\n    position: 'fixed',\n    top: 0,\n    left: 0,\n}\n\n/**\n * Internal component to provide a backdrop/overlay to all menus. This is needed because reakit's\n * menus do not show an overlay by default.\n */\nfunction MenuBackdrop({\n    baseId,\n    visible,\n    animated,\n    animating,\n    stopAnimation,\n    modal,\n    children,\n}: MenuBackdropProps) {\n    return (\n        <PopoverBackdrop\n            baseId={baseId}\n            visible={visible}\n            animated={animated}\n            animating={animating}\n            stopAnimation={stopAnimation}\n            modal={modal}\n            style={BACKDROP_STYLE}\n        >\n            {children}\n        </PopoverBackdrop>\n    )\n}\n\ntype MenuListProps = Omit<Reakit.MenuProps, keyof Reakit.MenuStateReturn>\n\n/**\n * The dropdown menu itself, containing a list of menu items.\n */\nconst MenuList = polymorphicComponent<'div', MenuListProps>(function MenuList(\n    { exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { handleItemSelect, ...state } = React.useContext(MenuContext)\n    return state.visible ? (\n        <MenuBackdrop {...state}>\n            <Reakit.Menu\n                {...props}\n                {...state}\n                ref={ref}\n                className={classNames('reactist_menulist', exceptionallySetClassName)}\n            />\n        </MenuBackdrop>\n    ) : null\n})\n\n//\n// MenuItem\n//\n\ntype MenuItemProps = {\n    /**\n     * An optional value given to this menu item. It is passed on to the parent `Menu`'s\n     * `onItemSelect` when you provide that instead of (or alongside) providing individual\n     * `onSelect` callbacks to each menu item.\n     */\n    value?: string\n    /**\n     * The content inside the menu item.\n     */\n    children: React.ReactNode\n    /**\n     * When `true` the menu item is disabled and won't be selectable or be part of the keyboard\n     * navigation across the menu options.\n     *\n     * @default true\n     */\n    disabled?: boolean\n    /**\n     * A class name to apply to the menu item element.\n     */\n    className?: string\n    /**\n     * When `true` the menu will close when the menu item is selected, in addition to performing the\n     * action that the menu item is set out to do.\n     *\n     * Set this to `false` to make sure that a given menu item does not auto-closes the menu when\n     * selected. This should be the exception and not the norm, as the default is to auto-close.\n     *\n     * @default true\n     */\n    hideOnSelect?: boolean\n    /**\n     * The action to perform when the menu item is selected.\n     *\n     * If you return `false` from this function, the menu will not auto-close when this menu item\n     * is selected. Though you should use `hideOnSelect` for this purpose, this allows you to\n     * achieve the same effect conditionally and dynamically deciding at run time.\n     */\n    onSelect?: () => unknown\n    /**\n     * The event handler called when the menu item is clicked.\n     *\n     * This is similar to `onSelect`, but a bit different. You can certainly use it to trigger the\n     * action that the menu item represents. But in general you should prefer `onSelect` for that.\n     *\n     * The main use for this handler is to get access to the click event. This can be used, for\n     * example, to call `event.preventDefault()`, which will effectively prevent the rest of the\n     * consequences of the click, including preventing `onSelect` from being called. In particular,\n     * this is useful in menu items that are links, and you want the click to not trigger navigation\n     * under some circumstances.\n     */\n    onClick?: (event: React.MouseEvent) => void\n}\n\n/**\n * A menu item inside a menu list. It can be selected by the user, triggering the `onSelect`\n * callback.\n */\nconst MenuItem = polymorphicComponent<'button', MenuItemProps>(function MenuItem(\n    {\n        value,\n        children,\n        onSelect,\n        hideOnSelect = true,\n        onClick,\n        exceptionallySetClassName,\n        ...props\n    },\n    ref,\n) {\n    const { handleItemSelect, ...state } = React.useContext(MenuContext)\n    const { hide } = state\n\n    const handleClick = React.useCallback(\n        function handleClick(event: React.MouseEvent<HTMLButtonElement>) {\n            onClick?.(event)\n            const onSelectResult: unknown =\n                onSelect && !event.defaultPrevented ? onSelect() : undefined\n            const shouldClose = onSelectResult !== false && hideOnSelect\n            handleItemSelect(value)\n            if (shouldClose) hide()\n        },\n        [onSelect, onClick, handleItemSelect, hideOnSelect, hide, value],\n    )\n\n    return (\n        <Reakit.MenuItem\n            {...props}\n            {...state}\n            ref={ref}\n            onClick={handleClick}\n            className={exceptionallySetClassName}\n        >\n            {children}\n        </Reakit.MenuItem>\n    )\n})\n\n//\n// SubMenu\n//\n\ntype SubMenuProps = Pick<MenuProps, 'children' | 'onItemSelect'>\n\n/**\n * This component can be rendered alongside other `MenuItem` inside a `MenuList` in order to have\n * a sub-menu.\n *\n * Its children are expected to have the structure of a first level menu (a `MenuButton` and a\n * `MenuList`).\n *\n * ```jsx\n * <MenuItem label=\"Edit profile\" />\n * <SubMenu>\n *   <MenuButton>More options</MenuButton>\n *   <MenuList>\n *     <MenuItem label=\"Preferences\" />\n *     <MenuItem label=\"Sign out\" />\n *   </MenuList>\n * </SubMenu>\n * ```\n *\n * The `MenuButton` will become a menu item in the current menu items list, and it will lead to\n * opening a sub-menu with the menu items list below it.\n */\nconst SubMenu = React.forwardRef<HTMLButtonElement, SubMenuProps>(function SubMenu(\n    { children, onItemSelect, ...props },\n    ref,\n) {\n    const { handleItemSelect: parentMenuItemSelect, ...state } = React.useContext(MenuContext)\n    const { hide: parentMenuHide } = state\n\n    const handleSubItemSelect = React.useCallback(\n        function handleSubItemSelect(value) {\n            if (onItemSelect) onItemSelect(value)\n            parentMenuItemSelect(value)\n            parentMenuHide()\n        },\n        [parentMenuHide, parentMenuItemSelect, onItemSelect],\n    )\n\n    const [button, list] = React.Children.toArray(children)\n\n    return (\n        <Reakit.MenuItem {...state} {...props} ref={ref}>\n            {(buttonProps) => (\n                <Menu onItemSelect={handleSubItemSelect}>\n                    {React.cloneElement(button as React.ReactElement, {\n                        ...buttonProps,\n                        className: classNames(buttonProps.className, 'reactist_submenu_button'),\n                    })}\n                    {list}\n                </Menu>\n            )}\n        </Reakit.MenuItem>\n    )\n})\n\n//\n// MenuGroup\n//\n\ntype MenuGroupProps = NativeProps<HTMLDivElement> & {\n    /**\n     * A label to be shown visually and also used to semantically label the group.\n     */\n    label: string\n}\n\n/**\n * A way to semantically group some menu items.\n *\n * This group does not add any visual separator. You can do that yourself adding `<hr />` elements\n * before and/or after the group if you so wish.\n */\nconst MenuGroup = polymorphicComponent<'div', MenuGroupProps>(function MenuGroud(\n    { label, children, exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { handleItemSelect, ...state } = React.useContext(MenuContext)\n    return (\n        <Reakit.MenuGroup ref={ref} {...props} {...state} className={exceptionallySetClassName}>\n            {label ? (\n                <div role=\"presentation\" className=\"reactist_menugroup__label\">\n                    {label}\n                </div>\n            ) : null}\n            {children}\n        </Reakit.MenuGroup>\n    )\n})\n\nexport { Menu, MenuButton, MenuList, MenuItem, SubMenu, MenuGroup }\nexport type { MenuButtonProps, MenuListProps, MenuItemProps, SubMenuProps, MenuGroupProps }\n"],"names":["MenuContext","React","Menu","children","onItemSelect","props","state","Reakit","loop","handleItemSelect","value","Provider","MenuButton","polymorphicComponent","ref","exceptionallySetClassName","className","classNames","BACKDROP_STYLE","width","height","position","top","left","MenuBackdrop","baseId","visible","animated","animating","stopAnimation","modal","PopoverBackdrop","style","MenuList","MenuItem","onSelect","hideOnSelect","onClick","hide","handleClick","event","onSelectResult","defaultPrevented","undefined","shouldClose","SubMenu","parentMenuItemSelect","parentMenuHide","handleSubItemSelect","toArray","button","list","buttonProps","MenuGroup","MenuGroud","label","role"],"mappings":"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"}
+{"version":3,"file":"menu.js","sources":["../../../src/components/menu/menu.tsx"],"sourcesContent":["import * as React from 'react'\nimport classNames from 'classnames'\nimport { polymorphicComponent } from '../../utils/polymorphism'\n\n//\n// Reactist menu is a thin wrapper around Reakit's menu components. This may or may not be\n// temporary. Our goal is to make it transparent for the users of Reactist of this implementation\n// detail. We may change in the future the external lib we use, or even implement it all internally,\n// as long as we keep the same outer interface as intact as possible.\n//\n// Around the heavy lifting of the external lib we just add some features to better integrate the\n// menu to Reactist's more opinionated approach (e.g. using our button with its custom variants and\n// other features, easily show keyboard shortcuts in menu items, etc.)\n//\nimport * as Reakit from 'reakit/Menu'\nimport { PopoverBackdrop } from 'reakit/Popover'\n\nimport './menu.less'\n\ntype NativeProps<E extends HTMLElement> = React.DetailedHTMLProps<React.HTMLAttributes<E>, E>\n\ntype MenuContextState = Reakit.MenuStateReturn & {\n    handleItemSelect: (value: string | null | undefined) => void\n}\n\nconst MenuContext = React.createContext<MenuContextState>(\n    // Reakit gives us no means to obtain a valid initial/default value of type MenuStateReturn\n    // (it is normally obtained by calling useMenuState but we can't call hooks outside components).\n    // This is however of little consequence since this value is only used if some of the components\n    // are used outside Menu, something that should not happen and we do not support.\n    // @ts-expect-error\n    {},\n)\n\n//\n// Menu\n//\n\ntype MenuProps = Omit<Reakit.MenuInitialState, 'visible'> & {\n    /**\n     * The `Menu` must contain a `MenuList` that defines the menu options. It must also contain a\n     * `MenuButton` that triggers the menu to be opened or closed.\n     */\n    children: React.ReactNode\n\n    /**\n     * An optional callback that will be called back whenever a menu item is selected. It receives\n     * the `value` of the selected `MenuItem`.\n     *\n     * If you pass down this callback, it is recommended that you properly memoize it so it does not\n     * change on every render.\n     */\n    onItemSelect?: (value: string | null | undefined) => void\n}\n\n/**\n * Wrapper component to control a menu. It does not render anything, only providing the state\n * management for the menu components inside it.\n */\nfunction Menu({ children, onItemSelect, ...props }: MenuProps) {\n    const state = Reakit.useMenuState({ loop: true, ...props })\n\n    const handleItemSelect = React.useCallback(\n        function handleItemSelect(value: string | null | undefined) {\n            if (onItemSelect) onItemSelect(value)\n        },\n        [onItemSelect],\n    )\n\n    const value: MenuContextState = React.useMemo(\n        () => ({\n            ...state,\n            handleItemSelect,\n        }),\n        [state, handleItemSelect],\n    )\n\n    return <MenuContext.Provider value={value}>{children}</MenuContext.Provider>\n}\n\n//\n// MenuButton\n//\n\ntype MenuButtonProps = Omit<Reakit.MenuButtonProps, keyof Reakit.MenuStateReturn | 'className'>\n\n/**\n * A button to toggle a dropdown menu open or closed.\n */\nconst MenuButton = polymorphicComponent<'button', MenuButtonProps>(function MenuButton(\n    { exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { handleItemSelect, ...state } = React.useContext(MenuContext)\n    return (\n        <Reakit.MenuButton\n            {...props}\n            {...state}\n            ref={ref}\n            className={classNames('reactist_menubutton', exceptionallySetClassName)}\n        />\n    )\n})\n\n//\n// MenuList\n//\n\ntype MenuBackdropProps = Reakit.MenuStateReturn & {\n    children: React.ReactNode\n}\n\nconst BACKDROP_STYLE: React.CSSProperties = {\n    width: '100%',\n    height: '100%',\n    position: 'fixed',\n    top: 0,\n    left: 0,\n}\n\n/**\n * Internal component to provide a backdrop/overlay to all menus. This is needed because reakit's\n * menus do not show an overlay by default.\n */\nfunction MenuBackdrop({\n    baseId,\n    visible,\n    animated,\n    animating,\n    stopAnimation,\n    modal,\n    children,\n}: MenuBackdropProps) {\n    return (\n        <PopoverBackdrop\n            baseId={baseId}\n            visible={visible}\n            animated={animated}\n            animating={animating}\n            stopAnimation={stopAnimation}\n            modal={modal}\n            style={BACKDROP_STYLE}\n        >\n            {children}\n        </PopoverBackdrop>\n    )\n}\n\ntype MenuListProps = Omit<Reakit.MenuProps, keyof Reakit.MenuStateReturn | 'className'>\n\n/**\n * The dropdown menu itself, containing a list of menu items.\n */\nconst MenuList = polymorphicComponent<'div', MenuListProps>(function MenuList(\n    { exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { handleItemSelect, ...state } = React.useContext(MenuContext)\n    return state.visible ? (\n        <MenuBackdrop {...state}>\n            <Reakit.Menu\n                {...props}\n                {...state}\n                ref={ref}\n                className={classNames('reactist_menulist', exceptionallySetClassName)}\n            />\n        </MenuBackdrop>\n    ) : null\n})\n\n//\n// MenuItem\n//\n\ntype MenuItemProps = {\n    /**\n     * An optional value given to this menu item. It is passed on to the parent `Menu`'s\n     * `onItemSelect` when you provide that instead of (or alongside) providing individual\n     * `onSelect` callbacks to each menu item.\n     */\n    value?: string\n    /**\n     * The content inside the menu item.\n     */\n    children: React.ReactNode\n    /**\n     * When `true` the menu item is disabled and won't be selectable or be part of the keyboard\n     * navigation across the menu options.\n     *\n     * @default true\n     */\n    disabled?: boolean\n    /**\n     * When `true` the menu will close when the menu item is selected, in addition to performing the\n     * action that the menu item is set out to do.\n     *\n     * Set this to `false` to make sure that a given menu item does not auto-closes the menu when\n     * selected. This should be the exception and not the norm, as the default is to auto-close.\n     *\n     * @default true\n     */\n    hideOnSelect?: boolean\n    /**\n     * The action to perform when the menu item is selected.\n     *\n     * If you return `false` from this function, the menu will not auto-close when this menu item\n     * is selected. Though you should use `hideOnSelect` for this purpose, this allows you to\n     * achieve the same effect conditionally and dynamically deciding at run time.\n     */\n    onSelect?: () => unknown\n    /**\n     * The event handler called when the menu item is clicked.\n     *\n     * This is similar to `onSelect`, but a bit different. You can certainly use it to trigger the\n     * action that the menu item represents. But in general you should prefer `onSelect` for that.\n     *\n     * The main use for this handler is to get access to the click event. This can be used, for\n     * example, to call `event.preventDefault()`, which will effectively prevent the rest of the\n     * consequences of the click, including preventing `onSelect` from being called. In particular,\n     * this is useful in menu items that are links, and you want the click to not trigger navigation\n     * under some circumstances.\n     */\n    onClick?: (event: React.MouseEvent) => void\n}\n\n/**\n * A menu item inside a menu list. It can be selected by the user, triggering the `onSelect`\n * callback.\n */\nconst MenuItem = polymorphicComponent<'button', MenuItemProps>(function MenuItem(\n    {\n        value,\n        children,\n        onSelect,\n        hideOnSelect = true,\n        onClick,\n        exceptionallySetClassName,\n        ...props\n    },\n    ref,\n) {\n    const { handleItemSelect, ...state } = React.useContext(MenuContext)\n    const { hide } = state\n\n    const handleClick = React.useCallback(\n        function handleClick(event: React.MouseEvent<HTMLButtonElement>) {\n            onClick?.(event)\n            const onSelectResult: unknown =\n                onSelect && !event.defaultPrevented ? onSelect() : undefined\n            const shouldClose = onSelectResult !== false && hideOnSelect\n            handleItemSelect(value)\n            if (shouldClose) hide()\n        },\n        [onSelect, onClick, handleItemSelect, hideOnSelect, hide, value],\n    )\n\n    return (\n        <Reakit.MenuItem\n            {...props}\n            {...state}\n            ref={ref}\n            onClick={handleClick}\n            className={exceptionallySetClassName}\n        >\n            {children}\n        </Reakit.MenuItem>\n    )\n})\n\n//\n// SubMenu\n//\n\ntype SubMenuProps = Pick<MenuProps, 'children' | 'onItemSelect'>\n\n/**\n * This component can be rendered alongside other `MenuItem` inside a `MenuList` in order to have\n * a sub-menu.\n *\n * Its children are expected to have the structure of a first level menu (a `MenuButton` and a\n * `MenuList`).\n *\n * ```jsx\n * <MenuItem label=\"Edit profile\" />\n * <SubMenu>\n *   <MenuButton>More options</MenuButton>\n *   <MenuList>\n *     <MenuItem label=\"Preferences\" />\n *     <MenuItem label=\"Sign out\" />\n *   </MenuList>\n * </SubMenu>\n * ```\n *\n * The `MenuButton` will become a menu item in the current menu items list, and it will lead to\n * opening a sub-menu with the menu items list below it.\n */\nconst SubMenu = React.forwardRef<HTMLButtonElement, SubMenuProps>(function SubMenu(\n    { children, onItemSelect, ...props },\n    ref,\n) {\n    const { handleItemSelect: parentMenuItemSelect, ...state } = React.useContext(MenuContext)\n    const { hide: parentMenuHide } = state\n\n    const handleSubItemSelect = React.useCallback(\n        function handleSubItemSelect(value) {\n            if (onItemSelect) onItemSelect(value)\n            parentMenuItemSelect(value)\n            parentMenuHide()\n        },\n        [parentMenuHide, parentMenuItemSelect, onItemSelect],\n    )\n\n    const [button, list] = React.Children.toArray(children)\n\n    return (\n        <Reakit.MenuItem {...state} {...props} ref={ref}>\n            {(buttonProps) => (\n                <Menu onItemSelect={handleSubItemSelect}>\n                    {React.cloneElement(button as React.ReactElement, {\n                        ...buttonProps,\n                        className: classNames(buttonProps.className, 'reactist_submenu_button'),\n                    })}\n                    {list}\n                </Menu>\n            )}\n        </Reakit.MenuItem>\n    )\n})\n\n//\n// MenuGroup\n//\n\ntype MenuGroupProps = Omit<NativeProps<HTMLDivElement>, 'className'> & {\n    /**\n     * A label to be shown visually and also used to semantically label the group.\n     */\n    label: string\n}\n\n/**\n * A way to semantically group some menu items.\n *\n * This group does not add any visual separator. You can do that yourself adding `<hr />` elements\n * before and/or after the group if you so wish.\n */\nconst MenuGroup = polymorphicComponent<'div', MenuGroupProps>(function MenuGroud(\n    { label, children, exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { handleItemSelect, ...state } = React.useContext(MenuContext)\n    return (\n        <Reakit.MenuGroup ref={ref} {...props} {...state} className={exceptionallySetClassName}>\n            {label ? (\n                <div role=\"presentation\" className=\"reactist_menugroup__label\">\n                    {label}\n                </div>\n            ) : null}\n            {children}\n        </Reakit.MenuGroup>\n    )\n})\n\nexport { Menu, MenuButton, MenuList, MenuItem, SubMenu, MenuGroup }\nexport type { MenuButtonProps, MenuListProps, MenuItemProps, SubMenuProps, MenuGroupProps }\n"],"names":["MenuContext","React","Menu","children","onItemSelect","props","state","Reakit","loop","handleItemSelect","value","Provider","MenuButton","polymorphicComponent","ref","exceptionallySetClassName","className","classNames","BACKDROP_STYLE","width","height","position","top","left","MenuBackdrop","baseId","visible","animated","animating","stopAnimation","modal","PopoverBackdrop","style","MenuList","MenuItem","onSelect","hideOnSelect","onClick","hide","handleClick","event","onSelectResult","defaultPrevented","undefined","shouldClose","SubMenu","parentMenuItemSelect","parentMenuHide","handleSubItemSelect","toArray","button","list","buttonProps","MenuGroup","MenuGroud","label","role"],"mappings":"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"}

package/es/new-components/base-button/base-button.js

@@ -2,6 +2,7 @@ import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '.
 import { createElement, Fragment } from 'react';
 import { polymorphicComponent } from '../../utils/polymorphism.js';
 import { Box } from '../box/box.js';
+import { Spinner } from '../spinner/spinner.js';
 import { Tooltip } from '../../components/tooltip/tooltip.js';
 import styles from './base-button.module.css.js';
 
@@ -29,6 +30,8 @@ var BaseButton = /*#__PURE__*/polymorphicComponent(function BaseButton(_ref, ref
       size = _ref$size === void 0 ? 'normal' : _ref$size,
       _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      _ref$loading = _ref.loading,
+      loading = _ref$loading === void 0 ? false : _ref$loading,
       tooltip = _ref.tooltip,
       onClick = _ref.onClick,
       exceptionallySetClassName = _ref.exceptionallySetClassName,
@@ -36,23 +39,26 @@ var BaseButton = /*#__PURE__*/polymorphicComponent(function BaseButton(_ref, ref
       startIcon = _ref.startIcon,
       endIcon = _ref.endIcon,
       icon = _ref.icon,
-      props = _objectWithoutPropertiesLoose(_ref, ["as", "variant", "tone", "size", "disabled", "tooltip", "onClick", "exceptionallySetClassName", "children", "startIcon", "endIcon", "icon"]);
+      props = _objectWithoutPropertiesLoose(_ref, ["as", "variant", "tone", "size", "disabled", "loading", "tooltip", "onClick", "exceptionallySetClassName", "children", "startIcon", "endIcon", "icon"]);
 
+  var isDisabled = loading || disabled;
   var buttonElement = /*#__PURE__*/createElement(Box, Object.assign({}, props, {
     as: as,
     ref: ref,
-    "aria-disabled": disabled,
-    onClick: disabled ? preventDefault : onClick,
-    className: [exceptionallySetClassName, styles.baseButton, styles["variant-" + variant], styles["tone-" + tone], styles["size-" + size], icon ? styles.iconButton : null]
-  }), icon !== null && icon !== void 0 ? icon : /*#__PURE__*/createElement(Fragment, null, startIcon ? /*#__PURE__*/createElement(Box, {
+    "aria-disabled": isDisabled,
+    onClick: isDisabled ? preventDefault : onClick,
+    className: [exceptionallySetClassName, styles.baseButton, styles["variant-" + variant], styles["tone-" + tone], styles["size-" + size], icon ? styles.iconButton : null, disabled ? styles.disabled : null]
+  }), icon ? loading && /*#__PURE__*/createElement(Spinner, null) || icon : /*#__PURE__*/createElement(Fragment, null, startIcon ? /*#__PURE__*/createElement(Box, {
     display: "flex",
     className: styles.startIcon,
     "aria-hidden": true
-  }, startIcon) : null, children ? /*#__PURE__*/createElement("span", null, children) : null, endIcon ? /*#__PURE__*/createElement(Box, {
+  }, loading && !endIcon ? /*#__PURE__*/createElement(Spinner, null) : startIcon) : null, children ? /*#__PURE__*/createElement("span", {
+    className: styles.label
+  }, children) : null, endIcon || loading && !startIcon ? /*#__PURE__*/createElement(Box, {
     display: "flex",
     className: styles.endIcon,
     "aria-hidden": true
-  }, endIcon) : null)); // If it's an icon-only button, make sure it uses the aria-label as tooltip if no tooltip was provided
+  }, loading ? /*#__PURE__*/createElement(Spinner, null) : endIcon) : null)); // If it's an icon-only button, make sure it uses the aria-label as tooltip if no tooltip was provided
 
   var tooltipContent = icon ? tooltip !== null && tooltip !== void 0 ? tooltip : props['aria-label'] : tooltip;
   return tooltipContent ? /*#__PURE__*/createElement(Tooltip, {

package/es/new-components/base-button/base-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"base-button.js","sources":["../../../src/new-components/base-button/base-button.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Tooltip, TooltipProps } from '../../components/tooltip'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport { Box } from '../box'\nimport styles from './base-button.module.css'\n\nfunction preventDefault(event: React.SyntheticEvent) {\n    event.preventDefault()\n}\n\ntype ButtonVariant = 'primary' | 'secondary' | 'tertiary' | 'quaternary'\ntype ButtonTone = 'normal' | 'destructive'\ntype ButtonSize = 'small' | 'normal' | 'large'\ntype IconElement = React.ReactChild\n\ntype CommonProps = {\n    /**\n     * The button's variant.\n     */\n    variant: ButtonVariant\n    /**\n     * The button's tone.\n     * @default 'normal'\n     */\n    tone?: ButtonTone\n    /**\n     * The button's size.\n     * @default 'normal'\n     */\n    size?: ButtonSize\n    /**\n     * @default false\n     */\n    disabled?: boolean\n    /**\n     * A tooltip linked to the button element.\n     */\n    tooltip?: TooltipProps['content']\n}\n\ntype IconButtonProps = {\n    icon: IconElement\n    'aria-label': string\n    children?: never\n    startIcon?: never\n    endIcon?: never\n}\n\ntype LabelledButtonProps = {\n    children: NonNullable<React.ReactNode>\n    startIcon?: IconElement\n    endIcon?: IconElement\n    icon?: never\n}\n\ntype BaseButtonProps = CommonProps & (IconButtonProps | LabelledButtonProps)\n\n/**\n * The component that powers `Button` and `ButtonLink`, where the button styling logic and some\n * common functionality resides. This component is internal to Reactist.\n *\n * 🎨 [Figma](https://www.figma.com/file/LYlWNzvhMDh907l07mPPQk/Product-Web?node-id=4693%3A175143)\n *\n * @see Button\n * @see ButtonLink\n */\nconst BaseButton = polymorphicComponent<'div', BaseButtonProps>(function BaseButton(\n    {\n        as = 'div',\n        variant,\n        tone = 'normal',\n        size = 'normal',\n        disabled = false,\n        tooltip,\n        onClick,\n        exceptionallySetClassName,\n        children,\n        startIcon,\n        endIcon,\n        icon,\n        ...props\n    },\n    ref,\n) {\n    const buttonElement = (\n        <Box\n            {...props}\n            as={as}\n            ref={ref}\n            aria-disabled={disabled}\n            onClick={disabled ? preventDefault : onClick}\n            className={[\n                exceptionallySetClassName,\n                styles.baseButton,\n                styles[`variant-${variant}`],\n                styles[`tone-${tone}`],\n                styles[`size-${size}`],\n                icon ? styles.iconButton : null,\n            ]}\n        >\n            {icon ?? (\n                <>\n                    {startIcon ? (\n                        <Box display=\"flex\" className={styles.startIcon} aria-hidden>\n                            {startIcon}\n                        </Box>\n                    ) : null}\n                    {children ? <span>{children}</span> : null}\n                    {endIcon ? (\n                        <Box display=\"flex\" className={styles.endIcon} aria-hidden>\n                            {endIcon}\n                        </Box>\n                    ) : null}\n                </>\n            )}\n        </Box>\n    )\n\n    // If it's an icon-only button, make sure it uses the aria-label as tooltip if no tooltip was provided\n    const tooltipContent = icon ? tooltip ?? props['aria-label'] : tooltip\n    return tooltipContent ? (\n        <Tooltip content={tooltipContent}>{buttonElement}</Tooltip>\n    ) : (\n        buttonElement\n    )\n})\n\nexport { BaseButton }\nexport type { BaseButtonProps }\n"],"names":["preventDefault","event","BaseButton","polymorphicComponent","ref","as","variant","tone","size","disabled","tooltip","onClick","exceptionallySetClassName","children","startIcon","endIcon","icon","props","buttonElement","React","Box","className","styles","baseButton","iconButton","display","tooltipContent","Tooltip","content"],"mappings":";;;;;;;AAMA,SAASA,cAAT,CAAwBC,KAAxB;AACIA,EAAAA,KAAK,CAACD,cAAN;AACH;AAiDD;;;;;;;;;;;IASME,UAAU,gBAAGC,oBAAoB,CAAyB,SAASD,UAAT,OAgB5DE,GAhB4D;qBAExDC;MAAAA,0BAAK;MACLC,eAAAA;uBACAC;MAAAA,8BAAO;uBACPC;MAAAA,8BAAO;2BACPC;MAAAA,sCAAW;MACXC,eAAAA;MACAC,eAAAA;MACAC,iCAAAA;MACAC,gBAAAA;MACAC,iBAAAA;MACAC,eAAAA;MACAC,YAAAA;MACGC;;AAIP,MAAMC,aAAa,gBACfC,aAAA,CAACC,GAAD,oBACQH;AACJZ,IAAAA,EAAE,EAAEA;AACJD,IAAAA,GAAG,EAAEA;qBACUK;AACfE,IAAAA,OAAO,EAAEF,QAAQ,GAAGT,cAAH,GAAoBW;AACrCU,IAAAA,SAAS,EAAE,CACPT,yBADO,EAEPU,MAAM,CAACC,UAFA,EAGPD,MAAM,cAAYhB,OAAZ,CAHC,EAIPgB,MAAM,WAASf,IAAT,CAJC,EAKPe,MAAM,WAASd,IAAT,CALC,EAMPQ,IAAI,GAAGM,MAAM,CAACE,UAAV,GAAuB,IANpB;IANf,EAeKR,IAfL,aAeKA,IAfL,cAeKA,IAfL,gBAgBQG,aAAA,SAAA,MAAA,EACKL,SAAS,gBACNK,aAAA,CAACC,GAAD;AAAKK,IAAAA,OAAO,EAAC;AAAOJ,IAAAA,SAAS,EAAEC,MAAM,CAACR;;GAAtC,EACKA,SADL,CADM,GAIN,IALR,EAMKD,QAAQ,gBAAGM,aAAA,OAAA,MAAA,EAAON,QAAP,CAAH,GAA6B,IAN1C,EAOKE,OAAO,gBACJI,aAAA,CAACC,GAAD;AAAKK,IAAAA,OAAO,EAAC;AAAOJ,IAAAA,SAAS,EAAEC,MAAM,CAACP;;GAAtC,EACKA,OADL,CADI,GAIJ,IAXR,CAhBR,CADJ;;AAmCA,MAAMW,cAAc,GAAGV,IAAI,GAAGN,OAAH,aAAGA,OAAH,cAAGA,OAAH,GAAcO,KAAK,CAAC,YAAD,CAAnB,GAAoCP,OAA/D;AACA,SAAOgB,cAAc,gBACjBP,aAAA,CAACQ,OAAD;AAASC,IAAAA,OAAO,EAAEF;GAAlB,EAAmCR,aAAnC,CADiB,GAGjBA,aAHJ;AAKH,CA3DsC;;;;"}
+{"version":3,"file":"base-button.js","sources":["../../../src/new-components/base-button/base-button.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Tooltip, TooltipProps } from '../../components/tooltip'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport { Box } from '../box'\nimport { Spinner } from '../spinner'\nimport styles from './base-button.module.css'\n\nfunction preventDefault(event: React.SyntheticEvent) {\n    event.preventDefault()\n}\n\ntype ButtonVariant = 'primary' | 'secondary' | 'tertiary' | 'quaternary'\ntype ButtonTone = 'normal' | 'destructive'\ntype ButtonSize = 'small' | 'normal' | 'large'\ntype IconElement = React.ReactChild\n\ntype CommonProps = {\n    /**\n     * The button's variant.\n     */\n    variant: ButtonVariant\n    /**\n     * The button's tone.\n     * @default 'normal'\n     */\n    tone?: ButtonTone\n    /**\n     * The button's size.\n     * @default 'normal'\n     */\n    size?: ButtonSize\n    /**\n     * Whether the button is disabled or not.\n     * @default false\n     */\n    disabled?: boolean\n    /**\n     * Whether the button is busy/loading.\n     *\n     * A button in this state is functionally and semantically disabled. Visually is does not look\n     * dimmed (as disabled buttons normally do), but it shows a loading spinner instead.\n     *\n     * @default false\n     */\n    loading?: boolean\n    /**\n     * A tooltip linked to the button element.\n     */\n    tooltip?: TooltipProps['content']\n}\n\ntype IconButtonProps = {\n    icon: IconElement\n    'aria-label': string\n    children?: never\n    startIcon?: never\n    endIcon?: never\n}\n\ntype LabelledButtonProps = {\n    children: NonNullable<React.ReactNode>\n    startIcon?: IconElement\n    endIcon?: IconElement\n    icon?: never\n}\n\nexport type BaseButtonProps = CommonProps & (IconButtonProps | LabelledButtonProps)\n\n/**\n * The component that powers `Button` and `ButtonLink`, where the button styling logic and some\n * common functionality resides. This component is internal to Reactist.\n *\n * 🎨 [Figma](https://www.figma.com/file/LYlWNzvhMDh907l07mPPQk/Product-Web?node-id=4693%3A175143)\n *\n * @see Button\n * @see ButtonLink\n */\nexport const BaseButton = polymorphicComponent<'div', BaseButtonProps>(function BaseButton(\n    {\n        as = 'div',\n        variant,\n        tone = 'normal',\n        size = 'normal',\n        disabled = false,\n        loading = false,\n        tooltip,\n        onClick,\n        exceptionallySetClassName,\n        children,\n        startIcon,\n        endIcon,\n        icon,\n        ...props\n    },\n    ref,\n) {\n    const isDisabled = loading || disabled\n    const buttonElement = (\n        <Box\n            {...props}\n            as={as}\n            ref={ref}\n            aria-disabled={isDisabled}\n            onClick={isDisabled ? preventDefault : onClick}\n            className={[\n                exceptionallySetClassName,\n                styles.baseButton,\n                styles[`variant-${variant}`],\n                styles[`tone-${tone}`],\n                styles[`size-${size}`],\n                icon ? styles.iconButton : null,\n                disabled ? styles.disabled : null,\n            ]}\n        >\n            {icon ? (\n                (loading && <Spinner />) || icon\n            ) : (\n                <>\n                    {startIcon ? (\n                        <Box display=\"flex\" className={styles.startIcon} aria-hidden>\n                            {loading && !endIcon ? <Spinner /> : startIcon}\n                        </Box>\n                    ) : null}\n                    {children ? <span className={styles.label}>{children}</span> : null}\n                    {endIcon || (loading && !startIcon) ? (\n                        <Box display=\"flex\" className={styles.endIcon} aria-hidden>\n                            {loading ? <Spinner /> : endIcon}\n                        </Box>\n                    ) : null}\n                </>\n            )}\n        </Box>\n    )\n\n    // If it's an icon-only button, make sure it uses the aria-label as tooltip if no tooltip was provided\n    const tooltipContent = icon ? tooltip ?? props['aria-label'] : tooltip\n    return tooltipContent ? (\n        <Tooltip content={tooltipContent}>{buttonElement}</Tooltip>\n    ) : (\n        buttonElement\n    )\n})\n"],"names":["preventDefault","event","BaseButton","polymorphicComponent","ref","as","variant","tone","size","disabled","loading","tooltip","onClick","exceptionallySetClassName","children","startIcon","endIcon","icon","props","isDisabled","buttonElement","React","Box","className","styles","baseButton","iconButton","Spinner","display","label","tooltipContent","Tooltip","content"],"mappings":";;;;;;;;AAOA,SAASA,cAAT,CAAwBC,KAAxB;AACIA,EAAAA,KAAK,CAACD,cAAN;AACH;AA2DD;;;;;;;;;;;IASaE,UAAU,gBAAGC,oBAAoB,CAAyB,SAASD,UAAT,OAiBnEE,GAjBmE;qBAE/DC;MAAAA,0BAAK;MACLC,eAAAA;uBACAC;MAAAA,8BAAO;uBACPC;MAAAA,8BAAO;2BACPC;MAAAA,sCAAW;0BACXC;MAAAA,oCAAU;MACVC,eAAAA;MACAC,eAAAA;MACAC,iCAAAA;MACAC,gBAAAA;MACAC,iBAAAA;MACAC,eAAAA;MACAC,YAAAA;MACGC;;AAIP,MAAMC,UAAU,GAAGT,OAAO,IAAID,QAA9B;AACA,MAAMW,aAAa,gBACfC,aAAA,CAACC,GAAD,oBACQJ;AACJb,IAAAA,EAAE,EAAEA;AACJD,IAAAA,GAAG,EAAEA;qBACUe;AACfP,IAAAA,OAAO,EAAEO,UAAU,GAAGnB,cAAH,GAAoBY;AACvCW,IAAAA,SAAS,EAAE,CACPV,yBADO,EAEPW,MAAM,CAACC,UAFA,EAGPD,MAAM,cAAYlB,OAAZ,CAHC,EAIPkB,MAAM,WAASjB,IAAT,CAJC,EAKPiB,MAAM,WAAShB,IAAT,CALC,EAMPS,IAAI,GAAGO,MAAM,CAACE,UAAV,GAAuB,IANpB,EAOPjB,QAAQ,GAAGe,MAAM,CAACf,QAAV,GAAqB,IAPtB;IANf,EAgBKQ,IAAI,GACAP,OAAO,iBAAIW,aAAA,CAACM,OAAD,MAAA,CAAZ,IAA4BV,IAD3B,gBAGDI,aAAA,SAAA,MAAA,EACKN,SAAS,gBACNM,aAAA,CAACC,GAAD;AAAKM,IAAAA,OAAO,EAAC;AAAOL,IAAAA,SAAS,EAAEC,MAAM,CAACT;;GAAtC,EACKL,OAAO,IAAI,CAACM,OAAZ,gBAAsBK,aAAA,CAACM,OAAD,MAAA,CAAtB,GAAoCZ,SADzC,CADM,GAIN,IALR,EAMKD,QAAQ,gBAAGO,aAAA,OAAA;AAAME,IAAAA,SAAS,EAAEC,MAAM,CAACK;GAAxB,EAAgCf,QAAhC,CAAH,GAAsD,IANnE,EAOKE,OAAO,IAAKN,OAAO,IAAI,CAACK,SAAxB,gBACGM,aAAA,CAACC,GAAD;AAAKM,IAAAA,OAAO,EAAC;AAAOL,IAAAA,SAAS,EAAEC,MAAM,CAACR;;GAAtC,EACKN,OAAO,gBAAGW,aAAA,CAACM,OAAD,MAAA,CAAH,GAAiBX,OAD7B,CADH,GAIG,IAXR,CAnBR,CADJ;;AAsCA,MAAMc,cAAc,GAAGb,IAAI,GAAGN,OAAH,aAAGA,OAAH,cAAGA,OAAH,GAAcO,KAAK,CAAC,YAAD,CAAnB,GAAoCP,OAA/D;AACA,SAAOmB,cAAc,gBACjBT,aAAA,CAACU,OAAD;AAASC,IAAAA,OAAO,EAAEF;GAAlB,EAAmCV,aAAnC,CADiB,GAGjBA,aAHJ;AAKH,CAhE6C;;;;"}

package/es/new-components/base-button/base-button.module.css.js

@@ -1,4 +1,4 @@
-var modules_b9569bce = {"baseButton":"_87170772","size-small":"d9f9fdf7","size-large":"_4dee42b4","iconButton":"_5f5bd879","startIcon":"b822f783","endIcon":"_77e64a49","variant-primary":"_769efd56","variant-secondary":"_1b1f9418","variant-tertiary":"b9267ccc","variant-quaternary":"_19687b17","tone-destructive":"_67b5f87d"};
+var modules_b9569bce = {"label":"_1f20c88a","baseButton":"_623015f3","size-small":"_062de645","size-normal":"_55e2a6a9","size-large":"cab32a7c","disabled":"e71c191a","iconButton":"_368efc16","startIcon":"d35389c1","endIcon":"_900d41d8","variant-primary":"_7c95e162","variant-secondary":"_9cb889aa","variant-tertiary":"_611b5b28","variant-quaternary":"_80c2bb84","tone-destructive":"ee13c455"};
 
 export default modules_b9569bce;
 //# sourceMappingURL=base-button.module.css.js.map

package/es/new-components/box/box.js.map

@@ -1 +1 @@
-{"version":3,"file":"box.js","sources":["../../../src/new-components/box/box.tsx"],"sourcesContent":["import * as React from 'react'\nimport classNames from 'classnames'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport { getClassNames } from '../responsive-props'\n\nimport type { ResponsiveProp } from '../responsive-props'\nimport type { Space, SpaceWithNegatives, WithEnhancedClassName } from '../common-types'\n\nimport styles from './box.module.css'\nimport paddingStyles from './padding.module.css'\nimport marginStyles from './margin.module.css'\n\ninterface BoxPaddingProps {\n    padding?: ResponsiveProp<Space>\n    paddingX?: ResponsiveProp<Space>\n    paddingY?: ResponsiveProp<Space>\n    paddingTop?: ResponsiveProp<Space>\n    paddingRight?: ResponsiveProp<Space>\n    paddingBottom?: ResponsiveProp<Space>\n    paddingLeft?: ResponsiveProp<Space>\n}\n\ninterface BoxMarginProps {\n    margin?: ResponsiveProp<SpaceWithNegatives>\n    marginX?: ResponsiveProp<SpaceWithNegatives>\n    marginY?: ResponsiveProp<SpaceWithNegatives>\n    marginTop?: ResponsiveProp<SpaceWithNegatives>\n    marginRight?: ResponsiveProp<SpaceWithNegatives>\n    marginBottom?: ResponsiveProp<SpaceWithNegatives>\n    marginLeft?: ResponsiveProp<SpaceWithNegatives>\n}\n\ntype BoxMaxMinWidth = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge'\ntype BoxDisplay = 'block' | 'flex' | 'inline' | 'inlineBlock' | 'inlineFlex' | 'none'\ntype BoxFlexDirection = 'column' | 'row'\ntype BoxFlexWrap = 'nowrap' | 'wrap'\ntype BoxAlignItems = 'center' | 'flexEnd' | 'flexStart' | 'baseline'\ntype BoxJustifyContent =\n    | 'center'\n    | 'flexEnd'\n    | 'flexStart'\n    | 'spaceAround'\n    | 'spaceBetween'\n    | 'spaceEvenly'\ntype BoxOverflow = 'hidden' | 'auto' | 'visible' | 'scroll'\n\ninterface BorderProps {\n    borderRadius?: 'standard' | 'none' | 'full'\n    border?: 'standard' | 'none' // to be extended with more options\n}\n\ninterface ReusableBoxProps extends BorderProps, BoxPaddingProps {\n    minWidth?: 0 | BoxMaxMinWidth\n    maxWidth?: BoxMaxMinWidth | 'full'\n    background?: 'default' | 'aside' | 'highlight' | 'selected'\n    flexGrow?: 0 | 1\n    flexShrink?: 0\n    width?: 'full'\n    height?: 'full'\n}\n\ntype BoxPosition = 'absolute' | 'fixed' | 'relative' | 'static' | 'sticky'\n\ninterface BoxProps extends WithEnhancedClassName, ReusableBoxProps, BoxMarginProps {\n    position?: ResponsiveProp<BoxPosition>\n    display?: ResponsiveProp<BoxDisplay>\n    flexDirection?: ResponsiveProp<BoxFlexDirection>\n    flexWrap?: BoxFlexWrap\n    alignItems?: ResponsiveProp<BoxAlignItems>\n    justifyContent?: ResponsiveProp<BoxJustifyContent>\n    overflow?: BoxOverflow\n    width?: 'full'\n    height?: 'full'\n    textAlign?: ResponsiveProp<'start' | 'center' | 'end' | 'justify'>\n}\n\nconst Box = polymorphicComponent<'div', BoxProps, 'keepClassName'>(function Box(\n    {\n        as: component = 'div',\n        position = 'static',\n        display,\n        flexDirection = 'row',\n        flexWrap,\n        flexGrow,\n        flexShrink,\n        alignItems,\n        justifyContent,\n        overflow,\n        width,\n        height,\n        background,\n        border,\n        borderRadius,\n        minWidth,\n        maxWidth,\n        textAlign = 'start',\n        padding,\n        paddingY,\n        paddingX,\n        paddingTop,\n        paddingRight,\n        paddingBottom,\n        paddingLeft,\n        margin,\n        marginY,\n        marginX,\n        marginTop,\n        marginRight,\n        marginBottom,\n        marginLeft,\n        className,\n        children,\n        ...props\n    },\n    ref,\n) {\n    const resolvedPaddingTop = paddingTop ?? paddingY ?? padding\n    const resolvedPaddingRight = paddingRight ?? paddingX ?? padding\n    const resolvedPaddingBottom = paddingBottom ?? paddingY ?? padding\n    const resolvedPaddingLeft = paddingLeft ?? paddingX ?? padding\n\n    const resolvedMarginTop = marginTop ?? marginY ?? margin\n    const resolvedMarginRight = marginRight ?? marginX ?? margin\n    const resolvedMarginBottom = marginBottom ?? marginY ?? margin\n    const resolvedMarginLeft = marginLeft ?? marginX ?? margin\n\n    const omitFlex =\n        !display || (typeof display === 'string' && display !== 'flex' && display !== 'inlineFlex')\n\n    return React.createElement(\n        component,\n        {\n            ...props,\n            className:\n                classNames(\n                    className,\n                    styles.box,\n                    display ? getClassNames(styles, 'display', display) : null,\n                    position !== 'static' ? getClassNames(styles, 'position', position) : null,\n                    minWidth != null ? getClassNames(styles, 'minWidth', String(minWidth)) : null,\n                    getClassNames(styles, 'maxWidth', maxWidth),\n                    textAlign !== 'start' ? getClassNames(styles, 'textAlign', textAlign) : null,\n                    // padding\n                    getClassNames(paddingStyles, 'paddingTop', resolvedPaddingTop),\n                    getClassNames(paddingStyles, 'paddingRight', resolvedPaddingRight),\n                    getClassNames(paddingStyles, 'paddingBottom', resolvedPaddingBottom),\n                    getClassNames(paddingStyles, 'paddingLeft', resolvedPaddingLeft),\n                    // margin\n                    getClassNames(marginStyles, 'marginTop', resolvedMarginTop),\n                    getClassNames(marginStyles, 'marginRight', resolvedMarginRight),\n                    getClassNames(marginStyles, 'marginBottom', resolvedMarginBottom),\n                    getClassNames(marginStyles, 'marginLeft', resolvedMarginLeft),\n                    // flex props\n                    omitFlex ? null : getClassNames(styles, 'flexDirection', flexDirection),\n                    omitFlex ? null : getClassNames(styles, 'flexWrap', flexWrap),\n                    omitFlex ? null : getClassNames(styles, 'alignItems', alignItems),\n                    omitFlex ? null : getClassNames(styles, 'justifyContent', justifyContent),\n                    flexShrink != null\n                        ? getClassNames(styles, 'flexShrink', String(flexShrink))\n                        : null,\n                    flexGrow != null ? getClassNames(styles, 'flexGrow', String(flexGrow)) : null,\n                    // other props\n                    getClassNames(styles, 'overflow', overflow),\n                    getClassNames(styles, 'width', width),\n                    getClassNames(styles, 'height', height),\n                    getClassNames(styles, 'bg', background),\n                    borderRadius !== 'none'\n                        ? getClassNames(styles, 'borderRadius', borderRadius)\n                        : null,\n                    border !== 'none' ? getClassNames(styles, 'border', border) : null,\n                ) || undefined,\n            ref,\n        },\n        children,\n    )\n})\n\nexport type {\n    BoxProps,\n    BoxPaddingProps,\n    BoxMarginProps,\n    ReusableBoxProps,\n    BoxMaxMinWidth,\n    BoxDisplay,\n    BoxPosition,\n    BoxFlexDirection,\n    BoxFlexWrap,\n    BoxAlignItems,\n    BoxJustifyContent,\n    BoxOverflow,\n}\n\nexport { Box }\n"],"names":["Box","polymorphicComponent","ref","as","component","position","display","flexDirection","flexWrap","flexGrow","flexShrink","alignItems","justifyContent","overflow","width","height","background","border","borderRadius","minWidth","maxWidth","textAlign","padding","paddingY","paddingX","paddingTop","paddingRight","paddingBottom","paddingLeft","margin","marginY","marginX","marginTop","marginRight","marginBottom","marginLeft","className","children","props","resolvedPaddingTop","resolvedPaddingRight","resolvedPaddingBottom","resolvedPaddingLeft","resolvedMarginTop","resolvedMarginRight","resolvedMarginBottom","resolvedMarginLeft","omitFlex","React","classNames","styles","box","getClassNames","String","paddingStyles","marginStyles","undefined"],"mappings":"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"}
+{"version":3,"file":"box.js","sources":["../../../src/new-components/box/box.tsx"],"sourcesContent":["import * as React from 'react'\nimport classNames from 'classnames'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport { getClassNames } from '../responsive-props'\n\nimport type { ResponsiveProp } from '../responsive-props'\nimport type {\n    DividerWeight,\n    Space,\n    SpaceWithNegatives,\n    WithEnhancedClassName,\n} from '../common-types'\n\nimport styles from './box.module.css'\nimport paddingStyles from './padding.module.css'\nimport marginStyles from './margin.module.css'\n\ninterface BoxPaddingProps {\n    padding?: ResponsiveProp<Space>\n    paddingX?: ResponsiveProp<Space>\n    paddingY?: ResponsiveProp<Space>\n    paddingTop?: ResponsiveProp<Space>\n    paddingRight?: ResponsiveProp<Space>\n    paddingBottom?: ResponsiveProp<Space>\n    paddingLeft?: ResponsiveProp<Space>\n}\n\ninterface BoxMarginProps {\n    margin?: ResponsiveProp<SpaceWithNegatives>\n    marginX?: ResponsiveProp<SpaceWithNegatives>\n    marginY?: ResponsiveProp<SpaceWithNegatives>\n    marginTop?: ResponsiveProp<SpaceWithNegatives>\n    marginRight?: ResponsiveProp<SpaceWithNegatives>\n    marginBottom?: ResponsiveProp<SpaceWithNegatives>\n    marginLeft?: ResponsiveProp<SpaceWithNegatives>\n}\n\ntype BoxMaxMinWidth = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge'\ntype BoxDisplay = 'block' | 'flex' | 'inline' | 'inlineBlock' | 'inlineFlex' | 'none'\ntype BoxFlexDirection = 'column' | 'row'\ntype BoxFlexWrap = 'nowrap' | 'wrap'\ntype BoxAlignItems = 'center' | 'flexEnd' | 'flexStart' | 'baseline'\ntype BoxJustifyContent =\n    | 'center'\n    | 'flexEnd'\n    | 'flexStart'\n    | 'spaceAround'\n    | 'spaceBetween'\n    | 'spaceEvenly'\ntype BoxOverflow = 'hidden' | 'auto' | 'visible' | 'scroll'\n\ninterface BorderProps {\n    borderRadius?: 'standard' | 'none' | 'full'\n    border?: DividerWeight\n}\n\ninterface ReusableBoxProps extends BorderProps, BoxPaddingProps {\n    minWidth?: 0 | BoxMaxMinWidth\n    maxWidth?: BoxMaxMinWidth | 'full'\n    background?: 'default' | 'aside' | 'highlight' | 'selected'\n    flexGrow?: 0 | 1\n    flexShrink?: 0\n    width?: 'full'\n    height?: 'full'\n}\n\ntype BoxPosition = 'absolute' | 'fixed' | 'relative' | 'static' | 'sticky'\n\ninterface BoxProps extends WithEnhancedClassName, ReusableBoxProps, BoxMarginProps {\n    position?: ResponsiveProp<BoxPosition>\n    display?: ResponsiveProp<BoxDisplay>\n    flexDirection?: ResponsiveProp<BoxFlexDirection>\n    flexWrap?: BoxFlexWrap\n    alignItems?: ResponsiveProp<BoxAlignItems>\n    justifyContent?: ResponsiveProp<BoxJustifyContent>\n    overflow?: BoxOverflow\n    width?: 'full'\n    height?: 'full'\n    textAlign?: ResponsiveProp<'start' | 'center' | 'end' | 'justify'>\n}\n\nconst Box = polymorphicComponent<'div', BoxProps, 'keepClassName'>(function Box(\n    {\n        as: component = 'div',\n        position = 'static',\n        display,\n        flexDirection = 'row',\n        flexWrap,\n        flexGrow,\n        flexShrink,\n        alignItems,\n        justifyContent,\n        overflow,\n        width,\n        height,\n        background,\n        border,\n        borderRadius,\n        minWidth,\n        maxWidth,\n        textAlign = 'start',\n        padding,\n        paddingY,\n        paddingX,\n        paddingTop,\n        paddingRight,\n        paddingBottom,\n        paddingLeft,\n        margin,\n        marginY,\n        marginX,\n        marginTop,\n        marginRight,\n        marginBottom,\n        marginLeft,\n        className,\n        children,\n        ...props\n    },\n    ref,\n) {\n    const resolvedPaddingTop = paddingTop ?? paddingY ?? padding\n    const resolvedPaddingRight = paddingRight ?? paddingX ?? padding\n    const resolvedPaddingBottom = paddingBottom ?? paddingY ?? padding\n    const resolvedPaddingLeft = paddingLeft ?? paddingX ?? padding\n\n    const resolvedMarginTop = marginTop ?? marginY ?? margin\n    const resolvedMarginRight = marginRight ?? marginX ?? margin\n    const resolvedMarginBottom = marginBottom ?? marginY ?? margin\n    const resolvedMarginLeft = marginLeft ?? marginX ?? margin\n\n    const omitFlex =\n        !display || (typeof display === 'string' && display !== 'flex' && display !== 'inlineFlex')\n\n    return React.createElement(\n        component,\n        {\n            ...props,\n            className:\n                classNames(\n                    className,\n                    styles.box,\n                    display ? getClassNames(styles, 'display', display) : null,\n                    position !== 'static' ? getClassNames(styles, 'position', position) : null,\n                    minWidth != null ? getClassNames(styles, 'minWidth', String(minWidth)) : null,\n                    getClassNames(styles, 'maxWidth', maxWidth),\n                    textAlign !== 'start' ? getClassNames(styles, 'textAlign', textAlign) : null,\n                    // padding\n                    getClassNames(paddingStyles, 'paddingTop', resolvedPaddingTop),\n                    getClassNames(paddingStyles, 'paddingRight', resolvedPaddingRight),\n                    getClassNames(paddingStyles, 'paddingBottom', resolvedPaddingBottom),\n                    getClassNames(paddingStyles, 'paddingLeft', resolvedPaddingLeft),\n                    // margin\n                    getClassNames(marginStyles, 'marginTop', resolvedMarginTop),\n                    getClassNames(marginStyles, 'marginRight', resolvedMarginRight),\n                    getClassNames(marginStyles, 'marginBottom', resolvedMarginBottom),\n                    getClassNames(marginStyles, 'marginLeft', resolvedMarginLeft),\n                    // flex props\n                    omitFlex ? null : getClassNames(styles, 'flexDirection', flexDirection),\n                    omitFlex ? null : getClassNames(styles, 'flexWrap', flexWrap),\n                    omitFlex ? null : getClassNames(styles, 'alignItems', alignItems),\n                    omitFlex ? null : getClassNames(styles, 'justifyContent', justifyContent),\n                    flexShrink != null\n                        ? getClassNames(styles, 'flexShrink', String(flexShrink))\n                        : null,\n                    flexGrow != null ? getClassNames(styles, 'flexGrow', String(flexGrow)) : null,\n                    // other props\n                    getClassNames(styles, 'overflow', overflow),\n                    getClassNames(styles, 'width', width),\n                    getClassNames(styles, 'height', height),\n                    getClassNames(styles, 'bg', background),\n                    borderRadius !== 'none'\n                        ? getClassNames(styles, 'borderRadius', borderRadius)\n                        : null,\n                    border !== 'none' ? getClassNames(styles, 'border', border) : null,\n                ) || undefined,\n            ref,\n        },\n        children,\n    )\n})\n\nexport type {\n    BoxProps,\n    BoxPaddingProps,\n    BoxMarginProps,\n    ReusableBoxProps,\n    BoxMaxMinWidth,\n    BoxDisplay,\n    BoxPosition,\n    BoxFlexDirection,\n    BoxFlexWrap,\n    BoxAlignItems,\n    BoxJustifyContent,\n    BoxOverflow,\n}\n\nexport { Box }\n"],"names":["Box","polymorphicComponent","ref","as","component","position","display","flexDirection","flexWrap","flexGrow","flexShrink","alignItems","justifyContent","overflow","width","height","background","border","borderRadius","minWidth","maxWidth","textAlign","padding","paddingY","paddingX","paddingTop","paddingRight","paddingBottom","paddingLeft","margin","marginY","marginX","marginTop","marginRight","marginBottom","marginLeft","className","children","props","resolvedPaddingTop","resolvedPaddingRight","resolvedPaddingBottom","resolvedPaddingLeft","resolvedMarginTop","resolvedMarginRight","resolvedMarginBottom","resolvedMarginLeft","omitFlex","React","classNames","styles","box","getClassNames","String","paddingStyles","marginStyles","undefined"],"mappings":"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"}

package/es/new-components/box/box.module.css.js

@@ -1,4 +1,4 @@
-var modules_54d944f2 = {"box":"_3aac345d","position-absolute":"_5f5fbe05","position-fixed":"_2e1dcb18","position-relative":"_6b073eae","position-sticky":"ed69c0f9","tablet-position-absolute":"b895daa3","tablet-position-fixed":"_81f67db7","tablet-position-relative":"bf7d2da5","tablet-position-sticky":"e0ab99ed","desktop-position-absolute":"_5dade286","desktop-position-fixed":"_584d7ee7","desktop-position-relative":"c7f56545","desktop-position-sticky":"_70b5ef21","display-block":"_5bca176b","display-flex":"_32670f8f","display-inline":"_3f9cb619","display-inlineBlock":"a42dded2","display-inlineFlex":"_7a45d80c","display-none":"a469c553","tablet-display-block":"_8e5cf5df","tablet-display-flex":"_640f3795","tablet-display-inline":"f1a1c131","tablet-display-inlineBlock":"e9f55809","tablet-display-inlineFlex":"_9fd7bd31","tablet-display-none":"_389a387a","desktop-display-block":"_3e730e39","desktop-display-flex":"_8407ca0e","desktop-display-inline":"_596653e1","desktop-display-inlineBlock":"eb198bac","desktop-display-inlineFlex":"c89ef13b","desktop-display-none":"_868c554e","minWidth-0":"a6e042e3","minWidth-xsmall":"_9ce11446","minWidth-small":"_2db5e251","minWidth-medium":"ef281ffc","minWidth-large":"f938efbe","minWidth-xlarge":"f87c0f55","maxWidth-xsmall":"_873d4d51","maxWidth-small":"_400d4800","maxWidth-medium":"_94ecdffd","maxWidth-large":"f9eeefb5","maxWidth-xlarge":"_2253ed9a","maxWidth-full":"bde40dfb","flexDirection-column":"c45f6767","flexDirection-row":"c167e8da","tablet-flexDirection-column":"c0ca97a9","tablet-flexDirection-row":"_45ebc391","desktop-flexDirection-column":"dfd69d4d","desktop-flexDirection-row":"f3d06da6","flexWrap-wrap":"_7fb6a141","flexWrap-nowrap":"_30a701b3","flexShrink-0":"_24cf9746","flexGrow-0":"d2a4825d","flexGrow-1":"a2a05bbf","alignItems-flexStart":"_4ada17a4","alignItems-center":"c2c1d3b2","alignItems-flexEnd":"_259506f5","alignItems-baseline":"_3cb51936","tablet-alignItems-flexStart":"_86497cb0","tablet-alignItems-center":"_5a281eb4","tablet-alignItems-flexEnd":"d7c8f9b0","tablet-alignItems-baseline":"_9b92f4b7","desktop-alignItems-flexStart":"_4d2b7f03","desktop-alignItems-center":"_521b4677","desktop-alignItems-flexEnd":"_239714b3","desktop-alignItems-baseline":"_49fa952b","justifyContent-flexStart":"_84c5c8b7","justifyContent-center":"_84df2447","justifyContent-flexEnd":"_96a7db47","justifyContent-spaceAround":"e7ad8d72","justifyContent-spaceBetween":"e5a5ea05","justifyContent-spaceEvenly":"_08952f29","tablet-justifyContent-flexStart":"_69d750a7","tablet-justifyContent-center":"be616f82","tablet-justifyContent-flexEnd":"_4e22f886","tablet-justifyContent-spaceAround":"_9b848fa4","tablet-justifyContent-spaceBetween":"_346ba50f","tablet-justifyContent-spaceEvenly":"_8e101549","desktop-justifyContent-flexStart":"_3e1b3f62","desktop-justifyContent-center":"a285086c","desktop-justifyContent-flexEnd":"_32759d54","desktop-justifyContent-spaceBetween":"_543f6141","overflow-hidden":"d91c9bdf","overflow-auto":"_438cafe6","overflow-visible":"_9527349d","overflow-scroll":"a086ce42","width-full":"d32e2047","height-full":"_2d523b97","bg-default":"_581ad1ab","bg-aside":"a554f678","bg-highlight":"_2d74468c","bg-selected":"eb3848be","borderRadius-standard":"_14fe8bc8","borderRadius-full":"c1bf716d","border-standard":"f605be96","textAlign-start":"_083a10ea","textAlign-center":"_8c05b9dc","textAlign-end":"e9c0981c","textAlign-justify":"a21c651d","tablet-textAlign-start":"_62b208d9","tablet-textAlign-center":"_7198bfc5","tablet-textAlign-end":"_4156cdf8","tablet-textAlign-justify":"_5dce5b3b","desktop-textAlign-start":"_526ba24a","desktop-textAlign-center":"f98d87d4","desktop-textAlign-end":"_9679b54a","desktop-textAlign-justify":"_4b25a07f"};
+var modules_54d944f2 = {"box":"_26c5201d","position-absolute":"_77c3d8d1","position-fixed":"_37cb98fb","position-relative":"df16028f","position-sticky":"_4205abac","tablet-position-absolute":"d6993b5e","tablet-position-fixed":"a015e0f5","tablet-position-relative":"_236dd3b1","tablet-position-sticky":"b7ac4837","desktop-position-absolute":"fd93a726","desktop-position-fixed":"_49228edc","desktop-position-relative":"d972b518","desktop-position-sticky":"b2a2baf3","display-block":"_22f1edd1","display-flex":"c23d2d6f","display-inline":"_5359896d","display-inlineBlock":"a54a41a6","display-inlineFlex":"d02f3d43","display-none":"_760c0710","tablet-display-block":"_64e2ebe6","tablet-display-flex":"_25274f78","tablet-display-inline":"_2077d063","tablet-display-inlineBlock":"aaed581f","tablet-display-inlineFlex":"_1d4a6eb5","tablet-display-none":"_66f24c78","desktop-display-block":"_145cca89","desktop-display-flex":"_1861c899","desktop-display-inline":"_96a720c8","desktop-display-inlineBlock":"_56acf5d5","desktop-display-inlineFlex":"_2a268e4b","desktop-display-none":"b4f30b9e","minWidth-0":"_0b071847","minWidth-xsmall":"_8b67f007","minWidth-small":"e3ec3474","minWidth-medium":"_5cccd4fc","minWidth-large":"_06eeac65","minWidth-xlarge":"ee1b6344","maxWidth-xsmall":"_2df097d0","maxWidth-small":"b771df2a","maxWidth-medium":"_00ad4e35","maxWidth-large":"_4a848dab","maxWidth-xlarge":"bf216b15","maxWidth-full":"a60a7855","flexDirection-column":"_4cf1b6c9","flexDirection-row":"e056fa5a","tablet-flexDirection-column":"b9aa8d99","tablet-flexDirection-row":"_2e8b3442","desktop-flexDirection-column":"_2162c612","desktop-flexDirection-row":"_279bf1e4","flexWrap-wrap":"_346d3a71","flexWrap-nowrap":"_786fd122","flexShrink-0":"_4b864fc2","flexGrow-0":"_795f552f","flexGrow-1":"a68bcd0f","alignItems-flexStart":"_34e24973","alignItems-center":"_648380f4","alignItems-flexEnd":"_18b4e1d6","alignItems-baseline":"_805c1b65","tablet-alignItems-flexStart":"fd4006c2","tablet-alignItems-center":"c3ba10a7","tablet-alignItems-flexEnd":"_984cd304","tablet-alignItems-baseline":"_696cc167","desktop-alignItems-flexStart":"_74133d54","desktop-alignItems-center":"_92ab46df","desktop-alignItems-flexEnd":"_177026d9","desktop-alignItems-baseline":"ebd2f31f","justifyContent-flexStart":"_4969235b","justifyContent-center":"_9594db58","justifyContent-flexEnd":"_6789fdd3","justifyContent-spaceAround":"b9902d94","justifyContent-spaceBetween":"_3c3ae41b","justifyContent-spaceEvenly":"_8dce8767","tablet-justifyContent-flexStart":"_6bd82354","tablet-justifyContent-center":"_3044c29a","tablet-justifyContent-flexEnd":"_13da8745","tablet-justifyContent-spaceAround":"_981fa9c8","tablet-justifyContent-spaceBetween":"d34811a6","tablet-justifyContent-spaceEvenly":"_53e07124","desktop-justifyContent-flexStart":"e709f277","desktop-justifyContent-center":"abc87cc4","desktop-justifyContent-flexEnd":"ce410292","desktop-justifyContent-spaceBetween":"_5ab1bc04","overflow-hidden":"_11a684c0","overflow-auto":"_2c024f85","overflow-visible":"_4d4892bd","overflow-scroll":"_22ffbb40","width-full":"_330d9b0b","height-full":"fb8deb05","bg-default":"_133f5c00","bg-aside":"b2be7ffe","bg-highlight":"a45e67ff","bg-selected":"b90226b5","borderRadius-standard":"_6e988219","borderRadius-full":"_14cf204e","border-primary":"a710cfdd","border-secondary":"_52263feb","border-tertiary":"_546ec3ef","textAlign-start":"_7fa90cb9","textAlign-center":"_54c80396","textAlign-end":"e4b1ea49","textAlign-justify":"_0eecd510","tablet-textAlign-start":"a309e75d","tablet-textAlign-center":"_67fb1a07","tablet-textAlign-end":"_0fa851ec","tablet-textAlign-justify":"_585a0e34","desktop-textAlign-start":"_5f909690","desktop-textAlign-center":"_13e03993","desktop-textAlign-end":"f142a1cb","desktop-textAlign-justify":"_2bba79a9"};
 
 export default modules_54d944f2;
 //# sourceMappingURL=box.module.css.js.map

package/es/new-components/button/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","sources":["../../../src/new-components/button/button.tsx"],"sourcesContent":["import * as React from 'react'\nimport { BaseButton } from '../base-button'\nimport type { BaseButtonProps } from '../base-button'\n\ntype NativeButtonProps = Omit<\n    React.AllHTMLAttributes<HTMLButtonElement>,\n    'aria-disabled' | 'className' | keyof BaseButtonProps\n>\n\ntype ButtonProps = NativeButtonProps &\n    BaseButtonProps & {\n        type?: 'button' | 'submit' | 'reset'\n        exceptionallySetClassName?: string\n    }\n\n/**\n * A semantic button that also looks like a button, and provides all the necessary visual variants.\n * It follows the [WAI-ARIA Button Pattern](https://www.w3.org/TR/wai-aria-practices/#button).\n *\n * 🎨 [Figma](https://www.figma.com/file/LYlWNzvhMDh907l07mPPQk/Product-Web?node-id=4693%3A175143)\n *\n * @see ButtonLink\n */\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(function Button(\n    {\n        variant,\n        tone = 'normal',\n        size = 'normal',\n        type = 'button',\n        disabled = false,\n        exceptionallySetClassName,\n        ...props\n    },\n    ref,\n) {\n    return (\n        <BaseButton\n            {...props}\n            as=\"button\"\n            ref={ref}\n            variant={variant}\n            tone={tone}\n            size={size}\n            type={type}\n            disabled={disabled}\n            exceptionallySetClassName={exceptionallySetClassName}\n        />\n    )\n})\n\nexport { Button }\nexport type { ButtonProps }\n"],"names":["Button","React","ref","variant","tone","size","type","disabled","exceptionallySetClassName","props","BaseButton","as"],"mappings":";;;;AAeA;;;;;;;;;IAQMA,MAAM,gBAAGC,UAAA,CAAiD,SAASD,MAAT,OAU5DE,GAV4D;MAExDC,eAAAA;uBACAC;MAAAA,8BAAO;uBACPC;MAAAA,8BAAO;uBACPC;MAAAA,8BAAO;2BACPC;MAAAA,sCAAW;MACXC,iCAAAA;MACGC;;AAIP,sBACIR,aAAA,CAACS,UAAD,oBACQD;AACJE,IAAAA,EAAE,EAAC;AACHT,IAAAA,GAAG,EAAEA;AACLC,IAAAA,OAAO,EAAEA;AACTC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,QAAQ,EAAEA;AACVC,IAAAA,yBAAyB,EAAEA;IAT/B,CADJ;AAaH,CAzBc;;;;"}
+{"version":3,"file":"button.js","sources":["../../../src/new-components/button/button.tsx"],"sourcesContent":["import * as React from 'react'\nimport { BaseButton } from '../base-button'\nimport type { BaseButtonProps } from '../base-button'\n\ntype NativeButtonProps = Omit<\n    React.AllHTMLAttributes<HTMLButtonElement>,\n    'aria-disabled' | 'className' | keyof BaseButtonProps\n>\n\nexport type ButtonProps = NativeButtonProps &\n    BaseButtonProps & {\n        type?: 'button' | 'submit' | 'reset'\n        exceptionallySetClassName?: string\n    }\n\n/**\n * A semantic button that also looks like a button, and provides all the necessary visual variants.\n * It follows the [WAI-ARIA Button Pattern](https://www.w3.org/TR/wai-aria-practices/#button).\n *\n * 🎨 [Figma](https://www.figma.com/file/LYlWNzvhMDh907l07mPPQk/Product-Web?node-id=4693%3A175143)\n *\n * @see ButtonLink\n */\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(function Button(\n    {\n        variant,\n        tone = 'normal',\n        size = 'normal',\n        type = 'button',\n        disabled = false,\n        exceptionallySetClassName,\n        ...props\n    },\n    ref,\n) {\n    return (\n        <BaseButton\n            {...props}\n            as=\"button\"\n            ref={ref}\n            variant={variant}\n            tone={tone}\n            size={size}\n            type={type}\n            disabled={disabled}\n            exceptionallySetClassName={exceptionallySetClassName}\n        />\n    )\n})\n"],"names":["Button","React","ref","variant","tone","size","type","disabled","exceptionallySetClassName","props","BaseButton","as"],"mappings":";;;;AAeA;;;;;;;;;IAQaA,MAAM,gBAAGC,UAAA,CAAiD,SAASD,MAAT,OAUnEE,GAVmE;MAE/DC,eAAAA;uBACAC;MAAAA,8BAAO;uBACPC;MAAAA,8BAAO;uBACPC;MAAAA,8BAAO;2BACPC;MAAAA,sCAAW;MACXC,iCAAAA;MACGC;;AAIP,sBACIR,aAAA,CAACS,UAAD,oBACQD;AACJE,IAAAA,EAAE,EAAC;AACHT,IAAAA,GAAG,EAAEA;AACLC,IAAAA,OAAO,EAAEA;AACTC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,QAAQ,EAAEA;AACVC,IAAAA,yBAAyB,EAAEA;IAT/B,CADJ;AAaH,CAzBqB;;;;"}

package/es/new-components/button-link/button-link.js

@@ -20,12 +20,10 @@ var ButtonLink = /*#__PURE__*/polymorphicComponent(function ButtonLink(_ref, ref
       tone = _ref$tone === void 0 ? 'normal' : _ref$tone,
       _ref$size = _ref.size,
       size = _ref$size === void 0 ? 'normal' : _ref$size,
-      _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
       exceptionallySetClassName = _ref.exceptionallySetClassName,
       _ref$openInNewTab = _ref.openInNewTab,
       openInNewTab = _ref$openInNewTab === void 0 ? false : _ref$openInNewTab,
-      props = _objectWithoutPropertiesLoose(_ref, ["as", "variant", "tone", "size", "disabled", "exceptionallySetClassName", "openInNewTab"]);
+      props = _objectWithoutPropertiesLoose(_ref, ["as", "variant", "tone", "size", "exceptionallySetClassName", "openInNewTab"]);
 
   return /*#__PURE__*/createElement(BaseButton, Object.assign({}, props, {
     as: as,
@@ -33,7 +31,6 @@ var ButtonLink = /*#__PURE__*/polymorphicComponent(function ButtonLink(_ref, ref
     variant: variant,
     tone: tone,
     size: size,
-    disabled: disabled,
     exceptionallySetClassName: exceptionallySetClassName,
     target: openInNewTab ? '_blank' : undefined,
     rel: openInNewTab ? 'noopener noreferrer' : undefined

package/es/new-components/button-link/button-link.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-link.js","sources":["../../../src/new-components/button-link/button-link.tsx"],"sourcesContent":["import * as React from 'react'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport { BaseButton } from '../base-button'\nimport type { BaseButtonProps } from '../base-button'\nimport type { OpenInNewTab } from '../common-types'\n\ntype NativeLinkProps = Omit<\n    JSX.IntrinsicElements['a'],\n    'aria-disabled' | 'target' | 'rel' | 'className'\n>\n\ntype ButtonLinkProps = NativeLinkProps & BaseButtonProps & OpenInNewTab\n\n/**\n * A semantic link that looks like a button, exactly matching the `Button` component in all visual\n * aspects.\n *\n *🎨 [Figma](https://www.figma.com/file/LYlWNzvhMDh907l07mPPQk/Product-Web?node-id=4693%3A175143)\n *\n * @see Button\n */\nconst ButtonLink = polymorphicComponent<'a', ButtonLinkProps>(function ButtonLink(\n    {\n        as = 'a',\n        variant,\n        tone = 'normal',\n        size = 'normal',\n        disabled = false,\n        exceptionallySetClassName,\n        openInNewTab = false,\n        ...props\n    },\n    ref,\n) {\n    return (\n        <BaseButton\n            {...props}\n            as={as}\n            ref={ref}\n            variant={variant}\n            tone={tone}\n            size={size}\n            disabled={disabled}\n            exceptionallySetClassName={exceptionallySetClassName}\n            target={openInNewTab ? '_blank' : undefined}\n            rel={openInNewTab ? 'noopener noreferrer' : undefined}\n        />\n    )\n})\n\nexport { ButtonLink }\nexport type { ButtonLinkProps }\n"],"names":["ButtonLink","polymorphicComponent","ref","as","variant","tone","size","disabled","exceptionallySetClassName","openInNewTab","props","React","BaseButton","target","undefined","rel"],"mappings":";;;;;AAaA;;;;;;;;;IAQMA,UAAU,gBAAGC,oBAAoB,CAAuB,SAASD,UAAT,OAW1DE,GAX0D;qBAEtDC;MAAAA,0BAAK;MACLC,eAAAA;uBACAC;MAAAA,8BAAO;uBACPC;MAAAA,8BAAO;2BACPC;MAAAA,sCAAW;MACXC,iCAAAA;+BACAC;MAAAA,8CAAe;MACZC;;AAIP,sBACIC,aAAA,CAACC,UAAD,oBACQF;AACJP,IAAAA,EAAE,EAAEA;AACJD,IAAAA,GAAG,EAAEA;AACLE,IAAAA,OAAO,EAAEA;AACTC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,QAAQ,EAAEA;AACVC,IAAAA,yBAAyB,EAAEA;AAC3BK,IAAAA,MAAM,EAAEJ,YAAY,GAAG,QAAH,GAAcK;AAClCC,IAAAA,GAAG,EAAEN,YAAY,GAAG,qBAAH,GAA2BK;IAVhD,CADJ;AAcH,CA3BsC;;;;"}
+{"version":3,"file":"button-link.js","sources":["../../../src/new-components/button-link/button-link.tsx"],"sourcesContent":["import * as React from 'react'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport { BaseButton } from '../base-button'\nimport type { BaseButtonProps } from '../base-button'\nimport type { OpenInNewTab } from '../common-types'\n\ntype NativeLinkProps = Omit<\n    JSX.IntrinsicElements['a'],\n    'aria-disabled' | 'target' | 'rel' | 'className'\n>\n\nexport type ButtonLinkProps = NativeLinkProps & BaseButtonProps & OpenInNewTab\n\n/**\n * A semantic link that looks like a button, exactly matching the `Button` component in all visual\n * aspects.\n *\n *🎨 [Figma](https://www.figma.com/file/LYlWNzvhMDh907l07mPPQk/Product-Web?node-id=4693%3A175143)\n *\n * @see Button\n */\nexport const ButtonLink = polymorphicComponent<'a', ButtonLinkProps>(function ButtonLink(\n    {\n        as = 'a',\n        variant,\n        tone = 'normal',\n        size = 'normal',\n        exceptionallySetClassName,\n        openInNewTab = false,\n        ...props\n    },\n    ref,\n) {\n    return (\n        <BaseButton\n            {...props}\n            as={as}\n            ref={ref}\n            variant={variant}\n            tone={tone}\n            size={size}\n            exceptionallySetClassName={exceptionallySetClassName}\n            target={openInNewTab ? '_blank' : undefined}\n            rel={openInNewTab ? 'noopener noreferrer' : undefined}\n        />\n    )\n})\n"],"names":["ButtonLink","polymorphicComponent","ref","as","variant","tone","size","exceptionallySetClassName","openInNewTab","props","React","BaseButton","target","undefined","rel"],"mappings":";;;;;AAaA;;;;;;;;;IAQaA,UAAU,gBAAGC,oBAAoB,CAAuB,SAASD,UAAT,OAUjEE,GAViE;qBAE7DC;MAAAA,0BAAK;MACLC,eAAAA;uBACAC;MAAAA,8BAAO;uBACPC;MAAAA,8BAAO;MACPC,iCAAAA;+BACAC;MAAAA,8CAAe;MACZC;;AAIP,sBACIC,aAAA,CAACC,UAAD,oBACQF;AACJN,IAAAA,EAAE,EAAEA;AACJD,IAAAA,GAAG,EAAEA;AACLE,IAAAA,OAAO,EAAEA;AACTC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,IAAI,EAAEA;AACNC,IAAAA,yBAAyB,EAAEA;AAC3BK,IAAAA,MAAM,EAAEJ,YAAY,GAAG,QAAH,GAAcK;AAClCC,IAAAA,GAAG,EAAEN,YAAY,GAAG,qBAAH,GAA2BK;IAThD,CADJ;AAaH,CAzB6C;;;;"}

package/es/new-components/checkbox-field/checkbox-field.js

@@ -2,6 +2,7 @@ import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '.
 import { forwardRef, useState, useRef, useEffect, createElement } from 'react';
 import { Box } from '../box/box.js';
 import { HiddenVisually } from '../hidden-visually/hidden-visually.js';
+import { Text } from '../text/text.js';
 import { useForkRef } from 'reakit-utils';
 import { CheckboxIcon } from './checkbox-icon.js';
 import styles from './checkbox-field.module.css.js';
@@ -63,7 +64,7 @@ var CheckboxField = /*#__PURE__*/forwardRef(function CheckboxField(_ref, ref) {
     checked: isChecked,
     indeterminate: indeterminate,
     disabled: disabled
-  }), label ? /*#__PURE__*/createElement("span", null, label) : null);
+  }), label ? /*#__PURE__*/createElement(Text, null, label) : null);
 });
 
 export { CheckboxField };

package/es/new-components/checkbox-field/checkbox-field.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox-field.js","sources":["../../../src/new-components/checkbox-field/checkbox-field.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useForkRef } from 'reakit-utils'\nimport { HiddenVisually } from '../hidden-visually'\nimport { Box } from '../box'\nimport { CheckboxIcon } from './checkbox-icon'\n\nimport styles from './checkbox-field.module.css'\n\ntype CheckboxFieldProps = Omit<JSX.IntrinsicElements['input'], 'type' | 'className'> & {\n    label?: string\n    indeterminate?: boolean\n}\n\nconst CheckboxField = React.forwardRef<HTMLInputElement, CheckboxFieldProps>(function CheckboxField(\n    { label, disabled, indeterminate, defaultChecked, onChange, ...props },\n    ref,\n) {\n    const isControlledComponent = typeof props.checked === 'boolean'\n    if (typeof indeterminate === 'boolean' && !isControlledComponent) {\n        // eslint-disable-next-line no-console\n        console.warn('Cannot use indeterminate on an uncontrolled checkbox')\n        indeterminate = undefined\n    }\n\n    if (!label && !props['aria-label'] && !props['aria-labelledby']) {\n        // eslint-disable-next-line no-console\n        console.warn('A Checkbox needs a label')\n    }\n\n    const [checkedState, setChecked] = React.useState(props.checked ?? defaultChecked ?? false)\n    const isChecked = props.checked ?? checkedState\n\n    const internalRef = React.useRef<HTMLInputElement>(null)\n    const combinedRef = useForkRef(internalRef, ref)\n    React.useEffect(\n        function setIndeterminate() {\n            if (internalRef.current && typeof indeterminate === 'boolean') {\n                internalRef.current.indeterminate = indeterminate\n            }\n        },\n        [indeterminate],\n    )\n\n    return (\n        <Box\n            as=\"label\"\n            display=\"flex\"\n            alignItems=\"center\"\n            className={[\n                styles.container,\n                disabled ? styles.disabled : null,\n                isChecked ? styles.checked : null,\n                'focus-marker-enabled-within',\n            ]}\n        >\n            <HiddenVisually>\n                <input\n                    {...props}\n                    ref={combinedRef}\n                    type=\"checkbox\"\n                    checked={isChecked}\n                    disabled={disabled}\n                    onChange={(event) => {\n                        onChange?.(event)\n                        if (!event.defaultPrevented) {\n                            setChecked(event.currentTarget.checked)\n                        }\n                    }}\n                />\n            </HiddenVisually>\n            <CheckboxIcon\n                aria-hidden\n                checked={isChecked}\n                indeterminate={indeterminate}\n                disabled={disabled}\n            />\n            {label ? <span>{label}</span> : null}\n        </Box>\n    )\n})\n\nexport { CheckboxField }\nexport type { CheckboxFieldProps }\n"],"names":["CheckboxField","React","ref","label","disabled","indeterminate","defaultChecked","onChange","props","isControlledComponent","checked","console","warn","undefined","checkedState","setChecked","isChecked","internalRef","combinedRef","useForkRef","setIndeterminate","current","Box","as","display","alignItems","className","styles","container","HiddenVisually","type","event","defaultPrevented","currentTarget","CheckboxIcon"],"mappings":";;;;;;;;IAaMA,aAAa,gBAAGC,UAAA,CAAuD,SAASD,aAAT,OAEzEE,GAFyE;;;MACvEC,aAAAA;MAAOC,gBAAAA;MAAUC,qBAAAA;MAAeC,sBAAAA;MAAgBC,iBAAAA;MAAaC;;AAG/D,MAAMC,qBAAqB,GAAG,OAAOD,KAAK,CAACE,OAAb,KAAyB,SAAvD;;AACA,MAAI,OAAOL,aAAP,KAAyB,SAAzB,IAAsC,CAACI,qBAA3C,EAAkE;AAC9D;AACAE,IAAAA,OAAO,CAACC,IAAR,CAAa,sDAAb;AACAP,IAAAA,aAAa,GAAGQ,SAAhB;AACH;;AAED,MAAI,CAACV,KAAD,IAAU,CAACK,KAAK,CAAC,YAAD,CAAhB,IAAkC,CAACA,KAAK,CAAC,iBAAD,CAA5C,EAAiE;AAC7D;AACAG,IAAAA,OAAO,CAACC,IAAR,CAAa,0BAAb;AACH;;wBAEkCX,QAAA,4BAAeO,KAAK,CAACE,OAArB,2DAAgCJ,cAAhC,yCAAkD,KAAlD;MAA5BQ;MAAcC;;AACrB,MAAMC,SAAS,sBAAGR,KAAK,CAACE,OAAT,6DAAoBI,YAAnC;AAEA,MAAMG,WAAW,GAAGhB,MAAA,CAA+B,IAA/B,CAApB;AACA,MAAMiB,WAAW,GAAGC,UAAU,CAACF,WAAD,EAAcf,GAAd,CAA9B;AACAD,EAAAA,SAAA,CACI,SAASmB,gBAAT;AACI,QAAIH,WAAW,CAACI,OAAZ,IAAuB,OAAOhB,aAAP,KAAyB,SAApD,EAA+D;AAC3DY,MAAAA,WAAW,CAACI,OAAZ,CAAoBhB,aAApB,GAAoCA,aAApC;AACH;AACJ,GALL,EAMI,CAACA,aAAD,CANJ;AASA,sBACIJ,aAAA,CAACqB,GAAD;AACIC,IAAAA,EAAE,EAAC;AACHC,IAAAA,OAAO,EAAC;AACRC,IAAAA,UAAU,EAAC;AACXC,IAAAA,SAAS,EAAE,CACPC,MAAM,CAACC,SADA,EAEPxB,QAAQ,GAAGuB,MAAM,CAACvB,QAAV,GAAqB,IAFtB,EAGPY,SAAS,GAAGW,MAAM,CAACjB,OAAV,GAAoB,IAHtB,EAIP,6BAJO;GAJf,eAWIT,aAAA,CAAC4B,cAAD,MAAA,eACI5B,aAAA,QAAA,oBACQO;AACJN,IAAAA,GAAG,EAAEgB;AACLY,IAAAA,IAAI,EAAC;AACLpB,IAAAA,OAAO,EAAEM;AACTZ,IAAAA,QAAQ,EAAEA;AACVG,IAAAA,QAAQ,EAAE,kBAACwB,KAAD;AACNxB,MAAAA,SAAQ,SAAR,IAAAA,SAAQ,WAAR,YAAAA,SAAQ,CAAGwB,KAAH,CAAR;;AACA,UAAI,CAACA,KAAK,CAACC,gBAAX,EAA6B;AACzBjB,QAAAA,UAAU,CAACgB,KAAK,CAACE,aAAN,CAAoBvB,OAArB,CAAV;AACH;AACJ;IAXL,CADJ,CAXJ,eA0BIT,aAAA,CAACiC,YAAD;;AAEIxB,IAAAA,OAAO,EAAEM;AACTX,IAAAA,aAAa,EAAEA;AACfD,IAAAA,QAAQ,EAAEA;GAJd,CA1BJ,EAgCKD,KAAK,gBAAGF,aAAA,OAAA,MAAA,EAAOE,KAAP,CAAH,GAA0B,IAhCpC,CADJ;AAoCH,CAlEqB;;;;"}
+{"version":3,"file":"checkbox-field.js","sources":["../../../src/new-components/checkbox-field/checkbox-field.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useForkRef } from 'reakit-utils'\nimport { HiddenVisually } from '../hidden-visually'\nimport { Box } from '../box'\nimport { Text } from '../text'\nimport { CheckboxIcon } from './checkbox-icon'\n\nimport styles from './checkbox-field.module.css'\n\ntype CheckboxFieldProps = Omit<JSX.IntrinsicElements['input'], 'type' | 'className'> & {\n    label?: string\n    indeterminate?: boolean\n}\n\nconst CheckboxField = React.forwardRef<HTMLInputElement, CheckboxFieldProps>(function CheckboxField(\n    { label, disabled, indeterminate, defaultChecked, onChange, ...props },\n    ref,\n) {\n    const isControlledComponent = typeof props.checked === 'boolean'\n    if (typeof indeterminate === 'boolean' && !isControlledComponent) {\n        // eslint-disable-next-line no-console\n        console.warn('Cannot use indeterminate on an uncontrolled checkbox')\n        indeterminate = undefined\n    }\n\n    if (!label && !props['aria-label'] && !props['aria-labelledby']) {\n        // eslint-disable-next-line no-console\n        console.warn('A Checkbox needs a label')\n    }\n\n    const [checkedState, setChecked] = React.useState(props.checked ?? defaultChecked ?? false)\n    const isChecked = props.checked ?? checkedState\n\n    const internalRef = React.useRef<HTMLInputElement>(null)\n    const combinedRef = useForkRef(internalRef, ref)\n    React.useEffect(\n        function setIndeterminate() {\n            if (internalRef.current && typeof indeterminate === 'boolean') {\n                internalRef.current.indeterminate = indeterminate\n            }\n        },\n        [indeterminate],\n    )\n\n    return (\n        <Box\n            as=\"label\"\n            display=\"flex\"\n            alignItems=\"center\"\n            className={[\n                styles.container,\n                disabled ? styles.disabled : null,\n                isChecked ? styles.checked : null,\n                'focus-marker-enabled-within',\n            ]}\n        >\n            <HiddenVisually>\n                <input\n                    {...props}\n                    ref={combinedRef}\n                    type=\"checkbox\"\n                    checked={isChecked}\n                    disabled={disabled}\n                    onChange={(event) => {\n                        onChange?.(event)\n                        if (!event.defaultPrevented) {\n                            setChecked(event.currentTarget.checked)\n                        }\n                    }}\n                />\n            </HiddenVisually>\n            <CheckboxIcon\n                aria-hidden\n                checked={isChecked}\n                indeterminate={indeterminate}\n                disabled={disabled}\n            />\n            {label ? <Text>{label}</Text> : null}\n        </Box>\n    )\n})\n\nexport { CheckboxField }\nexport type { CheckboxFieldProps }\n"],"names":["CheckboxField","React","ref","label","disabled","indeterminate","defaultChecked","onChange","props","isControlledComponent","checked","console","warn","undefined","checkedState","setChecked","isChecked","internalRef","combinedRef","useForkRef","setIndeterminate","current","Box","as","display","alignItems","className","styles","container","HiddenVisually","type","event","defaultPrevented","currentTarget","CheckboxIcon","Text"],"mappings":";;;;;;;;;IAcMA,aAAa,gBAAGC,UAAA,CAAuD,SAASD,aAAT,OAEzEE,GAFyE;;;MACvEC,aAAAA;MAAOC,gBAAAA;MAAUC,qBAAAA;MAAeC,sBAAAA;MAAgBC,iBAAAA;MAAaC;;AAG/D,MAAMC,qBAAqB,GAAG,OAAOD,KAAK,CAACE,OAAb,KAAyB,SAAvD;;AACA,MAAI,OAAOL,aAAP,KAAyB,SAAzB,IAAsC,CAACI,qBAA3C,EAAkE;AAC9D;AACAE,IAAAA,OAAO,CAACC,IAAR,CAAa,sDAAb;AACAP,IAAAA,aAAa,GAAGQ,SAAhB;AACH;;AAED,MAAI,CAACV,KAAD,IAAU,CAACK,KAAK,CAAC,YAAD,CAAhB,IAAkC,CAACA,KAAK,CAAC,iBAAD,CAA5C,EAAiE;AAC7D;AACAG,IAAAA,OAAO,CAACC,IAAR,CAAa,0BAAb;AACH;;wBAEkCX,QAAA,4BAAeO,KAAK,CAACE,OAArB,2DAAgCJ,cAAhC,yCAAkD,KAAlD;MAA5BQ;MAAcC;;AACrB,MAAMC,SAAS,sBAAGR,KAAK,CAACE,OAAT,6DAAoBI,YAAnC;AAEA,MAAMG,WAAW,GAAGhB,MAAA,CAA+B,IAA/B,CAApB;AACA,MAAMiB,WAAW,GAAGC,UAAU,CAACF,WAAD,EAAcf,GAAd,CAA9B;AACAD,EAAAA,SAAA,CACI,SAASmB,gBAAT;AACI,QAAIH,WAAW,CAACI,OAAZ,IAAuB,OAAOhB,aAAP,KAAyB,SAApD,EAA+D;AAC3DY,MAAAA,WAAW,CAACI,OAAZ,CAAoBhB,aAApB,GAAoCA,aAApC;AACH;AACJ,GALL,EAMI,CAACA,aAAD,CANJ;AASA,sBACIJ,aAAA,CAACqB,GAAD;AACIC,IAAAA,EAAE,EAAC;AACHC,IAAAA,OAAO,EAAC;AACRC,IAAAA,UAAU,EAAC;AACXC,IAAAA,SAAS,EAAE,CACPC,MAAM,CAACC,SADA,EAEPxB,QAAQ,GAAGuB,MAAM,CAACvB,QAAV,GAAqB,IAFtB,EAGPY,SAAS,GAAGW,MAAM,CAACjB,OAAV,GAAoB,IAHtB,EAIP,6BAJO;GAJf,eAWIT,aAAA,CAAC4B,cAAD,MAAA,eACI5B,aAAA,QAAA,oBACQO;AACJN,IAAAA,GAAG,EAAEgB;AACLY,IAAAA,IAAI,EAAC;AACLpB,IAAAA,OAAO,EAAEM;AACTZ,IAAAA,QAAQ,EAAEA;AACVG,IAAAA,QAAQ,EAAE,kBAACwB,KAAD;AACNxB,MAAAA,SAAQ,SAAR,IAAAA,SAAQ,WAAR,YAAAA,SAAQ,CAAGwB,KAAH,CAAR;;AACA,UAAI,CAACA,KAAK,CAACC,gBAAX,EAA6B;AACzBjB,QAAAA,UAAU,CAACgB,KAAK,CAACE,aAAN,CAAoBvB,OAArB,CAAV;AACH;AACJ;IAXL,CADJ,CAXJ,eA0BIT,aAAA,CAACiC,YAAD;;AAEIxB,IAAAA,OAAO,EAAEM;AACTX,IAAAA,aAAa,EAAEA;AACfD,IAAAA,QAAQ,EAAEA;GAJd,CA1BJ,EAgCKD,KAAK,gBAAGF,aAAA,CAACkC,IAAD,MAAA,EAAOhC,KAAP,CAAH,GAA0B,IAhCpC,CADJ;AAoCH,CAlEqB;;;;"}

package/es/new-components/columns/columns.module.css.js

@@ -1,4 +1,4 @@
-var modules_67f2d07a = {"space-xsmall":"bc73ab9d","column":"_7efa4861","space-small":"c93ef522","space-medium":"a3bcceae","space-large":"_6e3b6830","space-xlarge":"c8935f26","space-xxlarge":"_0f819fef","tablet-space-xsmall":"b37242bb","tablet-space-small":"bbdf9471","tablet-space-medium":"_66c6998d","tablet-space-large":"bce245a1","tablet-space-xlarge":"fdff6b7f","tablet-space-xxlarge":"e4ec3d8d","desktop-space-xsmall":"_4a75307e","desktop-space-small":"_97b495ec","desktop-space-medium":"be376830","desktop-space-large":"_9b3b7633","desktop-space-xlarge":"_791a2950","desktop-space-xxlarge":"f49836a3","columnWidth-auto":"a4c294e6","columnWidth-1-2":"de029ae3","columnWidth-1-3":"_102223f4","columnWidth-2-3":"_35209410","columnWidth-1-4":"_785d4274","columnWidth-3-4":"d4b300a7","columnWidth-1-5":"c7e02813","columnWidth-2-5":"d305894b","columnWidth-3-5":"_420612f0","columnWidth-4-5":"a9c44d9e","tablet-tablet-space-xsmall":"b8d9d8fb"};
+var modules_67f2d07a = {"space-xsmall":"_6f59c771","column":"_91e05f0f","space-small":"_5a55af26","space-medium":"fa261310","space-large":"_6ebd4e46","space-xlarge":"_55ce4aea","space-xxlarge":"_04c9c3ac","tablet-space-xsmall":"ab76d8cd","tablet-space-small":"_14629bfb","tablet-space-medium":"_5b4e39ea","tablet-space-large":"ba270182","tablet-space-xlarge":"b96e7ec7","tablet-space-xxlarge":"d276612c","desktop-space-xsmall":"d7a73106","desktop-space-small":"_8f5e0e9e","desktop-space-medium":"_3a168411","desktop-space-large":"_0abcc12e","desktop-space-xlarge":"e0bafc60","desktop-space-xxlarge":"d2df9afd","columnWidth-auto":"b18d0b47","columnWidth-1-2":"_102a6b27","columnWidth-1-3":"_829872fe","columnWidth-2-3":"cf5aef9a","columnWidth-1-4":"_931bf714","columnWidth-3-4":"b0303130","columnWidth-1-5":"f6589a6f","columnWidth-2-5":"_2823aed9","columnWidth-3-5":"d00ba3bb","columnWidth-4-5":"_338f2d7c","tablet-tablet-space-xsmall":"_06582234"};
 
 export default modules_67f2d07a;
 //# sourceMappingURL=columns.module.css.js.map

package/es/new-components/divider/divider.js

@@ -6,12 +6,12 @@ import styles from './divider.module.css.js';
 
 function Divider(_ref) {
   var _ref$weight = _ref.weight,
-      weight = _ref$weight === void 0 ? 'regular' : _ref$weight,
+      weight = _ref$weight === void 0 ? 'primary' : _ref$weight,
       props = _objectWithoutPropertiesLoose(_ref, ["weight"]);
 
   return /*#__PURE__*/createElement(Box, Object.assign({
     as: "hr",
-    className: [styles.divider, weight !== 'regular' ? getClassNames(styles, 'weight', weight) : null]
+    className: getClassNames(styles, 'weight', weight)
   }, props));
 }
 

package/es/new-components/divider/divider.js.map

@@ -1 +1 @@
-{"version":3,"file":"divider.js","sources":["../../../src/new-components/divider/divider.tsx"],"sourcesContent":["import * as React from 'react'\nimport { getClassNames } from '../responsive-props'\nimport { Box } from '../box'\n\nimport styles from './divider.module.css'\n\ntype DividerWeight = 'regular' | 'strong'\n\ninterface DividerProps {\n    weight?: DividerWeight\n}\n\nfunction Divider({ weight = 'regular', ...props }: DividerProps) {\n    return (\n        <Box\n            as=\"hr\"\n            className={[\n                styles.divider,\n                weight !== 'regular' ? getClassNames(styles, 'weight', weight) : null,\n            ]}\n            {...props}\n        />\n    )\n}\n\nexport type { DividerProps, DividerWeight }\nexport { Divider }\n"],"names":["Divider","weight","props","React","Box","as","className","styles","divider","getClassNames"],"mappings":";;;;;;AAYA,SAASA,OAAT;yBAAmBC;MAAAA,kCAAS;MAAcC;;AACtC,sBACIC,aAAA,CAACC,GAAD;AACIC,IAAAA,EAAE,EAAC;AACHC,IAAAA,SAAS,EAAE,CACPC,MAAM,CAACC,OADA,EAEPP,MAAM,KAAK,SAAX,GAAuBQ,aAAa,CAACF,MAAD,EAAS,QAAT,EAAmBN,MAAnB,CAApC,GAAiE,IAF1D;KAIPC,MANR,CADJ;AAUH;;;;"}
+{"version":3,"file":"divider.js","sources":["../../../src/new-components/divider/divider.tsx"],"sourcesContent":["import * as React from 'react'\nimport { getClassNames } from '../responsive-props'\nimport { Box } from '../box'\nimport type { DividerWeight } from '../common-types'\n\nimport styles from './divider.module.css'\n\ninterface DividerProps {\n    weight?: Exclude<DividerWeight, 'none'>\n}\n\nfunction Divider({ weight = 'primary', ...props }: DividerProps) {\n    return <Box as=\"hr\" className={getClassNames(styles, 'weight', weight)} {...props} />\n}\n\nexport type { DividerProps, DividerWeight }\nexport { Divider }\n"],"names":["Divider","weight","props","React","Box","as","className","getClassNames","styles"],"mappings":";;;;;;AAWA,SAASA,OAAT;yBAAmBC;MAAAA,kCAAS;MAAcC;;AACtC,sBAAOC,aAAA,CAACC,GAAD;AAAKC,IAAAA,EAAE,EAAC;AAAKC,IAAAA,SAAS,EAAEC,aAAa,CAACC,MAAD,EAAS,QAAT,EAAmBP,MAAnB;KAAgCC,MAArE,CAAP;AACH;;;;"}

package/es/new-components/divider/divider.module.css.js

@@ -1,4 +1,4 @@
-var modules_c742c4d7 = {"divider":"_9b6c04bf","weight-strong":"_6354eb7c"};
+var modules_c742c4d7 = {"weight-primary":"_3f3a401c","weight-secondary":"_03b05b70","weight-tertiary":"b6f67ff8"};
 
 export default modules_c742c4d7;
 //# sourceMappingURL=divider.module.css.js.map

package/es/new-components/loading/loading.js

@@ -1,7 +1,7 @@
 import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default from 'react';
 import { Box } from '../box/box.js';
-import styles from './loading.module.css.js';
+import { Spinner } from '../spinner/spinner.js';
 
 var sizeMapping = {
   small: 24,
@@ -24,22 +24,9 @@ function Loading(_ref) {
     alignItems: "center",
     justifyContent: "center",
     role: "progressbar"
-  }), /*#__PURE__*/React__default.createElement("svg", {
-    "aria-hidden": true,
-    width: numericSize,
-    height: numericSize,
-    viewBox: "0 0 24 24",
-    className: styles.svg
-  }, /*#__PURE__*/React__default.createElement("g", {
-    fill: "none",
-    fillRule: "nonzero"
-  }, /*#__PURE__*/React__default.createElement("path", {
-    className: styles.spinner,
-    d: "M17.945 3.958A9.955 9.955 0 0 0 12 2c-2.19 0-4.217.705-5.865 1.9L5.131 2.16A11.945 11.945 0 0 1 12 0c2.59 0 4.99.82 6.95 2.217l-1.005 1.741z"
-  }), /*#__PURE__*/React__default.createElement("path", {
-    className: styles.spinnerBackground,
-    d: "M5.13 2.16L6.136 3.9A9.987 9.987 0 0 0 2 12c0 5.523 4.477 10 10 10s10-4.477 10-10a9.986 9.986 0 0 0-4.055-8.042l1.006-1.741A11.985 11.985 0 0 1 24 12c0 6.627-5.373 12-12 12S0 18.627 0 12c0-4.073 2.029-7.671 5.13-9.84z"
-  }))));
+  }), /*#__PURE__*/React__default.createElement(Spinner, {
+    size: numericSize
+  }));
 }
 
 export { Loading };

package/es/new-components/loading/loading.js.map

@@ -1 +1 @@
-{"version":3,"file":"loading.js","sources":["../../../src/new-components/loading/loading.tsx"],"sourcesContent":["import React from 'react'\nimport { Box } from '../box'\nimport styles from './loading.module.css'\n\ntype Size = 'small' | 'medium' | 'large'\n\ntype NativeProps = Omit<\n    JSX.IntrinsicElements['div'],\n    'className' | 'aria-label' | 'aria-labelledby' | 'role' | 'size'\n>\n\ntype LoadingProps = NativeProps & {\n    /**\n     * The size of the loading spinner.\n     * @default 'small'\n     */\n    size?: Size\n    exceptionallySetClassName?: string\n} & (\n        | {\n              /**\n               * The non-visual label used for assistive technologies.\n               */\n              'aria-label': string\n              'aria-labelledby'?: never\n          }\n        | {\n              /**\n               * The non-visual label used for assistive technologies.\n               */\n              'aria-labelledby': string\n              'aria-label'?: never\n          }\n    )\n\nconst sizeMapping: Record<Size, number> = {\n    small: 24,\n    medium: 36,\n    large: 48,\n}\n\nfunction Loading({ size = 'small', exceptionallySetClassName, ...props }: LoadingProps) {\n    const numericSize = sizeMapping[size] ?? sizeMapping.small\n    return (\n        <Box\n            {...props}\n            className={exceptionallySetClassName}\n            display=\"flex\"\n            alignItems=\"center\"\n            justifyContent=\"center\"\n            role=\"progressbar\"\n        >\n            <svg\n                aria-hidden\n                width={numericSize}\n                height={numericSize}\n                viewBox=\"0 0 24 24\"\n                className={styles.svg}\n            >\n                <g fill=\"none\" fillRule=\"nonzero\">\n                    <path\n                        className={styles.spinner}\n                        d=\"M17.945 3.958A9.955 9.955 0 0 0 12 2c-2.19 0-4.217.705-5.865 1.9L5.131 2.16A11.945 11.945 0 0 1 12 0c2.59 0 4.99.82 6.95 2.217l-1.005 1.741z\"\n                    />\n                    <path\n                        className={styles.spinnerBackground}\n                        d=\"M5.13 2.16L6.136 3.9A9.987 9.987 0 0 0 2 12c0 5.523 4.477 10 10 10s10-4.477 10-10a9.986 9.986 0 0 0-4.055-8.042l1.006-1.741A11.985 11.985 0 0 1 24 12c0 6.627-5.373 12-12 12S0 18.627 0 12c0-4.073 2.029-7.671 5.13-9.84z\"\n                    />\n                </g>\n            </svg>\n        </Box>\n    )\n}\n\nexport { Loading }\nexport type { LoadingProps }\n"],"names":["sizeMapping","small","medium","large","Loading","size","exceptionallySetClassName","props","numericSize","React","Box","className","display","alignItems","justifyContent","role","width","height","viewBox","styles","svg","fill","fillRule","spinner","d","spinnerBackground"],"mappings":";;;;;AAmCA,IAAMA,WAAW,GAAyB;AACtCC,EAAAA,KAAK,EAAE,EAD+B;AAEtCC,EAAAA,MAAM,EAAE,EAF8B;AAGtCC,EAAAA,KAAK,EAAE;AAH+B,CAA1C;;AAMA,SAASC,OAAT;;;uBAAmBC;MAAAA,8BAAO;MAASC,iCAAAA;MAA8BC;;AAC7D,MAAMC,WAAW,wBAAGR,WAAW,CAACK,IAAD,CAAd,iEAAwBL,WAAW,CAACC,KAArD;AACA,sBACIQ,4BAAA,CAACC,GAAD,oBACQH;AACJI,IAAAA,SAAS,EAAEL;AACXM,IAAAA,OAAO,EAAC;AACRC,IAAAA,UAAU,EAAC;AACXC,IAAAA,cAAc,EAAC;AACfC,IAAAA,IAAI,EAAC;IANT,eAQIN,4BAAA,MAAA;;AAEIO,IAAAA,KAAK,EAAER;AACPS,IAAAA,MAAM,EAAET;AACRU,IAAAA,OAAO,EAAC;AACRP,IAAAA,SAAS,EAAEQ,MAAM,CAACC;GALtB,eAOIX,4BAAA,IAAA;AAAGY,IAAAA,IAAI,EAAC;AAAOC,IAAAA,QAAQ,EAAC;GAAxB,eACIb,4BAAA,OAAA;AACIE,IAAAA,SAAS,EAAEQ,MAAM,CAACI;AAClBC,IAAAA,CAAC,EAAC;GAFN,CADJ,eAKIf,4BAAA,OAAA;AACIE,IAAAA,SAAS,EAAEQ,MAAM,CAACM;AAClBD,IAAAA,CAAC,EAAC;GAFN,CALJ,CAPJ,CARJ,CADJ;AA6BH;;;;"}
+{"version":3,"file":"loading.js","sources":["../../../src/new-components/loading/loading.tsx"],"sourcesContent":["import React from 'react'\nimport { Box } from '../box'\nimport { Spinner } from '../spinner'\n\ntype Size = 'small' | 'medium' | 'large'\n\ntype NativeProps = Omit<\n    JSX.IntrinsicElements['div'],\n    'className' | 'aria-label' | 'aria-labelledby' | 'role' | 'size'\n>\n\ntype LoadingProps = NativeProps & {\n    /**\n     * The size of the loading spinner.\n     * @default 'small'\n     */\n    size?: Size\n    exceptionallySetClassName?: string\n} & (\n        | {\n              /**\n               * The non-visual label used for assistive technologies.\n               */\n              'aria-label': string\n              'aria-labelledby'?: never\n          }\n        | {\n              /**\n               * The non-visual label used for assistive technologies.\n               */\n              'aria-labelledby': string\n              'aria-label'?: never\n          }\n    )\n\nconst sizeMapping: Record<Size, number> = {\n    small: 24,\n    medium: 36,\n    large: 48,\n}\n\nfunction Loading({ size = 'small', exceptionallySetClassName, ...props }: LoadingProps) {\n    const numericSize = sizeMapping[size] ?? sizeMapping.small\n    return (\n        <Box\n            {...props}\n            className={exceptionallySetClassName}\n            display=\"flex\"\n            alignItems=\"center\"\n            justifyContent=\"center\"\n            role=\"progressbar\"\n        >\n            <Spinner size={numericSize} />\n        </Box>\n    )\n}\n\nexport { Loading }\nexport type { LoadingProps }\n"],"names":["sizeMapping","small","medium","large","Loading","size","exceptionallySetClassName","props","numericSize","React","Box","className","display","alignItems","justifyContent","role","Spinner"],"mappings":";;;;;AAmCA,IAAMA,WAAW,GAAyB;AACtCC,EAAAA,KAAK,EAAE,EAD+B;AAEtCC,EAAAA,MAAM,EAAE,EAF8B;AAGtCC,EAAAA,KAAK,EAAE;AAH+B,CAA1C;;AAMA,SAASC,OAAT;;;uBAAmBC;MAAAA,8BAAO;MAASC,iCAAAA;MAA8BC;;AAC7D,MAAMC,WAAW,wBAAGR,WAAW,CAACK,IAAD,CAAd,iEAAwBL,WAAW,CAACC,KAArD;AACA,sBACIQ,4BAAA,CAACC,GAAD,oBACQH;AACJI,IAAAA,SAAS,EAAEL;AACXM,IAAAA,OAAO,EAAC;AACRC,IAAAA,UAAU,EAAC;AACXC,IAAAA,cAAc,EAAC;AACfC,IAAAA,IAAI,EAAC;IANT,eAQIN,4BAAA,CAACO,OAAD;AAASX,IAAAA,IAAI,EAAEG;GAAf,CARJ,CADJ;AAYH;;;;"}