@os-design/core 1.0.254 → 1.0.256

package/dist/esm/Avatar/utils/strToHue.js

@@ -1,13 +0,0 @@
-/**
- * Return the hue of the color by string.
- */
-const strToHue = str => {
-  let hash = 0;
-  for (let i = 0; i < str.length; i += 1) {
-    // eslint-disable-next-line no-bitwise
-    hash = str.charCodeAt(i) + ((hash << 5) - hash);
-  }
-  return hash % 360;
-};
-export default strToHue;
-//# sourceMappingURL=strToHue.js.map

package/dist/esm/Avatar/utils/strToHue.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"strToHue.js","names":["strToHue","str","hash","i","length","charCodeAt"],"sources":["../../../../src/Avatar/utils/strToHue.ts"],"sourcesContent":["/**\n * Return the hue of the color by string.\n */\nconst strToHue = (str: string): number => {\n  let hash = 0;\n  for (let i = 0; i < str.length; i += 1) {\n    // eslint-disable-next-line no-bitwise\n    hash = str.charCodeAt(i) + ((hash << 5) - hash);\n  }\n  return hash % 360;\n};\n\nexport default strToHue;\n"],"mappings":"AAAA;AACA;AACA;AACA,MAAMA,QAAQ,GAAIC,GAAW,IAAa;EACxC,IAAIC,IAAI,GAAG,CAAC;EACZ,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGF,GAAG,CAACG,MAAM,EAAED,CAAC,IAAI,CAAC,EAAE;IACtC;IACAD,IAAI,GAAGD,GAAG,CAACI,UAAU,CAACF,CAAC,CAAC,IAAI,CAACD,IAAI,IAAI,CAAC,IAAIA,IAAI,CAAC;EACjD;EACA,OAAOA,IAAI,GAAG,GAAG;AACnB,CAAC;AAED,eAAeF,QAAQ","ignoreList":[]}

package/dist/esm/AvatarSkeleton/index.js

@@ -1,26 +0,0 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-import styled from '@emotion/styled';
-import { sizeStyles } from '@os-design/styles';
-import { omitEmotionProps } from '@os-design/utils';
-import React, { forwardRef } from 'react';
-import Skeleton from '../Skeleton';
-const Container = styled('div', omitEmotionProps('size'))`
-  ${sizeStyles};
-`;
-
-/**
- * Provides an avatar placeholder while a user waits for the content to load.
- */
-const AvatarSkeleton = /*#__PURE__*/forwardRef(({
-  size = '2em',
-  ...rest
-}, ref) => /*#__PURE__*/React.createElement(Container, _extends({
-  size: size
-}, rest, {
-  ref: ref
-}), /*#__PURE__*/React.createElement(Skeleton, {
-  width: "1em"
-})));
-AvatarSkeleton.displayName = 'AvatarSkeleton';
-export default AvatarSkeleton;
-//# sourceMappingURL=index.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["styled","sizeStyles","omitEmotionProps","React","forwardRef","Skeleton","Container","AvatarSkeleton","size","rest","ref","createElement","_extends","width","displayName"],"sources":["../../../src/AvatarSkeleton/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { sizeStyles, WithSize } from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\nimport Skeleton from '../Skeleton';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport type AvatarSkeletonProps = JsxDivProps & WithSize;\n\nconst Container = styled('div', omitEmotionProps('size'))<WithSize>`\n  ${sizeStyles};\n`;\n\n/**\n * Provides an avatar placeholder while a user waits for the content to load.\n */\nconst AvatarSkeleton = forwardRef<HTMLDivElement, AvatarSkeletonProps>(\n  ({ size = '2em', ...rest }, ref) => (\n    <Container size={size} {...rest} ref={ref}>\n      <Skeleton width='1em' />\n    </Container>\n  )\n);\n\nAvatarSkeleton.displayName = 'AvatarSkeleton';\n\nexport default AvatarSkeleton;\n"],"mappings":";AAAA,OAAOA,MAAM,MAAM,iBAAiB;AACpC,SAASC,UAAU,QAAkB,mBAAmB;AACxD,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,QAAQ,MAAM,aAAa;AAKlC,MAAMC,SAAS,GAAGN,MAAM,CAAC,KAAK,EAAEE,gBAAgB,CAAC,MAAM,CAAC,CAAY;AACpE,IAAID,UAAW;AACf,CAAC;;AAED;AACA;AACA;AACA,MAAMM,cAAc,gBAAGH,UAAU,CAC/B,CAAC;EAAEI,IAAI,GAAG,KAAK;EAAE,GAAGC;AAAK,CAAC,EAAEC,GAAG,kBAC7BP,KAAA,CAAAQ,aAAA,CAACL,SAAS,EAAAM,QAAA;EAACJ,IAAI,EAAEA;AAAK,GAAKC,IAAI;EAAEC,GAAG,EAAEA;AAAI,iBACxCP,KAAA,CAAAQ,aAAA,CAACN,QAAQ;EAACQ,KAAK,EAAC;AAAK,CAAE,CACd,CAEf,CAAC;AAEDN,cAAc,CAACO,WAAW,GAAG,gBAAgB;AAE7C,eAAeP,cAAc","ignoreList":[]}

package/dist/esm/Badge/index.js

@@ -1,68 +0,0 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, 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, useMemo } from 'react';
-const Container = styled.div`
-  position: relative;
-  display: flex;
-`;
-const HEIGHT_EM = 1.5;
-const Sized = styled('div', omitEmotionProps('size'))`
-  ${sizeStyles};
-`;
-const Value = styled('div', omitEmotionProps('top', 'right'))`
-  position: absolute;
-  top: ${p => p.top};
-  right: ${p => p.right};
-  transform: translate(50%, -50%);
-
-  height: ${HEIGHT_EM}em;
-  min-width: ${HEIGHT_EM}em;
-  padding: 0 0.3em;
-  border-radius: ${HEIGHT_EM / 2}em;
-  box-sizing: border-box;
-
-  display: flex;
-  justify-content: center;
-  align-items: center;
-
-  background-color: ${p => clr(p.theme.badgeColorBg)};
-  color: ${p => clr(p.theme.badgeColorText)};
-  border: 1px solid ${p => clr(p.theme.colorBg)};
-
-  font-size: ${p => p.theme.sizes.small}em;
-  font-weight: 500;
-  line-height: 1;
-`;
-const Plus = styled.div`
-  font-size: ${p => p.theme.sizes.small}em;
-  padding-bottom: 2px;
-`;
-
-/**
- * The number shown in the corner. Used to show the number of notifications.
- */
-const Badge = /*#__PURE__*/forwardRef(({
-  count,
-  max = 99,
-  showZero = false,
-  offset = '0',
-  size = '1em',
-  children,
-  ...rest
-}, ref) => {
-  const [top, right] = useMemo(() => Array.isArray(offset) ? offset : [offset, offset], [offset]);
-  return count === undefined || count < 0 || count === 0 && !showZero ? children : /*#__PURE__*/React.createElement(Container, _extends({}, rest, {
-    ref: ref
-  }), children, /*#__PURE__*/React.createElement(Sized, {
-    size: size
-  }, /*#__PURE__*/React.createElement(Value, {
-    top: top,
-    right: right
-  }, count > max ? /*#__PURE__*/React.createElement(React.Fragment, null, max, /*#__PURE__*/React.createElement(Plus, null, "+")) : count)));
-});
-Badge.displayName = 'Badge';
-export default Badge;
-//# sourceMappingURL=index.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["styled","sizeStyles","clr","omitEmotionProps","React","forwardRef","useMemo","Container","div","HEIGHT_EM","Sized","Value","p","top","right","theme","badgeColorBg","badgeColorText","colorBg","sizes","small","Plus","Badge","count","max","showZero","offset","size","children","rest","ref","Array","isArray","undefined","createElement","_extends","Fragment","displayName"],"sources":["../../../src/Badge/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { WithSize, sizeStyles } from '@os-design/styles';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef, useMemo } from 'react';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface BadgeProps extends JsxDivProps, WithSize {\n  /**\n   * Number shown in the corner.\n   * @default undefined\n   */\n  count?: number;\n  /**\n   * The max number.\n   * @default 99\n   */\n  max?: number;\n  /**\n   * Whether the zero is shown.\n   * @default false\n   */\n  showZero?: boolean;\n  /**\n   * Offset of the badge.\n   * top/right | [top, right]\n   * @default undefined\n   */\n  offset?: string | [string, string];\n}\n\nconst Container = styled.div`\n  position: relative;\n  display: flex;\n`;\n\nconst HEIGHT_EM = 1.5;\n\nconst Sized = styled('div', omitEmotionProps('size'))<WithSize>`\n  ${sizeStyles};\n`;\n\ninterface ValueProps {\n  top: string;\n  right: string;\n}\nconst Value = styled('div', omitEmotionProps('top', 'right'))<ValueProps>`\n  position: absolute;\n  top: ${(p) => p.top};\n  right: ${(p) => p.right};\n  transform: translate(50%, -50%);\n\n  height: ${HEIGHT_EM}em;\n  min-width: ${HEIGHT_EM}em;\n  padding: 0 0.3em;\n  border-radius: ${HEIGHT_EM / 2}em;\n  box-sizing: border-box;\n\n  display: flex;\n  justify-content: center;\n  align-items: center;\n\n  background-color: ${(p) => clr(p.theme.badgeColorBg)};\n  color: ${(p) => clr(p.theme.badgeColorText)};\n  border: 1px solid ${(p) => clr(p.theme.colorBg)};\n\n  font-size: ${(p) => p.theme.sizes.small}em;\n  font-weight: 500;\n  line-height: 1;\n`;\n\nconst Plus = styled.div`\n  font-size: ${(p) => p.theme.sizes.small}em;\n  padding-bottom: 2px;\n`;\n\n/**\n * The number shown in the corner. Used to show the number of notifications.\n */\nconst Badge = forwardRef<HTMLDivElement, BadgeProps>(\n  (\n    {\n      count,\n      max = 99,\n      showZero = false,\n      offset = '0',\n      size = '1em',\n      children,\n      ...rest\n    },\n    ref\n  ) => {\n    const [top, right] = useMemo(\n      () => (Array.isArray(offset) ? offset : [offset, offset]),\n      [offset]\n    );\n\n    return count === undefined || count < 0 || (count === 0 && !showZero) ? (\n      children\n    ) : (\n      <Container {...rest} ref={ref}>\n        {children}\n\n        <Sized size={size}>\n          <Value top={top} right={right}>\n            {count > max ? (\n              <>\n                {max}\n                <Plus>+</Plus>\n              </>\n            ) : (\n              count\n            )}\n          </Value>\n        </Sized>\n      </Container>\n    );\n  }\n);\n\nBadge.displayName = 'Badge';\n\nexport default Badge;\n"],"mappings":";AAAA,OAAOA,MAAM,MAAM,iBAAiB;AACpC,SAAmBC,UAAU,QAAQ,mBAAmB;AACxD,SAASC,GAAG,QAAQ,oBAAoB;AACxC,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,IAAIC,UAAU,EAAEC,OAAO,QAAQ,OAAO;AA2BlD,MAAMC,SAAS,GAAGP,MAAM,CAACQ,GAAI;AAC7B;AACA;AACA,CAAC;AAED,MAAMC,SAAS,GAAG,GAAG;AAErB,MAAMC,KAAK,GAAGV,MAAM,CAAC,KAAK,EAAEG,gBAAgB,CAAC,MAAM,CAAC,CAAY;AAChE,IAAIF,UAAW;AACf,CAAC;AAMD,MAAMU,KAAK,GAAGX,MAAM,CAAC,KAAK,EAAEG,gBAAgB,CAAC,KAAK,EAAE,OAAO,CAAC,CAAc;AAC1E;AACA,SAAUS,CAAC,IAAKA,CAAC,CAACC,GAAI;AACtB,WAAYD,CAAC,IAAKA,CAAC,CAACE,KAAM;AAC1B;AACA;AACA,YAAYL,SAAU;AACtB,eAAeA,SAAU;AACzB;AACA,mBAAmBA,SAAS,GAAG,CAAE;AACjC;AACA;AACA;AACA;AACA;AACA;AACA,sBAAuBG,CAAC,IAAKV,GAAG,CAACU,CAAC,CAACG,KAAK,CAACC,YAAY,CAAE;AACvD,WAAYJ,CAAC,IAAKV,GAAG,CAACU,CAAC,CAACG,KAAK,CAACE,cAAc,CAAE;AAC9C,sBAAuBL,CAAC,IAAKV,GAAG,CAACU,CAAC,CAACG,KAAK,CAACG,OAAO,CAAE;AAClD;AACA,eAAgBN,CAAC,IAAKA,CAAC,CAACG,KAAK,CAACI,KAAK,CAACC,KAAM;AAC1C;AACA;AACA,CAAC;AAED,MAAMC,IAAI,GAAGrB,MAAM,CAACQ,GAAI;AACxB,eAAgBI,CAAC,IAAKA,CAAC,CAACG,KAAK,CAACI,KAAK,CAACC,KAAM;AAC1C;AACA,CAAC;;AAED;AACA;AACA;AACA,MAAME,KAAK,gBAAGjB,UAAU,CACtB,CACE;EACEkB,KAAK;EACLC,GAAG,GAAG,EAAE;EACRC,QAAQ,GAAG,KAAK;EAChBC,MAAM,GAAG,GAAG;EACZC,IAAI,GAAG,KAAK;EACZC,QAAQ;EACR,GAAGC;AACL,CAAC,EACDC,GAAG,KACA;EACH,MAAM,CAACjB,GAAG,EAAEC,KAAK,CAAC,GAAGR,OAAO,CAC1B,MAAOyB,KAAK,CAACC,OAAO,CAACN,MAAM,CAAC,GAAGA,MAAM,GAAG,CAACA,MAAM,EAAEA,MAAM,CAAE,EACzD,CAACA,MAAM,CACT,CAAC;EAED,OAAOH,KAAK,KAAKU,SAAS,IAAIV,KAAK,GAAG,CAAC,IAAKA,KAAK,KAAK,CAAC,IAAI,CAACE,QAAS,GACnEG,QAAQ,gBAERxB,KAAA,CAAA8B,aAAA,CAAC3B,SAAS,EAAA4B,QAAA,KAAKN,IAAI;IAAEC,GAAG,EAAEA;EAAI,IAC3BF,QAAQ,eAETxB,KAAA,CAAA8B,aAAA,CAACxB,KAAK;IAACiB,IAAI,EAAEA;EAAK,gBAChBvB,KAAA,CAAA8B,aAAA,CAACvB,KAAK;IAACE,GAAG,EAAEA,GAAI;IAACC,KAAK,EAAEA;EAAM,GAC3BS,KAAK,GAAGC,GAAG,gBACVpB,KAAA,CAAA8B,aAAA,CAAA9B,KAAA,CAAAgC,QAAA,QACGZ,GAAG,eACJpB,KAAA,CAAA8B,aAAA,CAACb,IAAI,QAAC,GAAO,CACb,CAAC,GAEHE,KAEG,CACF,CACE,CACZ;AACH,CACF,CAAC;AAEDD,KAAK,CAACe,WAAW,GAAG,OAAO;AAE3B,eAAef,KAAK","ignoreList":[]}

package/dist/esm/Breadcrumb/index.js

@@ -1,69 +0,0 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-import styled from '@emotion/styled';
-import { enableScrollingStyles, sizeStyles } from '@os-design/styles';
-import { clr } from '@os-design/theming';
-import { omitEmotionProps } from '@os-design/utils';
-import React, { forwardRef, useMemo } from 'react';
-import BreadcrumbItem from '../BreadcrumbItem';
-const Container = styled('ol', omitEmotionProps('size'))`
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  display: flex;
-  align-items: center;
-  color: ${p => clr(p.theme.colorText)};
-
-  ${enableScrollingStyles('x', false)};
-  ${sizeStyles};
-`;
-let childIndex = 0;
-
-/**
- * Displays the current location within the hierarchical structure.
- * Implements the Schema.org markup for breadcrumbs.
- * See https://schema.org/BreadcrumbList
- */
-const Breadcrumb = /*#__PURE__*/forwardRef(({
-  'aria-label': ariaLabel = 'Breadcrumb',
-  children,
-  ...rest
-}, ref) => {
-  const breadcrumbItems = useMemo(() => {
-    const items = [];
-    const childrenArray = React.Children.toArray(children);
-    childrenArray.forEach((child, index) => {
-      if (! /*#__PURE__*/React.isValidElement(child)) return;
-      let element;
-      const breadcrumbItemProps = {
-        key: childIndex,
-        position: index + 1,
-        hasRightArrow: index < childrenArray.length - 1
-      };
-      if (child.type === BreadcrumbItem) {
-        element = /*#__PURE__*/React.cloneElement(child, breadcrumbItemProps);
-      } else if ( /*#__PURE__*/React.isValidElement(child.props.children) && child.props.children.type === BreadcrumbItem) {
-        const breadcrumbItem = /*#__PURE__*/React.cloneElement(child.props.children, breadcrumbItemProps);
-        element = /*#__PURE__*/React.cloneElement(child, {
-          ...(child.props || {}),
-          key: childIndex
-        }, breadcrumbItem);
-      }
-      if (!element) return;
-      items.push(element);
-      childIndex += 1;
-    });
-    return items;
-  }, [children]);
-  if (breadcrumbItems.length === 0) return null;
-  return /*#__PURE__*/React.createElement("nav", {
-    "aria-label": ariaLabel
-  }, /*#__PURE__*/React.createElement(Container, _extends({
-    itemScope: true,
-    itemType: "https://schema.org/BreadcrumbList"
-  }, rest, {
-    ref: ref
-  }), breadcrumbItems));
-});
-Breadcrumb.displayName = 'Breadcrumb';
-export default Breadcrumb;
-//# sourceMappingURL=index.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["styled","enableScrollingStyles","sizeStyles","clr","omitEmotionProps","React","forwardRef","useMemo","BreadcrumbItem","Container","p","theme","colorText","childIndex","Breadcrumb","ariaLabel","children","rest","ref","breadcrumbItems","items","childrenArray","Children","toArray","forEach","child","index","isValidElement","element","breadcrumbItemProps","key","position","hasRightArrow","length","type","cloneElement","props","breadcrumbItem","push","createElement","_extends","itemScope","itemType","displayName"],"sources":["../../../src/Breadcrumb/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { enableScrollingStyles, sizeStyles, WithSize } from '@os-design/styles';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef, ReactElement, useMemo } from 'react';\nimport BreadcrumbItem from '../BreadcrumbItem';\n\ntype JsxOlProps = Omit<JSX.IntrinsicElements['ol'], 'ref'>;\nexport interface BreadcrumbProps extends JsxOlProps, WithSize {\n  'aria-label'?: string;\n}\n\nconst Container = styled('ol', omitEmotionProps('size'))<WithSize>`\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  align-items: center;\n  color: ${(p) => clr(p.theme.colorText)};\n\n  ${enableScrollingStyles('x', false)};\n  ${sizeStyles};\n`;\n\nlet childIndex = 0;\n\n/**\n * Displays the current location within the hierarchical structure.\n * Implements the Schema.org markup for breadcrumbs.\n * See https://schema.org/BreadcrumbList\n */\nconst Breadcrumb = forwardRef<HTMLOListElement, BreadcrumbProps>(\n  ({ 'aria-label': ariaLabel = 'Breadcrumb', children, ...rest }, ref) => {\n    const breadcrumbItems = useMemo(() => {\n      const items: ReactElement[] = [];\n      const childrenArray = React.Children.toArray(children);\n      childrenArray.forEach((child, index) => {\n        if (!React.isValidElement(child)) return;\n\n        let element;\n        const breadcrumbItemProps = {\n          key: childIndex,\n          position: index + 1,\n          hasRightArrow: index < childrenArray.length - 1,\n        };\n\n        if (child.type === BreadcrumbItem) {\n          element = React.cloneElement(child, breadcrumbItemProps);\n        } else if (\n          React.isValidElement(child.props.children) &&\n          child.props.children.type === BreadcrumbItem\n        ) {\n          const breadcrumbItem = React.cloneElement(\n            child.props.children,\n            breadcrumbItemProps\n          );\n          element = React.cloneElement(\n            child,\n            {\n              ...(child.props || {}),\n              key: childIndex,\n            },\n            breadcrumbItem\n          );\n        }\n        if (!element) return;\n\n        items.push(element);\n        childIndex += 1;\n      });\n      return items;\n    }, [children]);\n\n    if (breadcrumbItems.length === 0) return null;\n\n    return (\n      <nav aria-label={ariaLabel}>\n        <Container\n          itemScope\n          itemType='https://schema.org/BreadcrumbList'\n          {...rest}\n          ref={ref}\n        >\n          {breadcrumbItems}\n        </Container>\n      </nav>\n    );\n  }\n);\n\nBreadcrumb.displayName = 'Breadcrumb';\n\nexport default Breadcrumb;\n"],"mappings":";AAAA,OAAOA,MAAM,MAAM,iBAAiB;AACpC,SAASC,qBAAqB,EAAEC,UAAU,QAAkB,mBAAmB;AAC/E,SAASC,GAAG,QAAQ,oBAAoB;AACxC,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,IAAIC,UAAU,EAAgBC,OAAO,QAAQ,OAAO;AAChE,OAAOC,cAAc,MAAM,mBAAmB;AAO9C,MAAMC,SAAS,GAAGT,MAAM,CAAC,IAAI,EAAEI,gBAAgB,CAAC,MAAM,CAAC,CAAY;AACnE;AACA;AACA;AACA;AACA;AACA,WAAYM,CAAC,IAAKP,GAAG,CAACO,CAAC,CAACC,KAAK,CAACC,SAAS,CAAE;AACzC;AACA,IAAIX,qBAAqB,CAAC,GAAG,EAAE,KAAK,CAAE;AACtC,IAAIC,UAAW;AACf,CAAC;AAED,IAAIW,UAAU,GAAG,CAAC;;AAElB;AACA;AACA;AACA;AACA;AACA,MAAMC,UAAU,gBAAGR,UAAU,CAC3B,CAAC;EAAE,YAAY,EAAES,SAAS,GAAG,YAAY;EAAEC,QAAQ;EAAE,GAAGC;AAAK,CAAC,EAAEC,GAAG,KAAK;EACtE,MAAMC,eAAe,GAAGZ,OAAO,CAAC,MAAM;IACpC,MAAMa,KAAqB,GAAG,EAAE;IAChC,MAAMC,aAAa,GAAGhB,KAAK,CAACiB,QAAQ,CAACC,OAAO,CAACP,QAAQ,CAAC;IACtDK,aAAa,CAACG,OAAO,CAAC,CAACC,KAAK,EAAEC,KAAK,KAAK;MACtC,IAAI,eAACrB,KAAK,CAACsB,cAAc,CAACF,KAAK,CAAC,EAAE;MAElC,IAAIG,OAAO;MACX,MAAMC,mBAAmB,GAAG;QAC1BC,GAAG,EAAEjB,UAAU;QACfkB,QAAQ,EAAEL,KAAK,GAAG,CAAC;QACnBM,aAAa,EAAEN,KAAK,GAAGL,aAAa,CAACY,MAAM,GAAG;MAChD,CAAC;MAED,IAAIR,KAAK,CAACS,IAAI,KAAK1B,cAAc,EAAE;QACjCoB,OAAO,gBAAGvB,KAAK,CAAC8B,YAAY,CAACV,KAAK,EAAEI,mBAAmB,CAAC;MAC1D,CAAC,MAAM,IACL,cAAAxB,KAAK,CAACsB,cAAc,CAACF,KAAK,CAACW,KAAK,CAACpB,QAAQ,CAAC,IAC1CS,KAAK,CAACW,KAAK,CAACpB,QAAQ,CAACkB,IAAI,KAAK1B,cAAc,EAC5C;QACA,MAAM6B,cAAc,gBAAGhC,KAAK,CAAC8B,YAAY,CACvCV,KAAK,CAACW,KAAK,CAACpB,QAAQ,EACpBa,mBACF,CAAC;QACDD,OAAO,gBAAGvB,KAAK,CAAC8B,YAAY,CAC1BV,KAAK,EACL;UACE,IAAIA,KAAK,CAACW,KAAK,IAAI,CAAC,CAAC,CAAC;UACtBN,GAAG,EAAEjB;QACP,CAAC,EACDwB,cACF,CAAC;MACH;MACA,IAAI,CAACT,OAAO,EAAE;MAEdR,KAAK,CAACkB,IAAI,CAACV,OAAO,CAAC;MACnBf,UAAU,IAAI,CAAC;IACjB,CAAC,CAAC;IACF,OAAOO,KAAK;EACd,CAAC,EAAE,CAACJ,QAAQ,CAAC,CAAC;EAEd,IAAIG,eAAe,CAACc,MAAM,KAAK,CAAC,EAAE,OAAO,IAAI;EAE7C,oBACE5B,KAAA,CAAAkC,aAAA;IAAK,cAAYxB;EAAU,gBACzBV,KAAA,CAAAkC,aAAA,CAAC9B,SAAS,EAAA+B,QAAA;IACRC,SAAS;IACTC,QAAQ,EAAC;EAAmC,GACxCzB,IAAI;IACRC,GAAG,EAAEA;EAAI,IAERC,eACQ,CACR,CAAC;AAEV,CACF,CAAC;AAEDL,UAAU,CAAC6B,WAAW,GAAG,YAAY;AAErC,eAAe7B,UAAU","ignoreList":[]}

package/dist/esm/BreadcrumbItem/index.js

@@ -1,55 +0,0 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-import styled from '@emotion/styled';
-import { Right } from '@os-design/icons';
-import { ellipsisStyles } from '@os-design/styles';
-import { clr } from '@os-design/theming';
-import React, { forwardRef } from 'react';
-import Link from '../Link';
-const Container = styled.li`
-  list-style: none;
-`;
-const Name = styled.span`
-  max-width: 20em;
-  ${ellipsisStyles};
-`;
-const RightIcon = styled(Right)`
-  color: ${p => clr(p.theme.colorText)};
-  margin: 0 0.6em;
-  font-size: 0.6em;
-  opacity: 0.8;
-`;
-
-/**
- * The item of the breadcrumb.
- */
-const BreadcrumbItem = /*#__PURE__*/forwardRef(({
-  currentPage = false,
-  hasRightArrow = false,
-  position,
-  href,
-  children,
-  ...rest
-}, ref) => /*#__PURE__*/React.createElement(Container, null, /*#__PURE__*/React.createElement(Link, _extends({
-  itemProp: "itemListElement",
-  itemScope: true,
-  itemType: "https://schema.org/ListItem",
-  href: href
-}, currentPage ? {
-  underline: 'always',
-  'aria-current': 'page'
-} : {}, rest, {
-  ref: ref
-}), /*#__PURE__*/React.createElement("link", {
-  itemProp: "item",
-  href: href
-}), position && /*#__PURE__*/React.createElement("meta", {
-  itemProp: "position",
-  content: position.toString()
-}), /*#__PURE__*/React.createElement(Name, {
-  itemProp: "name"
-}, children)), hasRightArrow && /*#__PURE__*/React.createElement(RightIcon, {
-  role: "presentation"
-})));
-BreadcrumbItem.displayName = 'BreadcrumbItem';
-export default BreadcrumbItem;
-//# sourceMappingURL=index.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["styled","Right","ellipsisStyles","clr","React","forwardRef","Link","Container","li","Name","span","RightIcon","p","theme","colorText","BreadcrumbItem","currentPage","hasRightArrow","position","href","children","rest","ref","createElement","_extends","itemProp","itemScope","itemType","underline","content","toString","role","displayName"],"sources":["../../../src/BreadcrumbItem/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { Right } from '@os-design/icons';\nimport { ellipsisStyles } from '@os-design/styles';\nimport { clr } from '@os-design/theming';\nimport React, { forwardRef } from 'react';\nimport Link, { LinkProps } from '../Link';\n\nexport interface BreadcrumbItemProps extends LinkProps {\n  /**\n   * Whether the item is the current page.\n   * @default false\n   */\n  currentPage?: boolean;\n  /**\n   * Whether the right arrow located to the right of the text is visible.\n   * @default false\n   */\n  hasRightArrow?: boolean;\n  /**\n   * The position of the breadcrumb item.\n   * @default undefined\n   */\n  position?: number;\n}\n\nconst Container = styled.li`\n  list-style: none;\n`;\n\nconst Name = styled.span`\n  max-width: 20em;\n  ${ellipsisStyles};\n`;\n\nconst RightIcon = styled(Right)`\n  color: ${(p) => clr(p.theme.colorText)};\n  margin: 0 0.6em;\n  font-size: 0.6em;\n  opacity: 0.8;\n`;\n\n/**\n * The item of the breadcrumb.\n */\nconst BreadcrumbItem = forwardRef<HTMLAnchorElement, BreadcrumbItemProps>(\n  (\n    {\n      currentPage = false,\n      hasRightArrow = false,\n      position,\n      href,\n      children,\n      ...rest\n    },\n    ref\n  ) => (\n    <Container>\n      <Link\n        itemProp='itemListElement'\n        itemScope\n        itemType='https://schema.org/ListItem'\n        href={href}\n        {...(currentPage\n          ? {\n              underline: 'always',\n              'aria-current': 'page',\n            }\n          : {})}\n        {...rest}\n        ref={ref}\n      >\n        <link itemProp='item' href={href} />\n        {position && <meta itemProp='position' content={position.toString()} />}\n        <Name itemProp='name'>{children}</Name>\n      </Link>\n      {hasRightArrow && <RightIcon role='presentation' />}\n    </Container>\n  )\n);\n\nBreadcrumbItem.displayName = 'BreadcrumbItem';\n\nexport default BreadcrumbItem;\n"],"mappings":";AAAA,OAAOA,MAAM,MAAM,iBAAiB;AACpC,SAASC,KAAK,QAAQ,kBAAkB;AACxC,SAASC,cAAc,QAAQ,mBAAmB;AAClD,SAASC,GAAG,QAAQ,oBAAoB;AACxC,OAAOC,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,IAAI,MAAqB,SAAS;AAoBzC,MAAMC,SAAS,GAAGP,MAAM,CAACQ,EAAG;AAC5B;AACA,CAAC;AAED,MAAMC,IAAI,GAAGT,MAAM,CAACU,IAAK;AACzB;AACA,IAAIR,cAAe;AACnB,CAAC;AAED,MAAMS,SAAS,GAAGX,MAAM,CAACC,KAAK,CAAE;AAChC,WAAYW,CAAC,IAAKT,GAAG,CAACS,CAAC,CAACC,KAAK,CAACC,SAAS,CAAE;AACzC;AACA;AACA;AACA,CAAC;;AAED;AACA;AACA;AACA,MAAMC,cAAc,gBAAGV,UAAU,CAC/B,CACE;EACEW,WAAW,GAAG,KAAK;EACnBC,aAAa,GAAG,KAAK;EACrBC,QAAQ;EACRC,IAAI;EACJC,QAAQ;EACR,GAAGC;AACL,CAAC,EACDC,GAAG,kBAEHlB,KAAA,CAAAmB,aAAA,CAAChB,SAAS,qBACRH,KAAA,CAAAmB,aAAA,CAACjB,IAAI,EAAAkB,QAAA;EACHC,QAAQ,EAAC,iBAAiB;EAC1BC,SAAS;EACTC,QAAQ,EAAC,6BAA6B;EACtCR,IAAI,EAAEA;AAAK,GACNH,WAAW,GACZ;EACEY,SAAS,EAAE,QAAQ;EACnB,cAAc,EAAE;AAClB,CAAC,GACD,CAAC,CAAC,EACFP,IAAI;EACRC,GAAG,EAAEA;AAAI,iBAETlB,KAAA,CAAAmB,aAAA;EAAME,QAAQ,EAAC,MAAM;EAACN,IAAI,EAAEA;AAAK,CAAE,CAAC,EACnCD,QAAQ,iBAAId,KAAA,CAAAmB,aAAA;EAAME,QAAQ,EAAC,UAAU;EAACI,OAAO,EAAEX,QAAQ,CAACY,QAAQ,CAAC;AAAE,CAAE,CAAC,eACvE1B,KAAA,CAAAmB,aAAA,CAACd,IAAI;EAACgB,QAAQ,EAAC;AAAM,GAAEL,QAAe,CAClC,CAAC,EACNH,aAAa,iBAAIb,KAAA,CAAAmB,aAAA,CAACZ,SAAS;EAACoB,IAAI,EAAC;AAAc,CAAE,CACzC,CAEf,CAAC;AAEDhB,cAAc,CAACiB,WAAW,GAAG,gBAAgB;AAE7C,eAAejB,cAAc","ignoreList":[]}

package/dist/esm/Button/ButtonContent.js

@@ -1,58 +0,0 @@
-import { keyframes } from '@emotion/react';
-import styled from '@emotion/styled';
-import { Loading } from '@os-design/icons';
-import { clr } from '@os-design/theming';
-import { omitEmotionProps } from '@os-design/utils';
-import React from 'react';
-const LeftAddon = styled.div`
-  display: inherit;
-  padding-right: ${p => p.theme.buttonAddonPaddingHorizontal}em;
-`;
-const RightAddon = styled.div`
-  display: inherit;
-  padding-left: ${p => p.theme.buttonAddonPaddingHorizontal}em;
-`;
-const Content = styled.span`
-  display: inherit;
-
-  & > svg {
-    transform: scale(${p => p.theme.buttonIconScaleFactor});
-    vertical-align: middle;
-  }
-`;
-const LoadingIcon = styled(Loading)`
-  font-size: 1.2em;
-`;
-const loadingFadeIn = keyframes`
-  from { opacity: 0; }
-  to { opacity: 1; }
-`;
-const LoadingContainer = styled('div', omitEmotionProps('colors'))`
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  border-radius: inherit;
-
-  display: flex;
-  justify-content: center;
-  align-items: center;
-
-  color: ${p => clr(p.colors.text)};
-  background-color: ${p => clr(p.colors.bg)};
-  animation: ${loadingFadeIn} ${p => p.theme.transitionDelay}ms;
-`;
-
-// Used by Button, ButtonLink
-const ButtonContent = ({
-  left,
-  right,
-  loading = false,
-  loadingColors,
-  children
-}) => /*#__PURE__*/React.createElement(React.Fragment, null, left && /*#__PURE__*/React.createElement(LeftAddon, null, left), /*#__PURE__*/React.createElement(Content, null, children), right && /*#__PURE__*/React.createElement(RightAddon, null, right), loading && /*#__PURE__*/React.createElement(LoadingContainer, {
-  colors: loadingColors
-}, /*#__PURE__*/React.createElement(LoadingIcon, null)));
-export default ButtonContent;
-//# sourceMappingURL=ButtonContent.js.map

package/dist/esm/Button/ButtonContent.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ButtonContent.js","names":["keyframes","styled","Loading","clr","omitEmotionProps","React","LeftAddon","div","p","theme","buttonAddonPaddingHorizontal","RightAddon","Content","span","buttonIconScaleFactor","LoadingIcon","loadingFadeIn","LoadingContainer","colors","text","bg","transitionDelay","ButtonContent","left","right","loading","loadingColors","children","createElement","Fragment"],"sources":["../../../src/Button/ButtonContent.tsx"],"sourcesContent":["import { keyframes } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { Loading } from '@os-design/icons';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React from 'react';\nimport { LoadingColors } from './utils/useButtonColors';\n\ninterface ButtonContentProps {\n  left?: React.ReactNode;\n  right?: React.ReactNode;\n  loading?: boolean;\n  loadingColors: LoadingColors;\n  children?: React.ReactNode;\n}\n\nconst LeftAddon = styled.div`\n  display: inherit;\n  padding-right: ${(p) => p.theme.buttonAddonPaddingHorizontal}em;\n`;\n\nconst RightAddon = styled.div`\n  display: inherit;\n  padding-left: ${(p) => p.theme.buttonAddonPaddingHorizontal}em;\n`;\n\nconst Content = styled.span`\n  display: inherit;\n\n  & > svg {\n    transform: scale(${(p) => p.theme.buttonIconScaleFactor});\n    vertical-align: middle;\n  }\n`;\n\nconst LoadingIcon = styled(Loading)`\n  font-size: 1.2em;\n`;\n\nconst loadingFadeIn = keyframes`\n  from { opacity: 0; }\n  to { opacity: 1; }\n`;\n\ninterface LoadingContainerProps {\n  colors: LoadingColors;\n}\nconst LoadingContainer = styled(\n  'div',\n  omitEmotionProps('colors')\n)<LoadingContainerProps>`\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  border-radius: inherit;\n\n  display: flex;\n  justify-content: center;\n  align-items: center;\n\n  color: ${(p) => clr(p.colors.text)};\n  background-color: ${(p) => clr(p.colors.bg)};\n  animation: ${loadingFadeIn} ${(p) => p.theme.transitionDelay}ms;\n`;\n\n// Used by Button, ButtonLink\nconst ButtonContent: React.FC<ButtonContentProps> = ({\n  left,\n  right,\n  loading = false,\n  loadingColors,\n  children,\n}) => (\n  <>\n    {left && <LeftAddon>{left}</LeftAddon>}\n    <Content>{children}</Content>\n    {right && <RightAddon>{right}</RightAddon>}\n    {loading && (\n      <LoadingContainer colors={loadingColors}>\n        <LoadingIcon />\n      </LoadingContainer>\n    )}\n  </>\n);\n\nexport default ButtonContent;\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,gBAAgB;AAC1C,OAAOC,MAAM,MAAM,iBAAiB;AACpC,SAASC,OAAO,QAAQ,kBAAkB;AAC1C,SAASC,GAAG,QAAQ,oBAAoB;AACxC,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,OAAOC,KAAK,MAAM,OAAO;AAWzB,MAAMC,SAAS,GAAGL,MAAM,CAACM,GAAI;AAC7B;AACA,mBAAoBC,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACC,4BAA6B;AAC/D,CAAC;AAED,MAAMC,UAAU,GAAGV,MAAM,CAACM,GAAI;AAC9B;AACA,kBAAmBC,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACC,4BAA6B;AAC9D,CAAC;AAED,MAAME,OAAO,GAAGX,MAAM,CAACY,IAAK;AAC5B;AACA;AACA;AACA,uBAAwBL,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACK,qBAAsB;AAC5D;AACA;AACA,CAAC;AAED,MAAMC,WAAW,GAAGd,MAAM,CAACC,OAAO,CAAE;AACpC;AACA,CAAC;AAED,MAAMc,aAAa,GAAGhB,SAAU;AAChC;AACA;AACA,CAAC;AAKD,MAAMiB,gBAAgB,GAAGhB,MAAM,CAC7B,KAAK,EACLG,gBAAgB,CAAC,QAAQ,CAC3B,CAAyB;AACzB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,WAAYI,CAAC,IAAKL,GAAG,CAACK,CAAC,CAACU,MAAM,CAACC,IAAI,CAAE;AACrC,sBAAuBX,CAAC,IAAKL,GAAG,CAACK,CAAC,CAACU,MAAM,CAACE,EAAE,CAAE;AAC9C,eAAeJ,aAAc,IAAIR,CAAC,IAAKA,CAAC,CAACC,KAAK,CAACY,eAAgB;AAC/D,CAAC;;AAED;AACA,MAAMC,aAA2C,GAAGA,CAAC;EACnDC,IAAI;EACJC,KAAK;EACLC,OAAO,GAAG,KAAK;EACfC,aAAa;EACbC;AACF,CAAC,kBACCtB,KAAA,CAAAuB,aAAA,CAAAvB,KAAA,CAAAwB,QAAA,QACGN,IAAI,iBAAIlB,KAAA,CAAAuB,aAAA,CAACtB,SAAS,QAAEiB,IAAgB,CAAC,eACtClB,KAAA,CAAAuB,aAAA,CAAChB,OAAO,QAAEe,QAAkB,CAAC,EAC5BH,KAAK,iBAAInB,KAAA,CAAAuB,aAAA,CAACjB,UAAU,QAAEa,KAAkB,CAAC,EACzCC,OAAO,iBACNpB,KAAA,CAAAuB,aAAA,CAACX,gBAAgB;EAACC,MAAM,EAAEQ;AAAc,gBACtCrB,KAAA,CAAAuB,aAAA,CAACb,WAAW,MAAE,CACE,CAEpB,CACH;AAED,eAAeO,aAAa","ignoreList":[]}

package/dist/esm/Button/index.js

@@ -1,133 +0,0 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-import { css } from '@emotion/react';
-import styled from '@emotion/styled';
-import { m } from '@os-design/media';
-import { resetButtonStyles, sizeStyles, transitionStyles } from '@os-design/styles';
-import { clr } from '@os-design/theming';
-import { omitEmotionProps } from '@os-design/utils';
-import React, { forwardRef } from 'react';
-import ButtonContent from './ButtonContent';
-import useButtonColors from './utils/useButtonColors';
-
-// Used by Button, ButtonLink
-
-const hoverStyles = p => !p.disabled && css`
-    @media (hover: hover) {
-      &:hover,
-      &:focus {
-        background-color: ${clr(p.colors.bgHover)};
-      }
-    }
-  `;
-const primaryStyles = p => p.btnType === 'primary' && css`
-    color: ${clr(p.colors.text)};
-    background-color: ${clr(p.colors.bg)};
-    ${hoverStyles(p)};
-  `;
-const ghostStyles = p => p.btnType === 'ghost' && css`
-    color: ${clr(p.colors.text)};
-    background-color: transparent;
-    ${hoverStyles(p)};
-  `;
-const outlineStyles = p => p.btnType === 'outline' && css`
-    color: ${clr(p.colors.text)};
-    background-color: transparent;
-    border: 1px solid currentColor;
-    ${hoverStyles(p)};
-  `;
-const wideDefaultStyles = p => p.wide === 'default' && css`
-    ${m.max.xxs} {
-      width: 100%;
-    }
-  `;
-const wideAlwaysStyles = p => p.wide === 'always' && css`
-    width: 100%;
-  `;
-const disabledStyles = p => p.disabled && css`
-    cursor: not-allowed;
-  `;
-export const StyledButton = styled('button', omitEmotionProps('btnType', 'colors', 'wide', 'loading', 'size'))`
-  ${resetButtonStyles};
-  position: relative; // Because LoadingContainer has an absolute position
-  cursor: pointer;
-  user-select: none;
-  box-sizing: border-box; // Important for ButtonLink
-
-  // Disable multiline
-  white-space: nowrap;
-  overflow: hidden;
-
-  border-radius: ${p => p.theme.borderRadius}em;
-  height: ${p => p.theme.buttonHeight}em;
-  padding: 0 ${p => p.theme.buttonPaddingHorizontal}em;
-
-  // Do not set inline-flex, otherwise the mobile safari cuts off
-  // the bottom border of the button (tested in iPhone 6)
-  display: flex;
-  justify-content: center;
-  align-items: center;
-
-  font-weight: 500;
-  line-height: 1;
-
-  ${primaryStyles};
-  ${outlineStyles};
-  ${ghostStyles};
-
-  ${wideDefaultStyles};
-  ${wideAlwaysStyles};
-
-  ${disabledStyles};
-
-  ${sizeStyles};
-  ${transitionStyles('background-color', 'color')};
-`;
-
-/**
- * Used to trigger the corresponding business logic.
- */
-const Button = /*#__PURE__*/forwardRef(({
-  type = 'primary',
-  danger = false,
-  left,
-  right,
-  wide = 'default',
-  loading = false,
-  disabled = false,
-  size,
-  children,
-  onMouseDown = () => {},
-  ...rest
-}, ref) => {
-  const {
-    buttonColors,
-    loadingColors
-  } = useButtonColors({
-    type,
-    danger,
-    disabled
-  });
-  return /*#__PURE__*/React.createElement(StyledButton, _extends({
-    btnType: type,
-    colors: buttonColors,
-    wide: wide,
-    loading: loading,
-    disabled: disabled || loading,
-    size: size,
-    onMouseDown: e => {
-      onMouseDown(e);
-      e.preventDefault();
-    },
-    "aria-busy": loading
-  }, rest, {
-    ref: ref
-  }), /*#__PURE__*/React.createElement(ButtonContent, {
-    left: left,
-    right: right,
-    loading: loading,
-    loadingColors: loadingColors
-  }, children));
-});
-Button.displayName = 'Button';
-export default Button;
-//# sourceMappingURL=index.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["css","styled","m","resetButtonStyles","sizeStyles","transitionStyles","clr","omitEmotionProps","React","forwardRef","ButtonContent","useButtonColors","hoverStyles","p","disabled","colors","bgHover","primaryStyles","btnType","text","bg","ghostStyles","outlineStyles","wideDefaultStyles","wide","max","xxs","wideAlwaysStyles","disabledStyles","StyledButton","theme","borderRadius","buttonHeight","buttonPaddingHorizontal","Button","type","danger","left","right","loading","size","children","onMouseDown","rest","ref","buttonColors","loadingColors","createElement","_extends","e","preventDefault","displayName"],"sources":["../../../src/Button/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { m } from '@os-design/media';\nimport {\n  resetButtonStyles,\n  sizeStyles,\n  transitionStyles,\n  WithSize,\n} from '@os-design/styles';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\nimport ButtonContent from './ButtonContent';\nimport useButtonColors, { ButtonColors } from './utils/useButtonColors';\n\ntype JsxButtonProps = Omit<\n  JSX.IntrinsicElements['button'],\n  'type' | 'color' | 'ref'\n>;\n\n// Used by Button, ButtonLink\nexport interface BaseButtonProps extends WithSize {\n  /**\n   * Type of button styles.\n   * @default primary\n   */\n  type?: 'primary' | 'outline' | 'ghost';\n  /**\n   * Sets the danger styles.\n   * @default false\n   */\n  danger?: boolean;\n  /**\n   * The component located on the left side.\n   * @default undefined\n   */\n  left?: React.ReactNode;\n  /**\n   * The component located on the right side.\n   * @default undefined\n   */\n  right?: React.ReactNode;\n  /**\n   * Whether the button has full width.\n   * Possible values:\n   * `default` – the button has full width if the screen width is less than xs;\n   * `always` – the button always has full width;\n   * `never` – the button never has full width.\n   * @default default\n   */\n  wide?: 'default' | 'always' | 'never';\n  /**\n   * Shows the loading status and disables the button.\n   * @default false\n   */\n  loading?: boolean;\n  /**\n   * Whether the button is disabled.\n   * @default false\n   */\n  disabled?: boolean;\n}\n\nexport type ButtonProps = JsxButtonProps & BaseButtonProps;\n\ninterface StyledButtonProps\n  extends Pick<ButtonProps, 'wide' | 'loading' | 'disabled' | 'size'> {\n  btnType: ButtonProps['type'];\n  colors: ButtonColors;\n}\n\nconst hoverStyles = (p) =>\n  !p.disabled &&\n  css`\n    @media (hover: hover) {\n      &:hover,\n      &:focus {\n        background-color: ${clr(p.colors.bgHover)};\n      }\n    }\n  `;\n\nconst primaryStyles = (p) =>\n  p.btnType === 'primary' &&\n  css`\n    color: ${clr(p.colors.text)};\n    background-color: ${clr(p.colors.bg)};\n    ${hoverStyles(p)};\n  `;\n\nconst ghostStyles = (p) =>\n  p.btnType === 'ghost' &&\n  css`\n    color: ${clr(p.colors.text)};\n    background-color: transparent;\n    ${hoverStyles(p)};\n  `;\n\nconst outlineStyles = (p) =>\n  p.btnType === 'outline' &&\n  css`\n    color: ${clr(p.colors.text)};\n    background-color: transparent;\n    border: 1px solid currentColor;\n    ${hoverStyles(p)};\n  `;\n\nconst wideDefaultStyles = (p) =>\n  p.wide === 'default' &&\n  css`\n    ${m.max.xxs} {\n      width: 100%;\n    }\n  `;\n\nconst wideAlwaysStyles = (p) =>\n  p.wide === 'always' &&\n  css`\n    width: 100%;\n  `;\n\nconst disabledStyles = (p) =>\n  p.disabled &&\n  css`\n    cursor: not-allowed;\n  `;\n\nexport const StyledButton = styled(\n  'button',\n  omitEmotionProps('btnType', 'colors', 'wide', 'loading', 'size')\n)<StyledButtonProps>`\n  ${resetButtonStyles};\n  position: relative; // Because LoadingContainer has an absolute position\n  cursor: pointer;\n  user-select: none;\n  box-sizing: border-box; // Important for ButtonLink\n\n  // Disable multiline\n  white-space: nowrap;\n  overflow: hidden;\n\n  border-radius: ${(p) => p.theme.borderRadius}em;\n  height: ${(p) => p.theme.buttonHeight}em;\n  padding: 0 ${(p) => p.theme.buttonPaddingHorizontal}em;\n\n  // Do not set inline-flex, otherwise the mobile safari cuts off\n  // the bottom border of the button (tested in iPhone 6)\n  display: flex;\n  justify-content: center;\n  align-items: center;\n\n  font-weight: 500;\n  line-height: 1;\n\n  ${primaryStyles};\n  ${outlineStyles};\n  ${ghostStyles};\n\n  ${wideDefaultStyles};\n  ${wideAlwaysStyles};\n\n  ${disabledStyles};\n\n  ${sizeStyles};\n  ${transitionStyles('background-color', 'color')};\n`;\n\n/**\n * Used to trigger the corresponding business logic.\n */\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      type = 'primary',\n      danger = false,\n      left,\n      right,\n      wide = 'default',\n      loading = false,\n      disabled = false,\n      size,\n      children,\n      onMouseDown = () => {},\n      ...rest\n    },\n    ref\n  ) => {\n    const { buttonColors, loadingColors } = useButtonColors({\n      type,\n      danger,\n      disabled,\n    });\n\n    return (\n      <StyledButton\n        btnType={type}\n        colors={buttonColors}\n        wide={wide}\n        loading={loading}\n        disabled={disabled || loading}\n        size={size}\n        onMouseDown={(e) => {\n          onMouseDown(e);\n          e.preventDefault();\n        }}\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      </StyledButton>\n    );\n  }\n);\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/Button/utils/useButtonColors.js

@@ -1,58 +0,0 @@
-import { useTheme } from '@os-design/theming';
-import { useMemo } from 'react';
-// Used by Button, ButtonLink
-const useButtonColors = ({
-  type,
-  danger,
-  disabled
-}) => {
-  const {
-    theme
-  } = useTheme();
-  const prefix = useMemo(() => {
-    if (danger) return 'Danger';
-    return '';
-  }, [danger]);
-  const buttonColors = useMemo(() => {
-    if (type === 'primary') {
-      return !disabled ? {
-        text: theme[`button${prefix}PrimaryColorText`],
-        bg: theme[`button${prefix}PrimaryColorBg`],
-        bgHover: theme[`button${prefix}PrimaryColorBgHover`]
-      } : {
-        text: theme.buttonDisabledPrimaryColorText,
-        bg: theme.buttonDisabledPrimaryColorBg
-      };
-    }
-    return !disabled ? {
-      text: theme[`button${prefix}GhostColorText`],
-      bgHover: theme[`button${prefix}GhostColorBgHover`]
-    } : {
-      text: theme.buttonDisabledGhostColorText
-    };
-  }, [type, disabled, theme, prefix]);
-  const loadingColors = useMemo(() => {
-    if (disabled) {
-      return {
-        text: theme.buttonDisabledPrimaryColorText,
-        bg: theme.buttonDisabledPrimaryColorBg
-      };
-    }
-    if (type === 'primary') {
-      return {
-        text: theme[`button${prefix}PrimaryColorLoadingText`],
-        bg: theme[`button${prefix}PrimaryColorLoadingBg`]
-      };
-    }
-    return {
-      text: theme[`button${prefix}GhostColorLoadingText`],
-      bg: theme[`button${prefix}GhostColorLoadingBg`]
-    };
-  }, [disabled, type, theme, prefix]);
-  return {
-    buttonColors,
-    loadingColors
-  };
-};
-export default useButtonColors;
-//# sourceMappingURL=useButtonColors.js.map

package/dist/esm/Button/utils/useButtonColors.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useButtonColors.js","names":["useTheme","useMemo","useButtonColors","type","danger","disabled","theme","prefix","buttonColors","text","bg","bgHover","buttonDisabledPrimaryColorText","buttonDisabledPrimaryColorBg","buttonDisabledGhostColorText","loadingColors"],"sources":["../../../../src/Button/utils/useButtonColors.ts"],"sourcesContent":["import { Color, useTheme } from '@os-design/theming';\nimport { useMemo } from 'react';\n\ninterface Props {\n  type: 'primary' | 'outline' | 'ghost';\n  danger: boolean;\n  disabled: boolean;\n}\n\nexport interface ButtonColors {\n  text: Color;\n  bg?: Color;\n  bgHover?: Color;\n}\n\nexport interface LoadingColors {\n  text: Color;\n  bg: Color;\n}\n\ninterface UseButtonColorsRes {\n  buttonColors: ButtonColors;\n  loadingColors: LoadingColors;\n}\n\n// Used by Button, ButtonLink\nconst useButtonColors = ({\n  type,\n  danger,\n  disabled,\n}: Props): UseButtonColorsRes => {\n  const { theme } = useTheme();\n\n  const prefix = useMemo<string>(() => {\n    if (danger) return 'Danger';\n    return '';\n  }, [danger]);\n\n  const buttonColors = useMemo<ButtonColors>(() => {\n    if (type === 'primary') {\n      return !disabled\n        ? {\n            text: theme[`button${prefix}PrimaryColorText`],\n            bg: theme[`button${prefix}PrimaryColorBg`],\n            bgHover: theme[`button${prefix}PrimaryColorBgHover`],\n          }\n        : {\n            text: theme.buttonDisabledPrimaryColorText,\n            bg: theme.buttonDisabledPrimaryColorBg,\n          };\n    }\n    return !disabled\n      ? {\n          text: theme[`button${prefix}GhostColorText`],\n          bgHover: theme[`button${prefix}GhostColorBgHover`],\n        }\n      : {\n          text: theme.buttonDisabledGhostColorText,\n        };\n  }, [type, disabled, theme, prefix]);\n\n  const loadingColors = useMemo<LoadingColors>(() => {\n    if (disabled) {\n      return {\n        text: theme.buttonDisabledPrimaryColorText,\n        bg: theme.buttonDisabledPrimaryColorBg,\n      };\n    }\n    if (type === 'primary') {\n      return {\n        text: theme[`button${prefix}PrimaryColorLoadingText`],\n        bg: theme[`button${prefix}PrimaryColorLoadingBg`],\n      };\n    }\n    return {\n      text: theme[`button${prefix}GhostColorLoadingText`],\n      bg: theme[`button${prefix}GhostColorLoadingBg`],\n    };\n  }, [disabled, type, theme, prefix]);\n\n  return { buttonColors, loadingColors };\n};\n\nexport default useButtonColors;\n"],"mappings":"AAAA,SAAgBA,QAAQ,QAAQ,oBAAoB;AACpD,SAASC,OAAO,QAAQ,OAAO;AAwB/B;AACA,MAAMC,eAAe,GAAGA,CAAC;EACvBC,IAAI;EACJC,MAAM;EACNC;AACK,CAAC,KAAyB;EAC/B,MAAM;IAAEC;EAAM,CAAC,GAAGN,QAAQ,CAAC,CAAC;EAE5B,MAAMO,MAAM,GAAGN,OAAO,CAAS,MAAM;IACnC,IAAIG,MAAM,EAAE,OAAO,QAAQ;IAC3B,OAAO,EAAE;EACX,CAAC,EAAE,CAACA,MAAM,CAAC,CAAC;EAEZ,MAAMI,YAAY,GAAGP,OAAO,CAAe,MAAM;IAC/C,IAAIE,IAAI,KAAK,SAAS,EAAE;MACtB,OAAO,CAACE,QAAQ,GACZ;QACEI,IAAI,EAAEH,KAAK,CAAE,SAAQC,MAAO,kBAAiB,CAAC;QAC9CG,EAAE,EAAEJ,KAAK,CAAE,SAAQC,MAAO,gBAAe,CAAC;QAC1CI,OAAO,EAAEL,KAAK,CAAE,SAAQC,MAAO,qBAAoB;MACrD,CAAC,GACD;QACEE,IAAI,EAAEH,KAAK,CAACM,8BAA8B;QAC1CF,EAAE,EAAEJ,KAAK,CAACO;MACZ,CAAC;IACP;IACA,OAAO,CAACR,QAAQ,GACZ;MACEI,IAAI,EAAEH,KAAK,CAAE,SAAQC,MAAO,gBAAe,CAAC;MAC5CI,OAAO,EAAEL,KAAK,CAAE,SAAQC,MAAO,mBAAkB;IACnD,CAAC,GACD;MACEE,IAAI,EAAEH,KAAK,CAACQ;IACd,CAAC;EACP,CAAC,EAAE,CAACX,IAAI,EAAEE,QAAQ,EAAEC,KAAK,EAAEC,MAAM,CAAC,CAAC;EAEnC,MAAMQ,aAAa,GAAGd,OAAO,CAAgB,MAAM;IACjD,IAAII,QAAQ,EAAE;MACZ,OAAO;QACLI,IAAI,EAAEH,KAAK,CAACM,8BAA8B;QAC1CF,EAAE,EAAEJ,KAAK,CAACO;MACZ,CAAC;IACH;IACA,IAAIV,IAAI,KAAK,SAAS,EAAE;MACtB,OAAO;QACLM,IAAI,EAAEH,KAAK,CAAE,SAAQC,MAAO,yBAAwB,CAAC;QACrDG,EAAE,EAAEJ,KAAK,CAAE,SAAQC,MAAO,uBAAsB;MAClD,CAAC;IACH;IACA,OAAO;MACLE,IAAI,EAAEH,KAAK,CAAE,SAAQC,MAAO,uBAAsB,CAAC;MACnDG,EAAE,EAAEJ,KAAK,CAAE,SAAQC,MAAO,qBAAoB;IAChD,CAAC;EACH,CAAC,EAAE,CAACF,QAAQ,EAAEF,IAAI,EAAEG,KAAK,EAAEC,MAAM,CAAC,CAAC;EAEnC,OAAO;IAAEC,YAAY;IAAEO;EAAc,CAAC;AACxC,CAAC;AAED,eAAeb,eAAe","ignoreList":[]}