@os-design/core 1.0.255 → 1.0.257

package/dist/esm/ButtonLink/index.js

@@ -1,78 +0,0 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import { css } from '@emotion/react';
-import styled from '@emotion/styled';
-import { omitEmotionProps } from '@os-design/utils';
-import React, { forwardRef } from 'react';
-import { StyledButton } from '../Button';
-import ButtonContent from '../Button/ButtonContent';
-import useButtonColors from '../Button/utils/useButtonColors';
-import { DisabledWrapper } from '../Link';
-const disabledStyles = p => p.disabled && css`
-    pointer-events: none;
-  `;
-const StyledButtonLink = styled(StyledButton.withComponent('a'), omitEmotionProps('as', 'disabled'))`
-  text-decoration: none;
-  display: inline-flex;
-  ${disabledStyles};
-`;
-
-/**
- * The button that is rendered as a link.
- */
-const ButtonLink = /*#__PURE__*/forwardRef(({
-  type = 'primary',
-  danger = false,
-  left,
-  right,
-  wide = 'default',
-  loading = false,
-  disabled = false,
-  size,
-  as,
-  onMouseDown = () => {},
-  onKeyDown = () => {},
-  children,
-  ...rest
-}, ref) => {
-  const {
-    buttonColors,
-    loadingColors
-  } = useButtonColors({
-    type,
-    danger,
-    disabled
-  });
-  const link = /*#__PURE__*/React.createElement(StyledButtonLink, _extends({
-    btnType: type,
-    colors: buttonColors,
-    wide: wide,
-    loading: loading,
-    disabled: disabled || loading,
-    size: size,
-    as: as,
-    onMouseDown: e => {
-      onMouseDown(e);
-      e.preventDefault();
-    },
-    onKeyDown: e => {
-      onKeyDown(e);
-      if (disabled || loading) e.preventDefault();
-    },
-    "aria-disabled": disabled || loading,
-    "aria-busy": loading
-  }, rest, {
-    ref: ref
-  }), /*#__PURE__*/React.createElement(ButtonContent, {
-    left: left,
-    right: right,
-    loading: loading,
-    loadingColors: loadingColors
-  }, children));
-  if (disabled || loading) {
-    return /*#__PURE__*/React.createElement(DisabledWrapper, null, link);
-  }
-  return link;
-});
-ButtonLink.displayName = 'ButtonLink';
-export default ButtonLink;
-//# sourceMappingURL=index.js.map

package/dist/esm/ButtonLink/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["css","styled","omitEmotionProps","React","forwardRef","StyledButton","ButtonContent","useButtonColors","DisabledWrapper","disabledStyles","p","disabled","StyledButtonLink","withComponent","ButtonLink","type","danger","left","right","wide","loading","size","as","onMouseDown","onKeyDown","children","rest","ref","buttonColors","loadingColors","link","createElement","_extends","btnType","colors","e","preventDefault","displayName"],"sources":["../../../src/ButtonLink/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\nimport { ButtonProps, StyledButton } from '../Button';\nimport ButtonContent from '../Button/ButtonContent';\nimport useButtonColors from '../Button/utils/useButtonColors';\nimport { DisabledWrapper, LinkProps, ReactRouterLinkProps } from '../Link';\n\ntype JsxAProps = Omit<JSX.IntrinsicElements['a'], 'type' | 'ref'>;\nexport type ButtonLinkProps = JsxAProps &\n  ReactRouterLinkProps &\n  Pick<LinkProps, 'as'> &\n  ButtonProps;\n\nconst disabledStyles = (p) =>\n  p.disabled &&\n  css`\n    pointer-events: none;\n  `;\n\nconst StyledButtonLink = styled(\n  StyledButton.withComponent('a'),\n  omitEmotionProps('as', 'disabled')\n)`\n  text-decoration: none;\n  display: inline-flex;\n  ${disabledStyles};\n`;\n\n/**\n * The button that is rendered as a link.\n */\nconst ButtonLink = forwardRef<HTMLAnchorElement, ButtonLinkProps>(\n  (\n    {\n      type = 'primary',\n      danger = false,\n      left,\n      right,\n      wide = 'default',\n      loading = false,\n      disabled = false,\n      size,\n      as,\n      onMouseDown = () => {},\n      onKeyDown = () => {},\n      children,\n      ...rest\n    },\n    ref\n  ) => {\n    const { buttonColors, loadingColors } = useButtonColors({\n      type,\n      danger,\n      disabled,\n    });\n\n    const link = (\n      <StyledButtonLink\n        btnType={type}\n        colors={buttonColors}\n        wide={wide}\n        loading={loading}\n        disabled={disabled || loading}\n        size={size}\n        as={as}\n        onMouseDown={(e) => {\n          onMouseDown(e);\n          e.preventDefault();\n        }}\n        onKeyDown={(e) => {\n          onKeyDown(e);\n          if (disabled || loading) e.preventDefault();\n        }}\n        aria-disabled={disabled || loading}\n        aria-busy={loading}\n        {...rest}\n        ref={ref}\n      >\n        <ButtonContent\n          left={left}\n          right={right}\n          loading={loading}\n          loadingColors={loadingColors}\n        >\n          {children}\n        </ButtonContent>\n      </StyledButtonLink>\n    );\n\n    if (disabled || loading) {\n      return <DisabledWrapper>{link}</DisabledWrapper>;\n    }\n\n    return link;\n  }\n);\n\nButtonLink.displayName = 'ButtonLink';\n\nexport default ButtonLink;\n"],"mappings":";AAAA,SAASA,GAAG,QAAQ,gBAAgB;AACpC,OAAOC,MAAM,MAAM,iBAAiB;AACpC,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,SAAsBC,YAAY,QAAQ,WAAW;AACrD,OAAOC,aAAa,MAAM,yBAAyB;AACnD,OAAOC,eAAe,MAAM,iCAAiC;AAC7D,SAASC,eAAe,QAAyC,SAAS;AAQ1E,MAAMC,cAAc,GAAIC,CAAC,IACvBA,CAAC,CAACC,QAAQ,IACVX,GAAG;AACL;AACA,GAAG;AAEH,MAAMY,gBAAgB,GAAGX,MAAM,CAC7BI,YAAY,CAACQ,aAAa,CAAC,GAAG,CAAC,EAC/BX,gBAAgB,CAAC,IAAI,EAAE,UAAU,CACnC,CAAC;AACD;AACA;AACA,IAAIO,cAAc;AAClB,CAAC;;AAED;AACA;AACA;AACA,MAAMK,UAAU,gBAAGV,UAAU,CAC3B,CACE;EACEW,IAAI,GAAG,SAAS;EAChBC,MAAM,GAAG,KAAK;EACdC,IAAI;EACJC,KAAK;EACLC,IAAI,GAAG,SAAS;EAChBC,OAAO,GAAG,KAAK;EACfT,QAAQ,GAAG,KAAK;EAChBU,IAAI;EACJC,EAAE;EACFC,WAAW,GAAGA,CAAA,KAAM,CAAC,CAAC;EACtBC,SAAS,GAAGA,CAAA,KAAM,CAAC,CAAC;EACpBC,QAAQ;EACR,GAAGC;AACL,CAAC,EACDC,GAAG,KACA;EACH,MAAM;IAAEC,YAAY;IAAEC;EAAc,CAAC,GAAGtB,eAAe,CAAC;IACtDQ,IAAI;IACJC,MAAM;IACNL;EACF,CAAC,CAAC;EAEF,MAAMmB,IAAI,gBACR3B,KAAA,CAAA4B,aAAA,CAACnB,gBAAgB,EAAAoB,QAAA;IACfC,OAAO,EAAElB,IAAK;IACdmB,MAAM,EAAEN,YAAa;IACrBT,IAAI,EAAEA,IAAK;IACXC,OAAO,EAAEA,OAAQ;IACjBT,QAAQ,EAAEA,QAAQ,IAAIS,OAAQ;IAC9BC,IAAI,EAAEA,IAAK;IACXC,EAAE,EAAEA,EAAG;IACPC,WAAW,EAAGY,CAAC,IAAK;MAClBZ,WAAW,CAACY,CAAC,CAAC;MACdA,CAAC,CAACC,cAAc,CAAC,CAAC;IACpB,CAAE;IACFZ,SAAS,EAAGW,CAAC,IAAK;MAChBX,SAAS,CAACW,CAAC,CAAC;MACZ,IAAIxB,QAAQ,IAAIS,OAAO,EAAEe,CAAC,CAACC,cAAc,CAAC,CAAC;IAC7C,CAAE;IACF,iBAAezB,QAAQ,IAAIS,OAAQ;IACnC,aAAWA;EAAQ,GACfM,IAAI;IACRC,GAAG,EAAEA;EAAI,iBAETxB,KAAA,CAAA4B,aAAA,CAACzB,aAAa;IACZW,IAAI,EAAEA,IAAK;IACXC,KAAK,EAAEA,KAAM;IACbE,OAAO,EAAEA,OAAQ;IACjBS,aAAa,EAAEA;EAAc,GAE5BJ,QACY,CACC,CACnB;EAED,IAAId,QAAQ,IAAIS,OAAO,EAAE;IACvB,oBAAOjB,KAAA,CAAA4B,aAAA,CAACvB,eAAe,QAAEsB,IAAsB,CAAC;EAClD;EAEA,OAAOA,IAAI;AACb,CACF,CAAC;AAEDhB,UAAU,CAACuB,WAAW,GAAG,YAAY;AAErC,eAAevB,UAAU","ignoreList":[]}

package/dist/esm/Checkbox/index.js

@@ -1,142 +0,0 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import { css } from '@emotion/react';
-import styled from '@emotion/styled';
-import { Check } from '@os-design/icons';
-import { resetFocusStyles, sizeStyles, transitionStyles } from '@os-design/styles';
-import { clr } from '@os-design/theming';
-import { omitEmotionProps, useForwardedState } from '@os-design/utils';
-import React, { forwardRef } from 'react';
-const uncheckedIconStyles = p => !p.checked && css`
-    background-color: ${clr(p.theme.checkboxUncheckedColorBg)};
-    border-color: ${clr(p.theme.checkboxUncheckedColorBorder)};
-  `;
-const checkedIconStyles = p => p.checked && css`
-    background-color: ${clr(p.theme.checkboxCheckedColorBg)};
-    border-color: ${clr(p.theme.checkboxCheckedColorBg)};
-  `;
-const disabledIconStyles = p => p.disabled && css`
-    background-color: ${clr(p.theme.checkboxDisabledColorBg)};
-    color: ${clr(p.theme.checkboxDisabledColorIcon)};
-    border-color: ${clr(p.theme.checkboxDisabledColorBorder)};
-  `;
-const IconContainer = styled('span', omitEmotionProps('disabled', 'checked'))`
-  width: ${p => p.theme.checkboxSize}em;
-  height: ${p => p.theme.checkboxSize}em;
-  min-width: ${p => p.theme.checkboxSize}em;
-  min-height: ${p => p.theme.checkboxSize}em;
-
-  display: flex;
-  justify-content: center;
-  align-items: center;
-
-  box-sizing: border-box;
-  line-height: 1;
-
-  border: 1px solid transparent;
-  border-radius: ${p => p.theme.borderRadius}em;
-  color: ${p => clr(p.theme.checkboxCheckedColorIcon)};
-  margin-top: ${p => (p.theme.lineHeight - p.theme.checkboxSize) / 2}em;
-
-  ${uncheckedIconStyles};
-  ${checkedIconStyles};
-  ${disabledIconStyles};
-  ${transitionStyles('background-color', 'color', 'border-color')};
-`;
-const hoverUncheckedIconStyles = p => !p.checked && css`
-    background-color: ${clr(p.theme.checkboxUncheckedColorBgHover)};
-  `;
-const hoverCheckedIconStyles = p => p.checked && css`
-    background-color: ${clr(p.theme.checkboxCheckedColorBgHover)};
-    border-color: ${clr(p.theme.checkboxCheckedColorBgHover)};
-  `;
-const hoverStyles = p => !p.disabled && css`
-    @media (hover: hover) {
-      &:hover,
-      &:focus {
-        & > span {
-          ${hoverUncheckedIconStyles(p)};
-          ${hoverCheckedIconStyles(p)};
-        }
-      }
-    }
-  `;
-const disabledContainerStyles = p => p.disabled && css`
-    cursor: not-allowed;
-  `;
-const Container = styled('label', omitEmotionProps('disabled', 'size', 'checked'))`
-  ${resetFocusStyles};
-  cursor: pointer;
-  user-select: none;
-
-  display: flex;
-  margin: ${p => p.theme.checkboxVerticalIndent}em 0;
-
-  ${hoverStyles};
-  ${disabledContainerStyles};
-  ${sizeStyles};
-  ${transitionStyles('color')};
-`;
-const disabledTextStyles = p => p.disabled && css`
-    color: ${clr(p.theme.checkboxDisabledColorText)};
-  `;
-const Text = styled('div', omitEmotionProps('disabled'))`
-  margin-left: 0.4em;
-  color: ${p => clr(p.theme.colorText)};
-  ${disabledTextStyles};
-`;
-
-/**
- * The checkbox that can be enabled or disabled.
- */
-const Checkbox = /*#__PURE__*/forwardRef(({
-  disabled = false,
-  value,
-  defaultValue,
-  onChange = () => {},
-  size,
-  onKeyDown = () => {},
-  onMouseDown = () => {},
-  children,
-  ...rest
-}, ref) => {
-  const [forwardedValue, setForwardedValue] = useForwardedState({
-    value,
-    defaultValue,
-    onChange
-  });
-  return /*#__PURE__*/React.createElement(Container, _extends({
-    disabled: disabled,
-    checked: forwardedValue,
-    size: size,
-    tabIndex: !disabled ? 0 : -1,
-    onClick: () => {
-      if (disabled) return;
-      setForwardedValue(!forwardedValue);
-    },
-    onKeyDown: e => {
-      if (disabled) return;
-      if (['Enter', ' '].includes(e.key)) {
-        setForwardedValue(!forwardedValue);
-        e.preventDefault();
-      }
-      onKeyDown(e);
-    },
-    onMouseDown: e => {
-      onMouseDown(e);
-      e.preventDefault();
-    },
-    role: "checkbox",
-    "aria-checked": forwardedValue,
-    "aria-disabled": disabled
-  }, rest, {
-    ref: ref
-  }), /*#__PURE__*/React.createElement(IconContainer, {
-    disabled: disabled,
-    checked: forwardedValue
-  }, forwardedValue && /*#__PURE__*/React.createElement(Check, null)), children && /*#__PURE__*/React.createElement(Text, {
-    disabled: disabled
-  }, children));
-});
-Checkbox.displayName = 'Checkbox';
-export default Checkbox;
-//# sourceMappingURL=index.js.map

package/dist/esm/Checkbox/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["css","styled","Check","resetFocusStyles","sizeStyles","transitionStyles","clr","omitEmotionProps","useForwardedState","React","forwardRef","uncheckedIconStyles","p","checked","theme","checkboxUncheckedColorBg","checkboxUncheckedColorBorder","checkedIconStyles","checkboxCheckedColorBg","disabledIconStyles","disabled","checkboxDisabledColorBg","checkboxDisabledColorIcon","checkboxDisabledColorBorder","IconContainer","checkboxSize","borderRadius","checkboxCheckedColorIcon","lineHeight","hoverUncheckedIconStyles","checkboxUncheckedColorBgHover","hoverCheckedIconStyles","checkboxCheckedColorBgHover","hoverStyles","disabledContainerStyles","Container","checkboxVerticalIndent","disabledTextStyles","checkboxDisabledColorText","Text","colorText","Checkbox","value","defaultValue","onChange","size","onKeyDown","onMouseDown","children","rest","ref","forwardedValue","setForwardedValue","createElement","_extends","tabIndex","onClick","e","includes","key","preventDefault","role","displayName"],"sources":["../../../src/Checkbox/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { Check } from '@os-design/icons';\nimport {\n  resetFocusStyles,\n  sizeStyles,\n  transitionStyles,\n  WithSize,\n} from '@os-design/styles';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps, useForwardedState } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\n\ntype JsxLabelProps = Omit<\n  JSX.IntrinsicElements['label'],\n  'defaultValue' | 'onChange' | 'onClick' | 'ref'\n>;\nexport interface CheckboxProps extends JsxLabelProps, WithSize {\n  /**\n   * Whether the checkbox is disabled.\n   * @default false\n   */\n  disabled?: boolean;\n  /**\n   * Whether the checkbox is checked.\n   * @default false\n   */\n  value?: boolean;\n  /**\n   * The default value.\n   * @default undefined\n   */\n  defaultValue?: boolean;\n  /**\n   * The change event handler.\n   * @default undefined\n   */\n  onChange?: (value: boolean) => void;\n}\n\nconst uncheckedIconStyles = (p) =>\n  !p.checked &&\n  css`\n    background-color: ${clr(p.theme.checkboxUncheckedColorBg)};\n    border-color: ${clr(p.theme.checkboxUncheckedColorBorder)};\n  `;\n\nconst checkedIconStyles = (p) =>\n  p.checked &&\n  css`\n    background-color: ${clr(p.theme.checkboxCheckedColorBg)};\n    border-color: ${clr(p.theme.checkboxCheckedColorBg)};\n  `;\n\nconst disabledIconStyles = (p) =>\n  p.disabled &&\n  css`\n    background-color: ${clr(p.theme.checkboxDisabledColorBg)};\n    color: ${clr(p.theme.checkboxDisabledColorIcon)};\n    border-color: ${clr(p.theme.checkboxDisabledColorBorder)};\n  `;\n\ninterface IconContainerProps extends Required<Pick<CheckboxProps, 'disabled'>> {\n  checked: Required<CheckboxProps['value']>;\n}\nconst IconContainer = styled(\n  'span',\n  omitEmotionProps('disabled', 'checked')\n)<IconContainerProps>`\n  width: ${(p) => p.theme.checkboxSize}em;\n  height: ${(p) => p.theme.checkboxSize}em;\n  min-width: ${(p) => p.theme.checkboxSize}em;\n  min-height: ${(p) => p.theme.checkboxSize}em;\n\n  display: flex;\n  justify-content: center;\n  align-items: center;\n\n  box-sizing: border-box;\n  line-height: 1;\n\n  border: 1px solid transparent;\n  border-radius: ${(p) => p.theme.borderRadius}em;\n  color: ${(p) => clr(p.theme.checkboxCheckedColorIcon)};\n  margin-top: ${(p) => (p.theme.lineHeight - p.theme.checkboxSize) / 2}em;\n\n  ${uncheckedIconStyles};\n  ${checkedIconStyles};\n  ${disabledIconStyles};\n  ${transitionStyles('background-color', 'color', 'border-color')};\n`;\n\nconst hoverUncheckedIconStyles = (p) =>\n  !p.checked &&\n  css`\n    background-color: ${clr(p.theme.checkboxUncheckedColorBgHover)};\n  `;\n\nconst hoverCheckedIconStyles = (p) =>\n  p.checked &&\n  css`\n    background-color: ${clr(p.theme.checkboxCheckedColorBgHover)};\n    border-color: ${clr(p.theme.checkboxCheckedColorBgHover)};\n  `;\n\nconst hoverStyles = (p) =>\n  !p.disabled &&\n  css`\n    @media (hover: hover) {\n      &:hover,\n      &:focus {\n        & > span {\n          ${hoverUncheckedIconStyles(p)};\n          ${hoverCheckedIconStyles(p)};\n        }\n      }\n    }\n  `;\n\nconst disabledContainerStyles = (p) =>\n  p.disabled &&\n  css`\n    cursor: not-allowed;\n  `;\n\ninterface ContainerProps\n  extends Required<Pick<CheckboxProps, 'disabled'>>,\n    Pick<CheckboxProps, 'size'> {\n  checked: Required<CheckboxProps['value']>;\n}\nconst Container = styled(\n  'label',\n  omitEmotionProps('disabled', 'size', 'checked')\n)<ContainerProps>`\n  ${resetFocusStyles};\n  cursor: pointer;\n  user-select: none;\n\n  display: flex;\n  margin: ${(p) => p.theme.checkboxVerticalIndent}em 0;\n\n  ${hoverStyles};\n  ${disabledContainerStyles};\n  ${sizeStyles};\n  ${transitionStyles('color')};\n`;\n\nconst disabledTextStyles = (p) =>\n  p.disabled &&\n  css`\n    color: ${clr(p.theme.checkboxDisabledColorText)};\n  `;\n\ntype TextProps = Required<Pick<CheckboxProps, 'disabled'>>;\nconst Text = styled('div', omitEmotionProps('disabled'))<TextProps>`\n  margin-left: 0.4em;\n  color: ${(p) => clr(p.theme.colorText)};\n  ${disabledTextStyles};\n`;\n\n/**\n * The checkbox that can be enabled or disabled.\n */\nconst Checkbox = forwardRef<HTMLLabelElement, CheckboxProps>(\n  (\n    {\n      disabled = false,\n      value,\n      defaultValue,\n      onChange = () => {},\n      size,\n      onKeyDown = () => {},\n      onMouseDown = () => {},\n      children,\n      ...rest\n    },\n    ref\n  ) => {\n    const [forwardedValue, setForwardedValue] = useForwardedState({\n      value,\n      defaultValue,\n      onChange,\n    });\n\n    return (\n      <Container\n        disabled={disabled}\n        checked={forwardedValue}\n        size={size}\n        tabIndex={!disabled ? 0 : -1}\n        onClick={() => {\n          if (disabled) return;\n          setForwardedValue(!forwardedValue);\n        }}\n        onKeyDown={(e) => {\n          if (disabled) return;\n          if (['Enter', ' '].includes(e.key)) {\n            setForwardedValue(!forwardedValue);\n            e.preventDefault();\n          }\n          onKeyDown(e);\n        }}\n        onMouseDown={(e) => {\n          onMouseDown(e);\n          e.preventDefault();\n        }}\n        role='checkbox'\n        aria-checked={forwardedValue}\n        aria-disabled={disabled}\n        {...rest}\n        ref={ref}\n      >\n        <IconContainer disabled={disabled} checked={forwardedValue}>\n          {forwardedValue && <Check />}\n        </IconContainer>\n\n        {children && <Text disabled={disabled}>{children}</Text>}\n      </Container>\n    );\n  }\n);\n\nCheckbox.displayName = 'Checkbox';\n\nexport default Checkbox;\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/CheckboxSkeleton/index.js

@@ -1,50 +0,0 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import styled from '@emotion/styled';
-import { sizeStyles } from '@os-design/styles';
-import { clr } from '@os-design/theming';
-import { omitEmotionProps } from '@os-design/utils';
-import React, { forwardRef } from 'react';
-import Skeleton from '../Skeleton';
-const Container = styled('div', omitEmotionProps('size'))`
-  user-select: none;
-  display: flex;
-  margin: ${p => p.theme.checkboxVerticalIndent}em 0;
-  ${sizeStyles};
-`;
-const ImageSkeleton = styled(Skeleton)`
-  width: ${p => p.theme.checkboxSize}em;
-  height: ${p => p.theme.checkboxSize}em;
-  min-width: ${p => p.theme.checkboxSize}em;
-  min-height: ${p => p.theme.checkboxSize}em;
-
-  border-radius: ${p => p.theme.borderRadius}em;
-  margin-top: ${p => (p.theme.lineHeight - p.theme.checkboxSize) / 2}em;
-`;
-const Text = styled.div`
-  margin-left: 0.4em;
-  color: ${p => clr(p.theme.colorText)};
-`;
-const TextSkeleton = styled(Skeleton)`
-  margin-left: 0.4em;
-  margin-top: ${p => (p.theme.lineHeight - 1) / 2}em;
-  margin-bottom: ${p => (p.theme.lineHeight - 1) / 2}em;
-`;
-
-/**
- * Provides a checkbox placeholder while a user waits for the content to load.
- */
-const CheckboxSkeleton = /*#__PURE__*/forwardRef(({
-  width = '100%',
-  children,
-  ...rest
-}, ref) => /*#__PURE__*/React.createElement(Container, _extends({
-  role: "checkbox",
-  "aria-busy": true
-}, rest, {
-  ref: ref
-}), /*#__PURE__*/React.createElement(ImageSkeleton, null), children ? /*#__PURE__*/React.createElement(Text, null, children) : /*#__PURE__*/React.createElement(TextSkeleton, {
-  width: width
-})));
-CheckboxSkeleton.displayName = 'CheckboxSkeleton';
-export default CheckboxSkeleton;
-//# sourceMappingURL=index.js.map

package/dist/esm/CheckboxSkeleton/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["styled","sizeStyles","clr","omitEmotionProps","React","forwardRef","Skeleton","Container","p","theme","checkboxVerticalIndent","ImageSkeleton","checkboxSize","borderRadius","lineHeight","Text","div","colorText","TextSkeleton","CheckboxSkeleton","width","children","rest","ref","createElement","_extends","role","displayName"],"sources":["../../../src/CheckboxSkeleton/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { sizeStyles, WithSize } from '@os-design/styles';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\nimport Skeleton from '../Skeleton';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface CheckboxSkeletonProps extends JsxDivProps, WithSize {\n  /**\n   * The width of the skeleton.\n   * @default 100%\n   */\n  width?: string;\n}\n\nconst Container = styled('div', omitEmotionProps('size'))<WithSize>`\n  user-select: none;\n  display: flex;\n  margin: ${(p) => p.theme.checkboxVerticalIndent}em 0;\n  ${sizeStyles};\n`;\n\nconst ImageSkeleton = styled(Skeleton)`\n  width: ${(p) => p.theme.checkboxSize}em;\n  height: ${(p) => p.theme.checkboxSize}em;\n  min-width: ${(p) => p.theme.checkboxSize}em;\n  min-height: ${(p) => p.theme.checkboxSize}em;\n\n  border-radius: ${(p) => p.theme.borderRadius}em;\n  margin-top: ${(p) => (p.theme.lineHeight - p.theme.checkboxSize) / 2}em;\n`;\n\nconst Text = styled.div`\n  margin-left: 0.4em;\n  color: ${(p) => clr(p.theme.colorText)};\n`;\n\nconst TextSkeleton = styled(Skeleton)`\n  margin-left: 0.4em;\n  margin-top: ${(p) => (p.theme.lineHeight - 1) / 2}em;\n  margin-bottom: ${(p) => (p.theme.lineHeight - 1) / 2}em;\n`;\n\n/**\n * Provides a checkbox placeholder while a user waits for the content to load.\n */\nconst CheckboxSkeleton = forwardRef<HTMLDivElement, CheckboxSkeletonProps>(\n  ({ width = '100%', children, ...rest }, ref) => (\n    <Container role='checkbox' aria-busy {...rest} ref={ref}>\n      <ImageSkeleton />\n      {children ? <Text>{children}</Text> : <TextSkeleton width={width} />}\n    </Container>\n  )\n);\n\nCheckboxSkeleton.displayName = 'CheckboxSkeleton';\n\nexport default CheckboxSkeleton;\n"],"mappings":";AAAA,OAAOA,MAAM,MAAM,iBAAiB;AACpC,SAASC,UAAU,QAAkB,mBAAmB;AACxD,SAASC,GAAG,QAAQ,oBAAoB;AACxC,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,QAAQ,MAAM,aAAa;AAWlC,MAAMC,SAAS,GAAGP,MAAM,CAAC,KAAK,EAAEG,gBAAgB,CAAC,MAAM,CAAC,CAAW;AACnE;AACA;AACA,YAAaK,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACC,sBAAsB;AACjD,IAAIT,UAAU;AACd,CAAC;AAED,MAAMU,aAAa,GAAGX,MAAM,CAACM,QAAQ,CAAC;AACtC,WAAYE,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACG,YAAY;AACtC,YAAaJ,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACG,YAAY;AACvC,eAAgBJ,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACG,YAAY;AAC1C,gBAAiBJ,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACG,YAAY;AAC3C;AACA,mBAAoBJ,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACI,YAAY;AAC9C,gBAAiBL,CAAC,IAAK,CAACA,CAAC,CAACC,KAAK,CAACK,UAAU,GAAGN,CAAC,CAACC,KAAK,CAACG,YAAY,IAAI,CAAC;AACtE,CAAC;AAED,MAAMG,IAAI,GAAGf,MAAM,CAACgB,GAAG;AACvB;AACA,WAAYR,CAAC,IAAKN,GAAG,CAACM,CAAC,CAACC,KAAK,CAACQ,SAAS,CAAC;AACxC,CAAC;AAED,MAAMC,YAAY,GAAGlB,MAAM,CAACM,QAAQ,CAAC;AACrC;AACA,gBAAiBE,CAAC,IAAK,CAACA,CAAC,CAACC,KAAK,CAACK,UAAU,GAAG,CAAC,IAAI,CAAC;AACnD,mBAAoBN,CAAC,IAAK,CAACA,CAAC,CAACC,KAAK,CAACK,UAAU,GAAG,CAAC,IAAI,CAAC;AACtD,CAAC;;AAED;AACA;AACA;AACA,MAAMK,gBAAgB,gBAAGd,UAAU,CACjC,CAAC;EAAEe,KAAK,GAAG,MAAM;EAAEC,QAAQ;EAAE,GAAGC;AAAK,CAAC,EAAEC,GAAG,kBACzCnB,KAAA,CAAAoB,aAAA,CAACjB,SAAS,EAAAkB,QAAA;EAACC,IAAI,EAAC,UAAU;EAAC;AAAS,GAAKJ,IAAI;EAAEC,GAAG,EAAEA;AAAI,iBACtDnB,KAAA,CAAAoB,aAAA,CAACb,aAAa,MAAE,CAAC,EAChBU,QAAQ,gBAAGjB,KAAA,CAAAoB,aAAA,CAACT,IAAI,QAAEM,QAAe,CAAC,gBAAGjB,KAAA,CAAAoB,aAAA,CAACN,YAAY;EAACE,KAAK,EAAEA;AAAM,CAAE,CAC1D,CAEf,CAAC;AAEDD,gBAAgB,CAACQ,WAAW,GAAG,kBAAkB;AAEjD,eAAeR,gBAAgB","ignoreList":[]}

package/dist/esm/DatePicker/DatePickerCalendar.js

@@ -1,164 +0,0 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import styled from '@emotion/styled';
-import { getAccessibilityDateLabel, useDatePickerCalendar } from '@os-design/date-picker-utils';
-import { Left, Right } from '@os-design/icons';
-import { ellipsisStyles, resetFocusStyles, transitionStyles } from '@os-design/styles';
-import { clr } from '@os-design/theming';
-import React, { useCallback, useEffect, useRef } from 'react';
-import Button from '../Button';
-const MonthContainer = styled.div`
-  display: flex;
-  align-items: center;
-  margin-bottom: 0.5em;
-`;
-const Month = styled.div`
-  flex-grow: 1;
-  font-weight: 500;
-  text-align: center;
-  padding: 0 0.4em;
-  ${ellipsisStyles};
-`;
-const Calendar = styled.div`
-  display: grid;
-  grid-template-columns: repeat(7, ${p => p.theme.datePickerCellSize}em);
-  grid-auto-rows: ${p => p.theme.datePickerCellSize}em;
-  justify-content: space-between;
-  overflow-x: auto;
-`;
-const DayOfWeek = styled.div`
-  justify-self: center;
-  align-self: center;
-  color: ${p => clr(p.theme.datePickerDayOfWeekColorText)};
-  font-size: ${p => p.theme.sizes.small}em;
-`;
-const Day = styled.div`
-  ${resetFocusStyles};
-  justify-self: center;
-  align-self: center;
-
-  width: ${p => p.theme.datePickerDaySize}em;
-  height: ${p => p.theme.datePickerDaySize}em;
-
-  display: flex;
-  justify-content: center;
-  align-items: center;
-
-  border-radius: ${p => p.theme.borderRadius}em;
-  cursor: pointer;
-
-  @media (hover: hover) {
-    &:hover,
-    &:focus {
-      background-color: ${p => clr(p.theme.datePickerDayColorBgHover)};
-      color: ${p => clr(p.theme.datePickerDayColorTextHover)};
-    }
-  }
-
-  ${transitionStyles('background-color', 'color')};
-`;
-const DayAnotherMonth = styled(Day)`
-  color: ${p => clr(p.theme.datePickerDayAnotherMonthColorText)};
-`;
-const Today = styled(Day)`
-  background-color: ${p => clr(p.theme.datePickerTodayColorBg)};
-  color: ${p => clr(p.theme.datePickerTodayColorText)};
-  border: 1px solid ${p => clr(p.theme.datePickerTodayColorBorder)};
-  box-sizing: border-box;
-`;
-const SelectedDay = styled(Day)`
-  background-color: ${p => clr(p.theme.datePickerSelectedDayColorBg)};
-  color: ${p => clr(p.theme.datePickerSelectedDayColorText)};
-`;
-const DayInRange = styled(Day)`
-  background-color: ${p => clr([...p.theme.colorText.slice(0, 3), (p.theme.colorText[3] || 1) * 0.05])};
-`;
-const firstDayOfWeekIndexesMap = {
-  monday: [6, 0, 1, 2, 3, 4, 5],
-  saturday: [1, 2, 3, 4, 5, 6, 0],
-  sunday: [0, 1, 2, 3, 4, 5, 6]
-};
-const DatePickerCalendar = ({
-  firstDayOfWeek,
-  locale,
-  value,
-  onSelect = () => {}
-}) => {
-  const valueRef = useRef(value);
-  useEffect(() => {
-    valueRef.current = value;
-  }, [value]);
-  const onSelectRef = useRef(onSelect);
-  useEffect(() => {
-    onSelectRef.current = onSelect;
-  }, [onSelect]);
-  const {
-    selectedMonth,
-    updateMonth,
-    days
-  } = useDatePickerCalendar({
-    value,
-    firstDayOfWeek
-  });
-  const getDayProps = useCallback(date => ({
-    tabIndex: 0,
-    role: 'button',
-    'aria-label': getAccessibilityDateLabel(date, locale),
-    onClick: () => {
-      onSelectRef.current(date);
-    },
-    onKeyDown: e => {
-      if (['Enter', ' '].includes(e.key)) {
-        onSelectRef.current(date);
-        e.preventDefault();
-      }
-    },
-    onMouseDown: e => e.preventDefault()
-  }), [locale]);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(MonthContainer, null, /*#__PURE__*/React.createElement(Button, {
-    type: "ghost",
-    wide: "never",
-    size: "small",
-    onClick: () => updateMonth(-1),
-    "aria-label": locale.prevMonthLabel
-  }, /*#__PURE__*/React.createElement(Left, null)), /*#__PURE__*/React.createElement(Month, null, locale.months[selectedMonth.month], " ", selectedMonth.year), /*#__PURE__*/React.createElement(Button, {
-    type: "ghost",
-    wide: "never",
-    size: "small",
-    onClick: () => updateMonth(1),
-    "aria-label": locale.nextMonthLabel
-  }, /*#__PURE__*/React.createElement(Right, null))), /*#__PURE__*/React.createElement(Calendar, null, Array(7).fill(0).map((_, index) => {
-    const item = firstDayOfWeekIndexesMap[firstDayOfWeek][index];
-    return /*#__PURE__*/React.createElement(DayOfWeek, {
-      key: item
-    }, item);
-  }), days.map(({
-    type,
-    date
-  }) => {
-    if (type === 'dayAnotherMonth') {
-      return /*#__PURE__*/React.createElement(DayAnotherMonth, _extends({
-        key: date.toISOString()
-      }, getDayProps(date)), date.getDate());
-    }
-    if (type === 'selectedDay') {
-      return /*#__PURE__*/React.createElement(SelectedDay, _extends({
-        key: date.toISOString()
-      }, getDayProps(date)), date.getDate());
-    }
-    if (type === 'dayInRange') {
-      return /*#__PURE__*/React.createElement(DayInRange, _extends({
-        key: date.toISOString()
-      }, getDayProps(date)), date.getDate());
-    }
-    if (type === 'today') {
-      return /*#__PURE__*/React.createElement(Today, _extends({
-        key: date.toISOString()
-      }, getDayProps(date)), date.getDate());
-    }
-    return /*#__PURE__*/React.createElement(Day, _extends({
-      key: date.toISOString()
-    }, getDayProps(date)), date.getDate());
-  })));
-};
-export default DatePickerCalendar;
-//# sourceMappingURL=DatePickerCalendar.js.map

package/dist/esm/DatePicker/DatePickerCalendar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DatePickerCalendar.js","names":["styled","getAccessibilityDateLabel","useDatePickerCalendar","Left","Right","ellipsisStyles","resetFocusStyles","transitionStyles","clr","React","useCallback","useEffect","useRef","Button","MonthContainer","div","Month","Calendar","p","theme","datePickerCellSize","DayOfWeek","datePickerDayOfWeekColorText","sizes","small","Day","datePickerDaySize","borderRadius","datePickerDayColorBgHover","datePickerDayColorTextHover","DayAnotherMonth","datePickerDayAnotherMonthColorText","Today","datePickerTodayColorBg","datePickerTodayColorText","datePickerTodayColorBorder","SelectedDay","datePickerSelectedDayColorBg","datePickerSelectedDayColorText","DayInRange","colorText","slice","firstDayOfWeekIndexesMap","monday","saturday","sunday","DatePickerCalendar","firstDayOfWeek","locale","value","onSelect","valueRef","current","onSelectRef","selectedMonth","updateMonth","days","getDayProps","date","tabIndex","role","onClick","onKeyDown","e","includes","key","preventDefault","onMouseDown","createElement","Fragment","type","wide","size","prevMonthLabel","months","month","year","nextMonthLabel","Array","fill","map","_","index","item","_extends","toISOString","getDate"],"sources":["../../../src/DatePicker/DatePickerCalendar.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport {\n  DatePickerLocale,\n  getAccessibilityDateLabel,\n  useDatePickerCalendar,\n} from '@os-design/date-picker-utils';\nimport { Left, Right } from '@os-design/icons';\nimport {\n  ellipsisStyles,\n  resetFocusStyles,\n  transitionStyles,\n} from '@os-design/styles';\nimport { Color, clr } from '@os-design/theming';\nimport React, { HTMLAttributes, useCallback, useEffect, useRef } from 'react';\nimport Button from '../Button';\n\ninterface DatePickerCalendarProps {\n  firstDayOfWeek: 'monday' | 'saturday' | 'sunday';\n  locale: DatePickerLocale;\n  value?: Date | [Date, Date] | null;\n  onSelect?: (value: Date) => void;\n}\n\nconst MonthContainer = styled.div`\n  display: flex;\n  align-items: center;\n  margin-bottom: 0.5em;\n`;\n\nconst Month = styled.div`\n  flex-grow: 1;\n  font-weight: 500;\n  text-align: center;\n  padding: 0 0.4em;\n  ${ellipsisStyles};\n`;\n\nconst Calendar = styled.div`\n  display: grid;\n  grid-template-columns: repeat(7, ${(p) => p.theme.datePickerCellSize}em);\n  grid-auto-rows: ${(p) => p.theme.datePickerCellSize}em;\n  justify-content: space-between;\n  overflow-x: auto;\n`;\n\nconst DayOfWeek = styled.div`\n  justify-self: center;\n  align-self: center;\n  color: ${(p) => clr(p.theme.datePickerDayOfWeekColorText)};\n  font-size: ${(p) => p.theme.sizes.small}em;\n`;\n\nconst Day = styled.div`\n  ${resetFocusStyles};\n  justify-self: center;\n  align-self: center;\n\n  width: ${(p) => p.theme.datePickerDaySize}em;\n  height: ${(p) => p.theme.datePickerDaySize}em;\n\n  display: flex;\n  justify-content: center;\n  align-items: center;\n\n  border-radius: ${(p) => p.theme.borderRadius}em;\n  cursor: pointer;\n\n  @media (hover: hover) {\n    &:hover,\n    &:focus {\n      background-color: ${(p) => clr(p.theme.datePickerDayColorBgHover)};\n      color: ${(p) => clr(p.theme.datePickerDayColorTextHover)};\n    }\n  }\n\n  ${transitionStyles('background-color', 'color')};\n`;\n\nconst DayAnotherMonth = styled(Day)`\n  color: ${(p) => clr(p.theme.datePickerDayAnotherMonthColorText)};\n`;\n\nconst Today = styled(Day)`\n  background-color: ${(p) => clr(p.theme.datePickerTodayColorBg)};\n  color: ${(p) => clr(p.theme.datePickerTodayColorText)};\n  border: 1px solid ${(p) => clr(p.theme.datePickerTodayColorBorder)};\n  box-sizing: border-box;\n`;\n\nconst SelectedDay = styled(Day)`\n  background-color: ${(p) => clr(p.theme.datePickerSelectedDayColorBg)};\n  color: ${(p) => clr(p.theme.datePickerSelectedDayColorText)};\n`;\n\nconst DayInRange = styled(Day)`\n  background-color: ${(p) =>\n    clr([\n      ...p.theme.colorText.slice(0, 3),\n      (p.theme.colorText[3] || 1) * 0.05,\n    ] as Color)};\n`;\n\nconst firstDayOfWeekIndexesMap = {\n  monday: [6, 0, 1, 2, 3, 4, 5],\n  saturday: [1, 2, 3, 4, 5, 6, 0],\n  sunday: [0, 1, 2, 3, 4, 5, 6],\n};\n\nconst DatePickerCalendar: React.FC<DatePickerCalendarProps> = ({\n  firstDayOfWeek,\n  locale,\n  value,\n  onSelect = () => {},\n}) => {\n  const valueRef = useRef(value);\n  useEffect(() => {\n    valueRef.current = value;\n  }, [value]);\n\n  const onSelectRef = useRef(onSelect);\n  useEffect(() => {\n    onSelectRef.current = onSelect;\n  }, [onSelect]);\n\n  const { selectedMonth, updateMonth, days } = useDatePickerCalendar({\n    value,\n    firstDayOfWeek,\n  });\n\n  const getDayProps = useCallback<\n    (date: Date) => HTMLAttributes<HTMLDivElement>\n  >(\n    (date: Date) => ({\n      tabIndex: 0,\n      role: 'button',\n      'aria-label': getAccessibilityDateLabel(date, locale),\n      onClick: () => {\n        onSelectRef.current(date);\n      },\n      onKeyDown: (e) => {\n        if (['Enter', ' '].includes(e.key)) {\n          onSelectRef.current(date);\n          e.preventDefault();\n        }\n      },\n      onMouseDown: (e) => e.preventDefault(),\n    }),\n    [locale]\n  );\n\n  return (\n    <>\n      <MonthContainer>\n        <Button\n          type='ghost'\n          wide='never'\n          size='small'\n          onClick={() => updateMonth(-1)}\n          aria-label={locale.prevMonthLabel}\n        >\n          <Left />\n        </Button>\n        <Month>\n          {locale.months[selectedMonth.month]} {selectedMonth.year}\n        </Month>\n        <Button\n          type='ghost'\n          wide='never'\n          size='small'\n          onClick={() => updateMonth(1)}\n          aria-label={locale.nextMonthLabel}\n        >\n          <Right />\n        </Button>\n      </MonthContainer>\n\n      <Calendar>\n        {Array(7)\n          .fill(0)\n          .map((_, index) => {\n            const item = firstDayOfWeekIndexesMap[firstDayOfWeek][index];\n            return <DayOfWeek key={item}>{item}</DayOfWeek>;\n          })}\n\n        {days.map(({ type, date }) => {\n          if (type === 'dayAnotherMonth') {\n            return (\n              <DayAnotherMonth key={date.toISOString()} {...getDayProps(date)}>\n                {date.getDate()}\n              </DayAnotherMonth>\n            );\n          }\n          if (type === 'selectedDay') {\n            return (\n              <SelectedDay key={date.toISOString()} {...getDayProps(date)}>\n                {date.getDate()}\n              </SelectedDay>\n            );\n          }\n          if (type === 'dayInRange') {\n            return (\n              <DayInRange key={date.toISOString()} {...getDayProps(date)}>\n                {date.getDate()}\n              </DayInRange>\n            );\n          }\n          if (type === 'today') {\n            return (\n              <Today key={date.toISOString()} {...getDayProps(date)}>\n                {date.getDate()}\n              </Today>\n            );\n          }\n          return (\n            <Day key={date.toISOString()} {...getDayProps(date)}>\n              {date.getDate()}\n            </Day>\n          );\n        })}\n      </Calendar>\n    </>\n  );\n};\n\nexport default DatePickerCalendar;\n"],"mappings":"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","ignoreList":[]}