@doist/reactist 28.7.2 → 28.7.3

package/es/utils/polymorphism.js

@@ -1,16 +1,15 @@
 import * as React from 'react';
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
-/**
- * A wrapper to use React.forwardRef with polymorphic components in a type-safe manner. This is a
- * convenience over merely using React.forwardRef directly, and then manually forcing the resulting
- * value to be typed using `as PolymorphicComponent<…>`.
- *
- * @deprecated Use Ariakit's composition instead (https://ariakit.org/guide/composition)
+/**
+ * A wrapper to use React.forwardRef with polymorphic components in a type-safe manner. This is a
+ * convenience over merely using React.forwardRef directly, and then manually forcing the resulting
+ * value to be typed using `as PolymorphicComponent<…>`.
+ *
+ * @deprecated Use Ariakit's composition instead (https://ariakit.org/guide/composition)
  */
-
 function polymorphicComponent(render) {
-  return /*#__PURE__*/React.forwardRef(render);
+    return React.forwardRef(render);
 }
 
 export { polymorphicComponent };

package/es/utils/polymorphism.js.map

@@ -1 +1 @@
-{"version":3,"file":"polymorphism.js","sources":["../../src/utils/polymorphism.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n\nimport * as React from 'react'\nimport type { ObfuscatedClassName } from './common-types'\n\ntype Merge<P1, P2> = Omit<P1, keyof P2> & P2\n\ntype EmptyObject = {\n    [K in any]: never\n}\n\ntype ObfuscateClassNameMode = 'keepClassName' | 'obfuscateClassName' | 'omitClassName'\n\n/**\n * If a set of props include the `className` prop, we replace it with a `exceptionallySetClassName`\n * prop instead.\n *\n * This can be customized via the second generic parameter, as there are cases where it may be\n * needed to omit this behaviour and keep the `className`. You can also instruct it to remove the\n * `className` prop while not replacing it with the `exceptionallySetClassName` one.\n *\n * @see ObfuscatedClassName['exceptionallySetClassName'] for details about this prop\n * @see PolymorphicComponent for details about this feature\n */\ntype WithObfuscatedClassName<\n    Props,\n    ShouldObfuscateClassName extends ObfuscateClassNameMode\n> = 'className' extends keyof Props\n    ? ShouldObfuscateClassName extends 'obfuscateClassName'\n        ? Omit<Props, 'className'> & ObfuscatedClassName\n        : ShouldObfuscateClassName extends 'omitClassName'\n        ? Omit<Props, 'className'>\n        : ShouldObfuscateClassName extends 'keepClassName'\n        ? Props\n        : never\n    : Props\n\ntype PolymorphicProp<ComponentType extends React.ElementType> = {\n    /**\n     * Used to instruct this component what React element to render as. It can be both a string\n     * representing a HTML tag name, or a React component.\n     *\n     * When using this prop, the component you apply it to will also recognize in its props types\n     * all the props from the component or HTML element you are rendering it as.\n     *\n     * Some uses for this feature:\n     *\n     * - Using some of our layout components, while at the same time being able to set them to use\n     *   semantic HTML elements needed for accessibility purposes (e.g. `nav`, `main`, etc).\n     * - Using a design system link component, but have it internally use a client-side router link\n     *   implemented via a React component (e.g. react-router's `Link`).\n     *\n     * Keep in mind that not all compositions of this kind may work well, especially when composing\n     * with another React component and not with a HTML tag name. In particular, if the components\n     * being composed have opposing concerns of clashing features (e.g. they have contradicting\n     * styles applied to them) things may not go well. In those cases prefer to nest them instead.\n     *\n     * @see PolymorphicComponent\n     */\n    as?: ComponentType\n}\n\n/**\n * Given a component or element type, and a set of additional props, this builds the entire set of\n * props for a polymorphic component.\n *\n * It does three things:\n *\n * 1. it merges the element type props with the `OwnProps`\n * 2. it adds the `as` prop to allow for polymorphism to happen\n * 3. it optionally obfuscates or omits the className prop if present\n *\n * @see PolymorphicProp\n * @see WithObfuscatedClassName\n */\ntype PolymorphicComponentProps<\n    ComponentType extends React.ElementType,\n    OwnProps,\n    ShouldObfuscateClassName extends ObfuscateClassNameMode\n> = Merge<\n    WithObfuscatedClassName<React.ComponentProps<ComponentType>, ShouldObfuscateClassName>,\n    OwnProps & PolymorphicProp<ComponentType>\n>\n\ntype ElementTagNameMap = HTMLElementTagNameMap &\n    Pick<SVGElementTagNameMap, Exclude<keyof SVGElementTagNameMap, keyof HTMLElementTagNameMap>>\n\ntype ElementByTag<TagName extends keyof ElementTagNameMap> = ElementTagNameMap[TagName]\n\ntype ElementByTagOrAny<\n    ComponentType extends React.ElementType\n> = ComponentType extends keyof ElementTagNameMap ? ElementByTag<ComponentType> : any\n\n/**\n * The function passed to React.forwardRef, but typed in a way that's prepared for polymorphism via\n * the `as` prop. It also allows to specify if the `className` prop should be obfuscated or omitted.\n *\n * @see PolymorphicComponentProps\n * @see WithObfuscatedClassName\n */\ninterface ForwardRefFunction<\n    ComponentType extends React.ElementType,\n    OwnProps,\n    ShouldObfuscateClassName extends ObfuscateClassNameMode\n> {\n    (\n        props: PolymorphicComponentProps<ComponentType, OwnProps, ShouldObfuscateClassName>,\n        ref:\n            | ((instance: ElementByTagOrAny<ComponentType> | null) => void)\n            | React.MutableRefObject<ElementByTagOrAny<ComponentType> | null>\n            | null,\n    ): React.ReactElement | null\n    displayName?: string\n}\n\n/**\n * A component that can customize the React element type that it renders (a.k.a. a polymorphic\n * component). This is achieved by passing a prop `as={ElementType}` or `as=\"html-tag-name\"`.\n *\n * It transparently takes care of forwarding refs, and properly sets the ref type depending on the\n * element type.\n *\n * ## Recognizing props based on the polymorphic type\n *\n * The `ComponentType` argument sets the default type for the `as` prop. Whatever the `as` prop\n * component or HTML element is, the type system will automatically allow you to pass props that are\n * not explicitly defined by you, but that are recognized as valid props to be passed to the\n * component you are rendering.\n *\n * For instance, see the following example:\n *\n * ```jsx\n * <Box as=\"label\" htmlFor=\"field-id\">Hello</Box>\n * ```\n *\n * The `htmlFor` prop is exclusive to label elements. If you omit the `as=\"label\"` prop, the type\n * system will consider the `htmlFor` prop to be an error. The same happens if you pass a value of\n * an incorrect type to such prop. For instance, the example below will issue a type error:\n *\n * ```jsx\n * <Box as=\"label\" htmlFor={123}>Hello</Box>\n * ```\n *\n * ## Omitting or obfuscating the `className` prop\n *\n * If a set of props include the `className` prop, we replace it with a `exceptionallySetClassName`\n * prop instead.\n *\n * This is to discourage customizing design system components via custom styling, while still\n * leaving the door open to do it as an escape hatch when the design system still has shortcomings\n * with respect to the product designs we want to achieve.\n *\n * The cumbersome name also serves the purpose of aiding in easily searching for the places in the\n * code where this escape hatch was needed, in order to identify areas where the design system\n * components need to improve to better match our needs.\n *\n * This behaviour can be customized via an optional second generic argument that allows to disable\n * this feature, or to omit the `className` altogether without replacing it with the obfuscated prop\n * name.\n *\n * @deprecated Use Ariakit's composition instead (https://ariakit.org/guide/composition)\n */\ninterface PolymorphicComponent<\n    ComponentType extends React.ElementType,\n    OwnProps,\n    ShouldObfuscateClassName extends ObfuscateClassNameMode = 'obfuscateClassName'\n> {\n    <TT extends React.ElementType = ComponentType>(\n        props: PolymorphicComponentProps<TT, OwnProps, ShouldObfuscateClassName>,\n    ): React.ReactElement | null\n    readonly $$typeof: symbol\n    defaultProps?: Partial<\n        PolymorphicComponentProps<ComponentType, OwnProps, ShouldObfuscateClassName>\n    >\n    propTypes?: React.WeakValidationMap<\n        PolymorphicComponentProps<ComponentType, OwnProps, ShouldObfuscateClassName>\n    >\n    displayName?: string\n}\n\n/**\n * A wrapper to use React.forwardRef with polymorphic components in a type-safe manner. This is a\n * convenience over merely using React.forwardRef directly, and then manually forcing the resulting\n * value to be typed using `as PolymorphicComponent<…>`.\n *\n * @deprecated Use Ariakit's composition instead (https://ariakit.org/guide/composition)\n */\nfunction polymorphicComponent<\n    ComponentType extends React.ElementType = 'div',\n    OwnProps = EmptyObject,\n    ShouldObfuscateClassName extends ObfuscateClassNameMode = 'obfuscateClassName'\n>(render: ForwardRefFunction<ComponentType, OwnProps, ShouldObfuscateClassName>) {\n    return React.forwardRef(render) as PolymorphicComponent<\n        ComponentType,\n        OwnProps,\n        ShouldObfuscateClassName\n    >\n}\n\nexport type { PolymorphicComponent }\nexport { polymorphicComponent }\n"],"names":["polymorphicComponent","render","React","forwardRef"],"mappings":";;AAAA;AAoLA;;;;;;AAMG;;AACH,SAASA,oBAAT,CAIEC,MAJF,EAI+E;AAC3E,EAAA,oBAAOC,KAAK,CAACC,UAAN,CAAiBF,MAAjB,CAAP,CAAA;AAKH;;;;"}
+{"version":3,"file":"polymorphism.js","sources":["../../src/utils/polymorphism.ts"],"sourcesContent":[null],"names":[],"mappings":";;AAAA;AAoLA;;;;;;AAMG;AACH,SAAS,oBAAoB,CAI3B,MAA6E,EAAA;AAC3E,IAAA,OAAO,KAAK,CAAC,UAAU,CAAC,MAAM,CAI7B,CAAA;AACL;;;;"}

package/es/utils/responsive-props.js

@@ -1,74 +1,65 @@
-const DEBUG = process.env.NODE_ENV === 'development';
-/**
- * Builds a css module class name for a given prop + prop-value combination.
- *
- * We have a convention of building the internal utility-based class names system in a way that
- * resembles the prop for which it is used and the value of the prop. For instance, in a component
- * with a prop `width` with possible values `narrow` and `wide`, we encode the styles for each of
- * these alternatives in the class-names `.width-narrow` and `.width-wide`.
- *
- * Furthermore, this helper is aware of responsive prop values. For instance, if you provide the
- * `width` prop above with the value `['narrow', 'wide']` this returns `['narrow', 'tablet-wide']`.
- * That is, it returns an array of class names, following the same convention above, but also
- * prefixing by the viewport width variant (`tablet-` or `desktop-`).
- *
- * @param styles the class names mapping imported from a css module
- * @param property the prop name
- * @param value the given prop's value
+var DEBUG = process.env.NODE_ENV === 'development';
+/**
+ * Builds a css module class name for a given prop + prop-value combination.
+ *
+ * We have a convention of building the internal utility-based class names system in a way that
+ * resembles the prop for which it is used and the value of the prop. For instance, in a component
+ * with a prop `width` with possible values `narrow` and `wide`, we encode the styles for each of
+ * these alternatives in the class-names `.width-narrow` and `.width-wide`.
+ *
+ * Furthermore, this helper is aware of responsive prop values. For instance, if you provide the
+ * `width` prop above with the value `['narrow', 'wide']` this returns `['narrow', 'tablet-wide']`.
+ * That is, it returns an array of class names, following the same convention above, but also
+ * prefixing by the viewport width variant (`tablet-` or `desktop-`).
+ *
+ * @param styles the class names mapping imported from a css module
+ * @param property the prop name
+ * @param value the given prop's value
  */
-
 function getClassNames(styles, property, value) {
-  if (!value) {
-    return null;
-  }
-
-  const classList = [];
-
-  if (typeof value === 'string') {
-    classList.push(styles[`${property}-${value}`]);
-  } else {
-    if (value.mobile) classList.push(styles[`${property}-${value.mobile}`]);
-    if (value.tablet) classList.push(styles[`tablet-${property}-${value.tablet}`]);
-    if (value.desktop) classList.push(styles[`desktop-${property}-${value.desktop}`]);
-  }
-
-  if (DEBUG && !classList.every(Boolean)) {
-    // eslint-disable-next-line no-console
-    console.warn('Not all generated class names were found', {
-      property,
-      value,
-      classList
-    });
-  }
-
-  return classList;
+    if (!value) {
+        return null;
+    }
+    var classList = [];
+    if (typeof value === 'string') {
+        classList.push(styles["".concat(property, "-").concat(value)]);
+    }
+    else {
+        if (value.mobile)
+            classList.push(styles["".concat(property, "-").concat(value.mobile)]);
+        if (value.tablet)
+            classList.push(styles["tablet-".concat(property, "-").concat(value.tablet)]);
+        if (value.desktop)
+            classList.push(styles["desktop-".concat(property, "-").concat(value.desktop)]);
+    }
+    if (DEBUG && !classList.every(Boolean)) {
+        // eslint-disable-next-line no-console
+        console.warn('Not all generated class names were found', { property: property, value: value, classList: classList });
+    }
+    return classList;
 }
-/**
- * A mapping over a responsive prop value.
- *
- * Since response values can be an object but also a scalar value, this helper makes it easier to
- * to map the values when it's an object but keeps it consistent for the case when it is a scalar
- * value as well.
- *
- * @param fromValue the responsive prop value
- * @param mapper the mapping function
+/**
+ * A mapping over a responsive prop value.
+ *
+ * Since response values can be an object but also a scalar value, this helper makes it easier to
+ * to map the values when it's an object but keeps it consistent for the case when it is a scalar
+ * value as well.
+ *
+ * @param fromValue the responsive prop value
+ * @param mapper the mapping function
  */
-
-
 function mapResponsiveProp(fromValue, mapper) {
-  if (!fromValue) {
-    return undefined;
-  }
-
-  if (typeof fromValue !== 'object') {
-    return mapper(fromValue);
-  }
-
-  return {
-    mobile: fromValue.mobile ? mapper(fromValue.mobile) : undefined,
-    tablet: fromValue.tablet ? mapper(fromValue.tablet) : undefined,
-    desktop: fromValue.desktop ? mapper(fromValue.desktop) : undefined
-  };
+    if (!fromValue) {
+        return undefined;
+    }
+    if (typeof fromValue !== 'object') {
+        return mapper(fromValue);
+    }
+    return {
+        mobile: fromValue.mobile ? mapper(fromValue.mobile) : undefined,
+        tablet: fromValue.tablet ? mapper(fromValue.tablet) : undefined,
+        desktop: fromValue.desktop ? mapper(fromValue.desktop) : undefined
+    };
 }
 
 export { getClassNames, mapResponsiveProp };

package/es/utils/responsive-props.js.map

@@ -1 +1 @@
-{"version":3,"file":"responsive-props.js","sources":["../../src/utils/responsive-props.ts"],"sourcesContent":["type ResponsiveBreakpoints = 'mobile' | 'tablet' | 'desktop'\n\ntype Atom = string | number | boolean\n\n/**\n * A responsive prop supports receiving values of its given base type, or an object mapping a\n * responsive breakpoint name to a value from the prop's base type.\n *\n * Some examples:\n *\n * - `align={{ mobile: 'left', tablet: 'center', desktop: 'right' }}`\n */\ntype ResponsiveProp<AtomType extends Atom> =\n    | AtomType\n    | Readonly<{ [key in ResponsiveBreakpoints]?: AtomType }>\n\nconst DEBUG = process.env.NODE_ENV === 'development'\n\n/**\n * Builds a css module class name for a given prop + prop-value combination.\n *\n * We have a convention of building the internal utility-based class names system in a way that\n * resembles the prop for which it is used and the value of the prop. For instance, in a component\n * with a prop `width` with possible values `narrow` and `wide`, we encode the styles for each of\n * these alternatives in the class-names `.width-narrow` and `.width-wide`.\n *\n * Furthermore, this helper is aware of responsive prop values. For instance, if you provide the\n * `width` prop above with the value `['narrow', 'wide']` this returns `['narrow', 'tablet-wide']`.\n * That is, it returns an array of class names, following the same convention above, but also\n * prefixing by the viewport width variant (`tablet-` or `desktop-`).\n *\n * @param styles the class names mapping imported from a css module\n * @param property the prop name\n * @param value the given prop's value\n */\nfunction getClassNames(\n    styles: Record<string, string>,\n    property: string,\n    value: ResponsiveProp<string> | null | undefined,\n): Array<string | undefined> | null {\n    if (!value) {\n        return null\n    }\n\n    const classList: Array<string | undefined> = []\n\n    if (typeof value === 'string') {\n        classList.push(styles[`${property}-${value}`])\n    } else {\n        if (value.mobile) classList.push(styles[`${property}-${value.mobile}`])\n        if (value.tablet) classList.push(styles[`tablet-${property}-${value.tablet}`])\n        if (value.desktop) classList.push(styles[`desktop-${property}-${value.desktop}`])\n    }\n\n    if (DEBUG && !classList.every(Boolean)) {\n        // eslint-disable-next-line no-console\n        console.warn('Not all generated class names were found', { property, value, classList })\n    }\n\n    return classList\n}\n\n/**\n * A mapping over a responsive prop value.\n *\n * Since response values can be an object but also a scalar value, this helper makes it easier to\n * to map the values when it's an object but keeps it consistent for the case when it is a scalar\n * value as well.\n *\n * @param fromValue the responsive prop value\n * @param mapper the mapping function\n */\nfunction mapResponsiveProp<From extends Atom, To extends Atom>(\n    fromValue: ResponsiveProp<From> | undefined,\n    mapper: (from: From) => To,\n): ResponsiveProp<To> | undefined {\n    if (!fromValue) {\n        return undefined\n    }\n\n    if (typeof fromValue !== 'object') {\n        return mapper(fromValue)\n    }\n\n    return {\n        mobile: fromValue.mobile ? mapper(fromValue.mobile) : undefined,\n        tablet: fromValue.tablet ? mapper(fromValue.tablet) : undefined,\n        desktop: fromValue.desktop ? mapper(fromValue.desktop) : undefined,\n    }\n}\n\nexport type { ResponsiveProp, ResponsiveBreakpoints }\nexport { getClassNames, mapResponsiveProp }\n"],"names":["DEBUG","process","env","NODE_ENV","getClassNames","styles","property","value","classList","push","mobile","tablet","desktop","every","Boolean","console","warn","mapResponsiveProp","fromValue","mapper","undefined"],"mappings":"AAgBA,MAAMA,KAAK,GAAGC,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,aAAvC,CAAA;AAEA;;;;;;;;;;;;;;;;AAgBG;;AACH,SAASC,aAAT,CACIC,MADJ,EAEIC,QAFJ,EAGIC,KAHJ,EAGoD;EAEhD,IAAI,CAACA,KAAL,EAAY;AACR,IAAA,OAAO,IAAP,CAAA;AACH,GAAA;;EAED,MAAMC,SAAS,GAA8B,EAA7C,CAAA;;AAEA,EAAA,IAAI,OAAOD,KAAP,KAAiB,QAArB,EAA+B;IAC3BC,SAAS,CAACC,IAAV,CAAeJ,MAAM,CAAC,GAAGC,QAAQ,CAAA,CAAA,EAAIC,KAAK,CAAA,CAArB,CAArB,CAAA,CAAA;AACH,GAFD,MAEO;AACH,IAAA,IAAIA,KAAK,CAACG,MAAV,EAAkBF,SAAS,CAACC,IAAV,CAAeJ,MAAM,CAAI,GAAAC,QAAY,CAAA,CAAA,EAAAC,KAAK,CAACG,MAAQ,EAA9B,CAArB,CAAA,CAAA;AAClB,IAAA,IAAIH,KAAK,CAACI,MAAV,EAAkBH,SAAS,CAACC,IAAV,CAAeJ,MAAM,CAAW,UAAAC,QAAY,CAAA,CAAA,EAAAC,KAAK,CAACI,MAAQ,EAArC,CAArB,CAAA,CAAA;AAClB,IAAA,IAAIJ,KAAK,CAACK,OAAV,EAAmBJ,SAAS,CAACC,IAAV,CAAeJ,MAAM,CAAY,WAAAC,QAAY,CAAA,CAAA,EAAAC,KAAK,CAACK,OAAS,EAAvC,CAArB,CAAA,CAAA;AACtB,GAAA;;EAED,IAAIZ,KAAK,IAAI,CAACQ,SAAS,CAACK,KAAV,CAAgBC,OAAhB,CAAd,EAAwC;AACpC;AACAC,IAAAA,OAAO,CAACC,IAAR,CAAa,0CAAb,EAAyD;MAAEV,QAAF;MAAYC,KAAZ;AAAmBC,MAAAA,SAAAA;KAA5E,CAAA,CAAA;AACH,GAAA;;AAED,EAAA,OAAOA,SAAP,CAAA;AACH,CAAA;AAED;;;;;;;;;AASG;;;AACH,SAASS,iBAAT,CACIC,SADJ,EAEIC,MAFJ,EAE8B;EAE1B,IAAI,CAACD,SAAL,EAAgB;AACZ,IAAA,OAAOE,SAAP,CAAA;AACH,GAAA;;AAED,EAAA,IAAI,OAAOF,SAAP,KAAqB,QAAzB,EAAmC;IAC/B,OAAOC,MAAM,CAACD,SAAD,CAAb,CAAA;AACH,GAAA;;EAED,OAAO;AACHR,IAAAA,MAAM,EAAEQ,SAAS,CAACR,MAAV,GAAmBS,MAAM,CAACD,SAAS,CAACR,MAAX,CAAzB,GAA8CU,SADnD;AAEHT,IAAAA,MAAM,EAAEO,SAAS,CAACP,MAAV,GAAmBQ,MAAM,CAACD,SAAS,CAACP,MAAX,CAAzB,GAA8CS,SAFnD;IAGHR,OAAO,EAAEM,SAAS,CAACN,OAAV,GAAoBO,MAAM,CAACD,SAAS,CAACN,OAAX,CAA1B,GAAgDQ,SAAAA;GAH7D,CAAA;AAKH;;;;"}
+{"version":3,"file":"responsive-props.js","sources":["../../src/utils/responsive-props.ts"],"sourcesContent":[null],"names":[],"mappings":"AAgBA,IAAM,KAAK,GAAG,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,aAAa,CAAA;AAEpD;;;;;;;;;;;;;;;;AAgBG;AACH,SAAS,aAAa,CAClB,MAA8B,EAC9B,QAAgB,EAChB,KAAgD,EAAA;IAEhD,IAAI,CAAC,KAAK,EAAE;AACR,QAAA,OAAO,IAAI,CAAA;AACd,KAAA;IAED,IAAM,SAAS,GAA8B,EAAE,CAAA;AAE/C,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAC3B,QAAA,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,EAAA,CAAA,MAAA,CAAG,QAAQ,EAAA,GAAA,CAAA,CAAA,MAAA,CAAI,KAAK,CAAE,CAAC,CAAC,CAAA;AACjD,KAAA;AAAM,SAAA;QACH,IAAI,KAAK,CAAC,MAAM;AAAE,YAAA,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,EAAG,CAAA,MAAA,CAAA,QAAQ,EAAI,GAAA,CAAA,CAAA,MAAA,CAAA,KAAK,CAAC,MAAM,CAAE,CAAC,CAAC,CAAA;QACvE,IAAI,KAAK,CAAC,MAAM;AAAE,YAAA,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,SAAU,CAAA,MAAA,CAAA,QAAQ,EAAI,GAAA,CAAA,CAAA,MAAA,CAAA,KAAK,CAAC,MAAM,CAAE,CAAC,CAAC,CAAA;QAC9E,IAAI,KAAK,CAAC,OAAO;AAAE,YAAA,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,UAAW,CAAA,MAAA,CAAA,QAAQ,EAAI,GAAA,CAAA,CAAA,MAAA,CAAA,KAAK,CAAC,OAAO,CAAE,CAAC,CAAC,CAAA;AACpF,KAAA;IAED,IAAI,KAAK,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE;;AAEpC,QAAA,OAAO,CAAC,IAAI,CAAC,0CAA0C,EAAE,EAAE,QAAQ,EAAA,QAAA,EAAE,KAAK,OAAA,EAAE,SAAS,EAAA,SAAA,EAAE,CAAC,CAAA;AAC3F,KAAA;AAED,IAAA,OAAO,SAAS,CAAA;AACpB,CAAC;AAED;;;;;;;;;AASG;AACH,SAAS,iBAAiB,CACtB,SAA2C,EAC3C,MAA0B,EAAA;IAE1B,IAAI,CAAC,SAAS,EAAE;AACZ,QAAA,OAAO,SAAS,CAAA;AACnB,KAAA;AAED,IAAA,IAAI,OAAO,SAAS,KAAK,QAAQ,EAAE;AAC/B,QAAA,OAAO,MAAM,CAAC,SAAS,CAAC,CAAA;AAC3B,KAAA;IAED,OAAO;AACH,QAAA,MAAM,EAAE,SAAS,CAAC,MAAM,GAAG,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,GAAG,SAAS;AAC/D,QAAA,MAAM,EAAE,SAAS,CAAC,MAAM,GAAG,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,GAAG,SAAS;AAC/D,QAAA,OAAO,EAAE,SAAS,CAAC,OAAO,GAAG,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,GAAG,SAAS;KACrE,CAAA;AACL;;;;"}

package/lib/avatar/avatar.d.ts

@@ -1,21 +1,21 @@
-import * as React from 'react';
-import { ResponsiveProp } from '../utils/responsive-props';
-import type { ObfuscatedClassName } from '../utils/common-types';
-type AvatarSize = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl';
-type Props = ObfuscatedClassName & {
-    /** @deprecated Please use `exceptionallySetClassName` */
-    className?: string;
-    /** @deprecated */
-    colorList?: string[];
-    size?: ResponsiveProp<AvatarSize>;
-    avatarUrl?: string;
-    user: {
-        name?: string;
-        email: string;
-    };
-};
-declare function Avatar({ user, avatarUrl, size, className, colorList, exceptionallySetClassName, ...props }: Props): React.JSX.Element;
-declare namespace Avatar {
-    var displayName: string;
-}
-export { Avatar };
+import * as React from 'react';
+import { ResponsiveProp } from '../utils/responsive-props';
+import type { ObfuscatedClassName } from '../utils/common-types';
+type AvatarSize = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl';
+type Props = ObfuscatedClassName & {
+    /** @deprecated Please use `exceptionallySetClassName` */
+    className?: string;
+    /** @deprecated */
+    colorList?: string[];
+    size?: ResponsiveProp<AvatarSize>;
+    avatarUrl?: string;
+    user: {
+        name?: string;
+        email: string;
+    };
+};
+declare function Avatar({ user, avatarUrl, size, className, colorList, exceptionallySetClassName, ...props }: Props): React.JSX.Element;
+declare namespace Avatar {
+    var displayName: string;
+}
+export { Avatar };

package/lib/avatar/avatar.js

@@ -1,2 +1,70 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../_virtual/_rollupPluginBabelHelpers.js"),a=require("react"),t=require("./utils.js"),r=require("../utils/responsive-props.js"),s=require("./avatar.module.css.js"),l=require("../box/box.js");function i(e){if(e&&e.__esModule)return e;var a=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,r.get?r:{enumerable:!0,get:function(){return e[t]}})}})),a.default=e,a}var c=i(a);const o=["user","avatarUrl","size","className","colorList","exceptionallySetClassName"],u=["#fcc652","#e9952c","#e16b2d","#d84b40","#e8435a","#e5198a","#ad3889","#86389c","#a8a8a8","#98be2f","#5d9d50","#5f9f85","#5bbcb6","#32a3bf","#2bafeb","#2d88c3","#3863cc","#5e5e5e"];function n(a){let{user:i,avatarUrl:n,size:b="l",className:d,colorList:f=u,exceptionallySetClassName:p}=a,m=e.objectWithoutProperties(a,o);const v=t.getInitials(i.name)||t.getInitials(i.email),j=b||"l",g=n?{backgroundImage:`url(${n})`,textIndent:"-9999px"}:{backgroundColor:f[t.emailToIndex(i.email,f.length)]},x=r.getClassNames(s.default,"size",j);return c.createElement(l.Box,e.objectSpread2({className:[d,s.default.avatar,x,p],style:g},m),v)}n.displayName="Avatar",exports.Avatar=n;
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var utils = require('./utils.js');
+var responsiveProps = require('../utils/responsive-props.js');
+var avatar_module = require('./avatar.module.css.js');
+var box = require('../box/box.js');
+
+function _interopNamespace(e) {
+    if (e && e.__esModule) return e;
+    var n = Object.create(null);
+    if (e) {
+        Object.keys(e).forEach(function (k) {
+            if (k !== 'default') {
+                var d = Object.getOwnPropertyDescriptor(e, k);
+                Object.defineProperty(n, k, d.get ? d : {
+                    enumerable: true,
+                    get: function () { return e[k]; }
+                });
+            }
+        });
+    }
+    n["default"] = e;
+    return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var AVATAR_COLORS = [
+    '#fcc652',
+    '#e9952c',
+    '#e16b2d',
+    '#d84b40',
+    '#e8435a',
+    '#e5198a',
+    '#ad3889',
+    '#86389c',
+    '#a8a8a8',
+    '#98be2f',
+    '#5d9d50',
+    '#5f9f85',
+    '#5bbcb6',
+    '#32a3bf',
+    '#2bafeb',
+    '#2d88c3',
+    '#3863cc',
+    '#5e5e5e',
+];
+function Avatar(_a) {
+    var user = _a.user, avatarUrl = _a.avatarUrl, _b = _a.size, size = _b === void 0 ? 'l' : _b, className = _a.className, _c = _a.colorList, colorList = _c === void 0 ? AVATAR_COLORS : _c, exceptionallySetClassName = _a.exceptionallySetClassName, props = tslib.__rest(_a, ["user", "avatarUrl", "size", "className", "colorList", "exceptionallySetClassName"]);
+    var userInitials = utils.getInitials(user.name) || utils.getInitials(user.email);
+    var avatarSize = size ? size : 'l';
+    var style = avatarUrl
+        ? {
+            backgroundImage: "url(".concat(avatarUrl, ")"),
+            textIndent: '-9999px'
+        }
+        : {
+            backgroundColor: colorList[utils.emailToIndex(user.email, colorList.length)]
+        };
+    var sizeClassName = responsiveProps.getClassNames(avatar_module["default"], 'size', avatarSize);
+    return (React__namespace.createElement(box.Box, tslib.__assign({ className: [className, avatar_module["default"].avatar, sizeClassName, exceptionallySetClassName], style: style }, props), userInitials));
+}
+Avatar.displayName = 'Avatar';
+
+exports.Avatar = Avatar;
 //# sourceMappingURL=avatar.js.map

package/lib/avatar/avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"avatar.js","sources":["../../src/avatar/avatar.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { getInitials, emailToIndex } from './utils'\n\nimport { getClassNames, ResponsiveProp } from '../utils/responsive-props'\nimport styles from './avatar.module.css'\nimport { Box } from '../box'\nimport type { ObfuscatedClassName } from '../utils/common-types'\n\nconst AVATAR_COLORS = [\n    '#fcc652',\n    '#e9952c',\n    '#e16b2d',\n    '#d84b40',\n    '#e8435a',\n    '#e5198a',\n    '#ad3889',\n    '#86389c',\n    '#a8a8a8',\n    '#98be2f',\n    '#5d9d50',\n    '#5f9f85',\n    '#5bbcb6',\n    '#32a3bf',\n    '#2bafeb',\n    '#2d88c3',\n    '#3863cc',\n    '#5e5e5e',\n]\n\ntype AvatarSize = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl'\n\ntype Props = ObfuscatedClassName & {\n    /** @deprecated Please use `exceptionallySetClassName` */\n    className?: string\n    /** @deprecated */\n    colorList?: string[]\n    size?: ResponsiveProp<AvatarSize>\n    avatarUrl?: string\n    user: { name?: string; email: string }\n}\n\nfunction Avatar({\n    user,\n    avatarUrl,\n    size = 'l',\n    className,\n    colorList = AVATAR_COLORS,\n    exceptionallySetClassName,\n    ...props\n}: Props) {\n    const userInitials = getInitials(user.name) || getInitials(user.email)\n    const avatarSize = size ? size : 'l'\n\n    const style = avatarUrl\n        ? {\n              backgroundImage: `url(${avatarUrl})`,\n              textIndent: '-9999px', // hide the initials\n          }\n        : {\n              backgroundColor: colorList[emailToIndex(user.email, colorList.length)],\n          }\n\n    const sizeClassName = getClassNames(styles, 'size', avatarSize)\n\n    return (\n        <Box\n            className={[className, styles.avatar, sizeClassName, exceptionallySetClassName]}\n            style={style}\n            {...props}\n        >\n            {userInitials}\n        </Box>\n    )\n}\nAvatar.displayName = 'Avatar'\n\nexport { Avatar }\n"],"names":["AVATAR_COLORS","Avatar","_ref","user","avatarUrl","size","className","colorList","exceptionallySetClassName","props","_objectWithoutProperties","objectWithoutProperties","_excluded","userInitials","getInitials","name","email","avatarSize","style","backgroundImage","textIndent","backgroundColor","emailToIndex","length","sizeClassName","getClassNames","styles","React","createElement","Box","_objectSpread","avatar","displayName"],"mappings":"qoBASMA,EAAgB,CAClB,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,WAeJ,SAASC,EAQDC,GAAA,IARQC,KACZA,EADYC,UAEZA,EAFYC,KAGZA,EAAO,IAHKC,UAIZA,EAJYC,UAKZA,EAAYP,EALAQ,0BAMZA,GAEIN,EADDO,EACCC,EAAAC,wBAAAT,EAAAU,GACJ,MAAMC,EAAeC,EAAWA,YAACX,EAAKY,OAASD,cAAYX,EAAKa,OAC1DC,EAAaZ,GAAc,IAE3Ba,EAAQd,EACR,CACIe,gBAAwB,OAAAf,KACxBgB,WAAY,WAEhB,CACIC,gBAAiBd,EAAUe,eAAanB,EAAKa,MAAOT,EAAUgB,UAGlEC,EAAgBC,EAAaA,cAACC,EAAD,QAAS,OAAQT,GAEpD,OACIU,EAACC,cAAAC,EAADA,IAAAC,gBAAA,CACIxB,UAAW,CAACA,EAAWoB,EAAAA,QAAOK,OAAQP,EAAehB,GACrDU,MAAOA,GACHT,GAEHI,GAIbZ,EAAO+B,YAAc"}
+{"version":3,"file":"avatar.js","sources":["../../src/avatar/avatar.tsx"],"sourcesContent":[null],"names":["__rest","getInitials","emailToIndex","getClassNames","styles","React","Box","__assign"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,IAAM,aAAa,GAAG;IAClB,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;CACZ,CAAA;AAcD,SAAS,MAAM,CAAC,EAQR,EAAA;AAPJ,IAAA,IAAA,IAAI,GAAA,EAAA,CAAA,IAAA,EACJ,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,EAAU,GAAA,EAAA,CAAA,IAAA,EAAV,IAAI,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,GAAG,GAAA,EAAA,EACV,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,EAAyB,GAAA,EAAA,CAAA,SAAA,EAAzB,SAAS,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,aAAa,GAAA,EAAA,EACzB,yBAAyB,GAAA,EAAA,CAAA,yBAAA,EACtB,KAAK,GAAAA,YAAA,CAAA,EAAA,EAPI,oFAQf,CADW,CAAA;AAER,IAAA,IAAM,YAAY,GAAGC,iBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,IAAIA,iBAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;IACtE,IAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,GAAG,CAAA;IAEpC,IAAM,KAAK,GAAG,SAAS;AACnB,UAAE;YACI,eAAe,EAAE,MAAO,CAAA,MAAA,CAAA,SAAS,EAAG,GAAA,CAAA;AACpC,YAAA,UAAU,EAAE,SAAS;AACxB,SAAA;AACH,UAAE;AACI,YAAA,eAAe,EAAE,SAAS,CAACC,kBAAY,CAAC,IAAI,CAAC,KAAK,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;SACzE,CAAA;IAEP,IAAM,aAAa,GAAGC,6BAAa,CAACC,wBAAM,EAAE,MAAM,EAAE,UAAU,CAAC,CAAA;IAE/D,QACIC,gBAAC,CAAA,aAAA,CAAAC,OAAG,EACAC,cAAA,CAAA,EAAA,SAAS,EAAE,CAAC,SAAS,EAAEH,wBAAM,CAAC,MAAM,EAAE,aAAa,EAAE,yBAAyB,CAAC,EAC/E,KAAK,EAAE,KAAK,EACR,EAAA,KAAK,CAER,EAAA,YAAY,CACX,EACT;AACL,CAAC;AACD,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}

package/lib/avatar/avatar.module.css.js

@@ -1,2 +1,8 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={avatar:"_38a1be89","size-xxs":"d32e92ae","size-xs":"_0667d719","size-s":"cf529fcf","size-m":"_6e268eab","size-l":"d64c62cf","size-xl":"_44fb77de","size-xxl":"_01f85e0e","size-xxxl":"_41a5fe19","tablet-size-xxs":"_6ab1577d","tablet-size-xs":"b52a4963","tablet-size-s":"_714a8419","tablet-size-m":"_81cd4d51","tablet-size-l":"bf0a4edb","tablet-size-xl":"e4f0dabd","tablet-size-xxl":"_67ea065d","tablet-size-xxxl":"_2af7f76f","desktop-size-xxs":"_759081dc","desktop-size-xs":"_8290d1c1","desktop-size-s":"_48ea172d","desktop-size-m":"_758f6641","desktop-size-l":"f9ada088","desktop-size-xl":"d3bb7470","desktop-size-xxl":"_9a312ee3","desktop-size-xxxl":"a1d30c23"};
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var modules_08f3eeac = {"avatar":"_38a1be89","size-xxs":"d32e92ae","size-xs":"_0667d719","size-s":"cf529fcf","size-m":"_6e268eab","size-l":"d64c62cf","size-xl":"_44fb77de","size-xxl":"_01f85e0e","size-xxxl":"_41a5fe19","tablet-size-xxs":"_6ab1577d","tablet-size-xs":"b52a4963","tablet-size-s":"_714a8419","tablet-size-m":"_81cd4d51","tablet-size-l":"bf0a4edb","tablet-size-xl":"e4f0dabd","tablet-size-xxl":"_67ea065d","tablet-size-xxxl":"_2af7f76f","desktop-size-xxs":"_759081dc","desktop-size-xs":"_8290d1c1","desktop-size-s":"_48ea172d","desktop-size-m":"_758f6641","desktop-size-l":"f9ada088","desktop-size-xl":"d3bb7470","desktop-size-xxl":"_9a312ee3","desktop-size-xxxl":"a1d30c23"};
+
+exports["default"] = modules_08f3eeac;
 //# sourceMappingURL=avatar.module.css.js.map

package/lib/avatar/avatar.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"avatar.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
+{"version":3,"file":"avatar.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/lib/avatar/index.d.ts

@@ -1 +1 @@
-export * from './avatar';
+export * from './avatar';

package/lib/avatar/utils.d.ts

@@ -1,3 +1,3 @@
-declare function getInitials(name?: string): string | undefined;
-declare function emailToIndex(email: string, maxIndex: number): number;
-export { getInitials, emailToIndex };
+declare function getInitials(name?: string): string | undefined;
+declare function emailToIndex(email: string, maxIndex: number): number;
+export { getInitials, emailToIndex };

package/lib/avatar/utils.js

@@ -1,2 +1,31 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.emailToIndex=function(t,e){const l=t.split("@")[0];return(l&&l.charCodeAt(0)+l.charCodeAt(l.length-1)||0)%e},exports.getInitials=function(t){var e;if(!t)return"";const l=t.trim().split(" "),n=l[0],r=l[l.length-1];let o=null==n?void 0:n[0];return null!=n&&null!=r&&null!=o&&n[0]!==r[0]&&(o+=r[0]),null==(e=o)?void 0:e.toUpperCase()};
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+function getInitials(name) {
+    if (!name) {
+        return '';
+    }
+    var seed = name.trim().split(' ');
+    var firstInitial = seed[0];
+    var lastInitial = seed[seed.length - 1];
+    var initials = firstInitial === null || firstInitial === void 0 ? void 0 : firstInitial[0];
+    if (firstInitial != null &&
+        lastInitial != null &&
+        initials != null &&
+        // Better readable this way.
+        // eslint-disable-next-line @typescript-eslint/prefer-string-starts-ends-with
+        firstInitial[0] !== lastInitial[0]) {
+        initials += lastInitial[0];
+    }
+    return initials === null || initials === void 0 ? void 0 : initials.toUpperCase();
+}
+function emailToIndex(email, maxIndex) {
+    var seed = email.split('@')[0];
+    var hash = seed ? seed.charCodeAt(0) + seed.charCodeAt(seed.length - 1) || 0 : 0;
+    return hash % maxIndex;
+}
+
+exports.emailToIndex = emailToIndex;
+exports.getInitials = getInitials;
 //# sourceMappingURL=utils.js.map

package/lib/avatar/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../../src/avatar/utils.ts"],"sourcesContent":["function getInitials(name?: string) {\n    if (!name) {\n        return ''\n    }\n\n    const seed = name.trim().split(' ')\n    const firstInitial = seed[0]\n    const lastInitial = seed[seed.length - 1]\n\n    let initials = firstInitial?.[0]\n    if (\n        firstInitial != null &&\n        lastInitial != null &&\n        initials != null &&\n        // Better readable this way.\n        // eslint-disable-next-line @typescript-eslint/prefer-string-starts-ends-with\n        firstInitial[0] !== lastInitial[0]\n    ) {\n        initials += lastInitial[0]\n    }\n    return initials?.toUpperCase()\n}\n\nfunction emailToIndex(email: string, maxIndex: number) {\n    const seed = email.split('@')[0]\n    const hash = seed ? seed.charCodeAt(0) + seed.charCodeAt(seed.length - 1) || 0 : 0\n    return hash % maxIndex\n}\n\nexport { getInitials, emailToIndex }\n"],"names":["email","maxIndex","seed","split","charCodeAt","length","name","_initials","trim","firstInitial","lastInitial","initials","toUpperCase"],"mappings":"yFAuBA,SAAsBA,EAAeC,GACjC,MAAMC,EAAOF,EAAMG,MAAM,KAAK,GAE9B,OADaD,GAAOA,EAAKE,WAAW,GAAKF,EAAKE,WAAWF,EAAKG,OAAS,IAAU,GACnEJ,uBA1BlB,SAAqBK,GAAa,IAAAC,EAC9B,IAAKD,EACD,MAAO,GAGX,MAAMJ,EAAOI,EAAKE,OAAOL,MAAM,KACzBM,EAAeP,EAAK,GACpBQ,EAAcR,EAAKA,EAAKG,OAAS,GAEvC,IAAIM,QAAWF,SAAAA,EAAe,GAW9B,OAToB,MAAhBA,GACe,MAAfC,GACY,MAAZC,GAGAF,EAAa,KAAOC,EAAY,KAEhCC,GAAYD,EAAY,IAE5B,OAAAH,EAAOI,QAAP,EAAOJ,EAAUK"}
+{"version":3,"file":"utils.js","sources":["../../src/avatar/utils.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;AAAA,SAAS,WAAW,CAAC,IAAa,EAAA;IAC9B,IAAI,CAAC,IAAI,EAAE;AACP,QAAA,OAAO,EAAE,CAAA;AACZ,KAAA;IAED,IAAM,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAA;AACnC,IAAA,IAAM,YAAY,GAAG,IAAI,CAAC,CAAC,CAAC,CAAA;IAC5B,IAAM,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA;IAEzC,IAAI,QAAQ,GAAG,YAAY,KAAZ,IAAA,IAAA,YAAY,uBAAZ,YAAY,CAAG,CAAC,CAAC,CAAA;IAChC,IACI,YAAY,IAAI,IAAI;AACpB,QAAA,WAAW,IAAI,IAAI;AACnB,QAAA,QAAQ,IAAI,IAAI;;;QAGhB,YAAY,CAAC,CAAC,CAAC,KAAK,WAAW,CAAC,CAAC,CAAC,EACpC;AACE,QAAA,QAAQ,IAAI,WAAW,CAAC,CAAC,CAAC,CAAA;AAC7B,KAAA;IACD,OAAO,QAAQ,aAAR,QAAQ,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAR,QAAQ,CAAE,WAAW,EAAE,CAAA;AAClC,CAAC;AAED,SAAS,YAAY,CAAC,KAAa,EAAE,QAAgB,EAAA;IACjD,IAAM,IAAI,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAA;AAChC,IAAA,IAAM,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;IAClF,OAAO,IAAI,GAAG,QAAQ,CAAA;AAC1B;;;;;"}

package/lib/badge/badge.d.ts

@@ -1,15 +1,15 @@
-import * as React from 'react';
-type BadgeTone = 'info' | 'positive' | 'promote' | 'attention' | 'warning';
-type BadgeProps = {
-    /**
-     * The label to show inside the badge element.
-     */
-    label: string;
-    /**
-     * The tone of the badge.
-     */
-    tone: BadgeTone;
-};
-declare function Badge({ tone, label, ...props }: BadgeProps): React.JSX.Element;
-export { Badge };
-export type { BadgeProps };
+import * as React from 'react';
+type BadgeTone = 'info' | 'positive' | 'promote' | 'attention' | 'warning';
+type BadgeProps = {
+    /**
+     * The label to show inside the badge element.
+     */
+    label: string;
+    /**
+     * The tone of the badge.
+     */
+    tone: BadgeTone;
+};
+declare function Badge({ tone, label, ...props }: BadgeProps): React.JSX.Element;
+export { Badge };
+export type { BadgeProps };

package/lib/badge/badge.js

@@ -1,2 +1,37 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../_virtual/_rollupPluginBabelHelpers.js"),r=require("react"),t=require("../box/box.js"),a=require("./badge.module.css.js");function u(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var a=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,a.get?a:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,r}var l=u(r);const o=["tone","label"];exports.Badge=function(r){let{tone:u,label:n}=r,c=e.objectWithoutProperties(r,o);return l.createElement(t.Box,e.objectSpread2(e.objectSpread2({},c),{},{as:"span",display:"inline",className:[a.default.badge,a.default["badge-"+u]]}),n)};
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var box = require('../box/box.js');
+var badge_module = require('./badge.module.css.js');
+
+function _interopNamespace(e) {
+    if (e && e.__esModule) return e;
+    var n = Object.create(null);
+    if (e) {
+        Object.keys(e).forEach(function (k) {
+            if (k !== 'default') {
+                var d = Object.getOwnPropertyDescriptor(e, k);
+                Object.defineProperty(n, k, d.get ? d : {
+                    enumerable: true,
+                    get: function () { return e[k]; }
+                });
+            }
+        });
+    }
+    n["default"] = e;
+    return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+function Badge(_a) {
+    var tone = _a.tone, label = _a.label, props = tslib.__rest(_a, ["tone", "label"]);
+    return (React__namespace.createElement(box.Box, tslib.__assign({}, props, { as: "span" // It enables putting the badge inside a button (https://stackoverflow.com/a/12982334)
+        , display: "inline", className: [badge_module["default"].badge, badge_module["default"]["badge-".concat(tone)]] }), label));
+}
+
+exports.Badge = Badge;
 //# sourceMappingURL=badge.js.map

package/lib/badge/badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"badge.js","sources":["../../src/badge/badge.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Box } from '../box'\n\nimport styles from './badge.module.css'\n\ntype BadgeTone = 'info' | 'positive' | 'promote' | 'attention' | 'warning'\n\ntype BadgeProps = {\n    /**\n     * The label to show inside the badge element.\n     */\n    label: string\n    /**\n     * The tone of the badge.\n     */\n    tone: BadgeTone\n}\n\nfunction Badge({ tone, label, ...props }: BadgeProps) {\n    return (\n        <Box\n            {...props}\n            as=\"span\" // It enables putting the badge inside a button (https://stackoverflow.com/a/12982334)\n            display=\"inline\"\n            className={[styles.badge, styles[`badge-${tone}`]]}\n        >\n            {label}\n        </Box>\n    )\n}\n\nexport { Badge }\nexport type { BadgeProps }\n"],"names":["_ref","tone","label","props","_objectWithoutProperties","objectWithoutProperties","_excluded","React","createElement","Box","as","display","className","styles","badge"],"mappings":"ihBAmBA,SAAoDA,GAAA,IAArCC,KAAEA,EAAFC,MAAQA,GAA6BF,EAAnBG,EAAmBC,EAAAC,wBAAAL,EAAAM,GAChD,OACIC,EAACC,cAAAC,yCACON,GADR,GAAA,CAEIO,GAAG,OACHC,QAAQ,SACRC,UAAW,CAACC,EAAM,QAACC,MAAOD,EAAAA,QAAO,SAASZ,MAEzCC"}
+{"version":3,"file":"badge.js","sources":["../../src/badge/badge.tsx"],"sourcesContent":[null],"names":["__rest","React","Box","__assign","styles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,SAAS,KAAK,CAAC,EAAqC,EAAA;IAAnC,IAAA,IAAI,UAAA,EAAE,KAAK,WAAA,EAAK,KAAK,GAAvBA,YAAA,CAAA,EAAA,EAAA,CAAA,MAAA,EAAA,OAAA,CAAyB,CAAF,CAAA;IAClC,QACIC,gBAAC,CAAA,aAAA,CAAAC,OAAG,EACIC,cAAA,CAAA,EAAA,EAAA,KAAK,IACT,EAAE,EAAC,MAAM;UACT,OAAO,EAAC,QAAQ,EAChB,SAAS,EAAE,CAACC,uBAAM,CAAC,KAAK,EAAEA,uBAAM,CAAC,QAAA,CAAA,MAAA,CAAS,IAAI,CAAE,CAAC,CAAC,EAEjD,CAAA,EAAA,KAAK,CACJ,EACT;AACL;;;;"}

package/lib/badge/badge.module.css.js

@@ -1,2 +1,8 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={badge:"_2714fc40","badge-info":"_3397e001","badge-positive":"b7b8944a","badge-promote":"bfc2b0e9","badge-attention":"d45e594f","badge-warning":"_1e30e9b3"};
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var modules_33c7c985 = {"badge":"_2714fc40","badge-info":"_3397e001","badge-positive":"b7b8944a","badge-promote":"bfc2b0e9","badge-attention":"d45e594f","badge-warning":"_1e30e9b3"};
+
+exports["default"] = modules_33c7c985;
 //# sourceMappingURL=badge.module.css.js.map

package/lib/badge/badge.module.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"badge.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
+{"version":3,"file":"badge.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/lib/badge/index.d.ts

@@ -1 +1 @@
-export { Badge } from './badge';
+export { Badge } from './badge';