npm - @veeqo/ui - Versions diffs - 10.2.0 → 11.0.0-beta-1 - Mend

@veeqo/ui 10.2.0 → 11.0.0-beta-1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1435) hide show

package/dist/components/Button/Button.cjs CHANGED Viewed

@@ -3,7 +3,7 @@
 var React = require('react');
 var Loader = require('../Loader/Loader.cjs');
 var styled = require('./components/styled.cjs');
-var DropdownIcon = require('../../icons/DropdownIcon.cjs');
+var DropdownIcon = require('../../icons/custom/components/DropdownIcon.cjs');
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }

package/dist/components/Button/Button.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.cjs","sources":["../../../src/components/Button/Button.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { ButtonProps } from './types';\nimport { Loader } from '../Loader';\n\nimport {\n DefaultButton,\n DefaultDestructiveButton,\n PrimaryButton,\n PrimaryDestructiveButton,\n FlatButton,\n LinkButton,\n UnstyledButton,\n LoadingWrapper,\n MainContent,\n} from './components/styled';\nimport { DropdownIcon } from '../../icons~~/DropdownIcon~~';\n\nconst variantMap = {\n default: DefaultButton,\n primary: PrimaryButton,\n destructive: DefaultDestructiveButton,\n primaryDestructive: PrimaryDestructiveButton,\n flat: FlatButton,\n link: LinkButton,\n unstyled: UnstyledButton,\n};\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n className,\n children,\n iconSlot,\n variant = 'default',\n size = 'base',\n dropdown = false,\n loading = false,\n contentStyles,\n ...otherProps\n }: ButtonProps,\n ref,\n ) => {\n if (variant === 'unstyled') {\n return (\n <UnstyledButton ref={ref} className={className} {...otherProps}>\n {children}\n </UnstyledButton>\n );\n }\n\n const VariantButton = variantMap[variant];\n\n const hasChildren = children !== undefined;\n const hasIcon = !!iconSlot;\n return (\n <VariantButton\n ref={ref}\n className={className}\n size={size}\n hasText={hasChildren}\n hasIcon={hasIcon}\n hasDropdown={dropdown}\n {...otherProps}\n >\n {(hasChildren \|\| hasIcon) && (\n <MainContent\n $loading={loading}\n hasText={!!children}\n size={children \|\| size === 'sm' ? 'base' : 'md'}\n style={contentStyles}\n >\n {iconSlot && iconSlot}\n {children !== undefined && children}\n {dropdown && <DropdownIcon />}\n </MainContent>\n )}\n\n {loading && (\n <LoadingWrapper>\n <Loader />\n </LoadingWrapper>\n )}\n </VariantButton>\n );\n },\n);\n"],"names":["DefaultButton","PrimaryButton","DefaultDestructiveButton","PrimaryDestructiveButton","FlatButton","LinkButton","UnstyledButton","forwardRef","React","MainContent","DropdownIcon","LoadingWrapper","Loader"],"mappings":";;;;;;;;;;;AAkBA,MAAM,UAAU,GAAG;AACjB,IAAA,OAAO,EAAEA,oBAAa;AACtB,IAAA,OAAO,EAAEC,oBAAa;AACtB,IAAA,WAAW,EAAEC,+BAAwB;AACrC,IAAA,kBAAkB,EAAEC,+BAAwB;AAC5C,IAAA,IAAI,EAAEC,iBAAU;AAChB,IAAA,IAAI,EAAEC,iBAAU;AAChB,IAAA,QAAQ,EAAEC,qBAAc;CACzB;AAEY,MAAA,MAAM,GAAGC,gBAAU,CAC9B,CACE,EACE,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,KAAK,EACf,aAAa,EACb,GAAG,UAAU,EACD,EACd,GAAG,KACD;IACF,IAAI,OAAO,KAAK,UAAU,EAAE;AAC1B,QAAA,QACEC,sBAAC,CAAA,aAAA,CAAAF,qBAAc,EAAC,EAAA,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,EAAM,GAAA,UAAU,IAC3D,QAAQ,CACM;AAEpB;AAED,IAAA,MAAM,aAAa,GAAG,UAAU,CAAC,OAAO,CAAC;AAEzC,IAAA,MAAM,WAAW,GAAG,QAAQ,KAAK,SAAS;AAC1C,IAAA,MAAM,OAAO,GAAG,CAAC,CAAC,QAAQ;AAC1B,IAAA,QACEE,sBAAA,CAAA,aAAA,CAAC,aAAa,EAAA,EACZ,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,QAAQ,EAAA,GACjB,UAAU,EAAA;AAEb,QAAA,CAAC,WAAW,IAAI,OAAO,MACtBA,sBAAA,CAAA,aAAA,CAACC,kBAAW,EAAA,EAAA,UAAA,EACA,OAAO,EACjB,OAAO,EAAE,CAAC,CAAC,QAAQ,EACnB,IAAI,EAAE,QAAQ,IAAI,IAAI,KAAK,IAAI,GAAG,MAAM,GAAG,IAAI,EAC/C,KAAK,EAAE,aAAa,EAAA;AAEnB,YAAA,QAAQ,IAAI,QAAQ;YACpB,QAAQ,KAAK,SAAS,IAAI,QAAQ;AAClC,YAAA,QAAQ,IAAID,sBAAA,CAAA,aAAA,CAACE,yBAAY,EAAA,IAAA,CAAG,CACjB,CACf;QAEA,OAAO,KACNF,sBAAA,CAAA,aAAA,CAACG,qBAAc,EAAA,IAAA;AACb,YAAAH,sBAAA,CAAA,aAAA,CAACI,aAAM,EAAG,IAAA,CAAA,CACK,CAClB,CACa;AAEpB,CAAC;;;;"}
1	+ {"version":3,"file":"Button.cjs","sources":["../../../src/components/Button/Button.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { ButtonProps } from './types';\nimport { Loader } from '../Loader';\n\nimport {\n DefaultButton,\n DefaultDestructiveButton,\n PrimaryButton,\n PrimaryDestructiveButton,\n FlatButton,\n LinkButton,\n UnstyledButton,\n LoadingWrapper,\n MainContent,\n} from './components/styled';\nimport { DropdownIcon } from '../../icons';\n\nconst variantMap = {\n default: DefaultButton,\n primary: PrimaryButton,\n destructive: DefaultDestructiveButton,\n primaryDestructive: PrimaryDestructiveButton,\n flat: FlatButton,\n link: LinkButton,\n unstyled: UnstyledButton,\n};\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n className,\n children,\n iconSlot,\n variant = 'default',\n size = 'base',\n dropdown = false,\n loading = false,\n contentStyles,\n ...otherProps\n }: ButtonProps,\n ref,\n ) => {\n if (variant === 'unstyled') {\n return (\n <UnstyledButton ref={ref} className={className} {...otherProps}>\n {children}\n </UnstyledButton>\n );\n }\n\n const VariantButton = variantMap[variant];\n\n const hasChildren = children !== undefined;\n const hasIcon = !!iconSlot;\n return (\n <VariantButton\n ref={ref}\n className={className}\n size={size}\n hasText={hasChildren}\n hasIcon={hasIcon}\n hasDropdown={dropdown}\n {...otherProps}\n >\n {(hasChildren \|\| hasIcon) && (\n <MainContent\n $loading={loading}\n hasText={!!children}\n size={children \|\| size === 'sm' ? 'base' : 'md'}\n style={contentStyles}\n >\n {iconSlot && iconSlot}\n {children !== undefined && children}\n {dropdown && <DropdownIcon />}\n </MainContent>\n )}\n\n {loading && (\n <LoadingWrapper>\n <Loader />\n </LoadingWrapper>\n )}\n </VariantButton>\n );\n },\n);\n"],"names":["DefaultButton","PrimaryButton","DefaultDestructiveButton","PrimaryDestructiveButton","FlatButton","LinkButton","UnstyledButton","forwardRef","React","MainContent","DropdownIcon","LoadingWrapper","Loader"],"mappings":";;;;;;;;;;;AAkBA,MAAM,UAAU,GAAG;AACjB,IAAA,OAAO,EAAEA,oBAAa;AACtB,IAAA,OAAO,EAAEC,oBAAa;AACtB,IAAA,WAAW,EAAEC,+BAAwB;AACrC,IAAA,kBAAkB,EAAEC,+BAAwB;AAC5C,IAAA,IAAI,EAAEC,iBAAU;AAChB,IAAA,IAAI,EAAEC,iBAAU;AAChB,IAAA,QAAQ,EAAEC,qBAAc;CACzB;AAEY,MAAA,MAAM,GAAGC,gBAAU,CAC9B,CACE,EACE,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,KAAK,EACf,aAAa,EACb,GAAG,UAAU,EACD,EACd,GAAG,KACD;IACF,IAAI,OAAO,KAAK,UAAU,EAAE;AAC1B,QAAA,QACEC,sBAAC,CAAA,aAAA,CAAAF,qBAAc,EAAC,EAAA,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,EAAM,GAAA,UAAU,IAC3D,QAAQ,CACM;AAEpB;AAED,IAAA,MAAM,aAAa,GAAG,UAAU,CAAC,OAAO,CAAC;AAEzC,IAAA,MAAM,WAAW,GAAG,QAAQ,KAAK,SAAS;AAC1C,IAAA,MAAM,OAAO,GAAG,CAAC,CAAC,QAAQ;AAC1B,IAAA,QACEE,sBAAA,CAAA,aAAA,CAAC,aAAa,EAAA,EACZ,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,QAAQ,EAAA,GACjB,UAAU,EAAA;AAEb,QAAA,CAAC,WAAW,IAAI,OAAO,MACtBA,sBAAA,CAAA,aAAA,CAACC,kBAAW,EAAA,EAAA,UAAA,EACA,OAAO,EACjB,OAAO,EAAE,CAAC,CAAC,QAAQ,EACnB,IAAI,EAAE,QAAQ,IAAI,IAAI,KAAK,IAAI,GAAG,MAAM,GAAG,IAAI,EAC/C,KAAK,EAAE,aAAa,EAAA;AAEnB,YAAA,QAAQ,IAAI,QAAQ;YACpB,QAAQ,KAAK,SAAS,IAAI,QAAQ;AAClC,YAAA,QAAQ,IAAID,sBAAA,CAAA,aAAA,CAACE,yBAAY,EAAA,IAAA,CAAG,CACjB,CACf;QAEA,OAAO,KACNF,sBAAA,CAAA,aAAA,CAACG,qBAAc,EAAA,IAAA;AACb,YAAAH,sBAAA,CAAA,aAAA,CAACI,aAAM,EAAG,IAAA,CAAA,CACK,CAClB,CACa;AAEpB,CAAC;;;;"}

package/dist/components/Button/Button.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import React__default, { forwardRef } from 'react';
 import { Loader } from '../Loader/Loader.js';
 import { UnstyledButton, MainContent, LoadingWrapper, DefaultButton, PrimaryButton, DefaultDestructiveButton, PrimaryDestructiveButton, FlatButton, LinkButton } from './components/styled.js';
-import { DropdownIcon } from '../../icons/DropdownIcon.js';
+import { DropdownIcon } from '../../icons/custom/components/DropdownIcon.js';
 const variantMap = {
     default: DefaultButton,

package/dist/components/Button/Button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.js","sources":["../../../src/components/Button/Button.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { ButtonProps } from './types';\nimport { Loader } from '../Loader';\n\nimport {\n DefaultButton,\n DefaultDestructiveButton,\n PrimaryButton,\n PrimaryDestructiveButton,\n FlatButton,\n LinkButton,\n UnstyledButton,\n LoadingWrapper,\n MainContent,\n} from './components/styled';\nimport { DropdownIcon } from '../../icons~~/DropdownIcon~~';\n\nconst variantMap = {\n default: DefaultButton,\n primary: PrimaryButton,\n destructive: DefaultDestructiveButton,\n primaryDestructive: PrimaryDestructiveButton,\n flat: FlatButton,\n link: LinkButton,\n unstyled: UnstyledButton,\n};\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n className,\n children,\n iconSlot,\n variant = 'default',\n size = 'base',\n dropdown = false,\n loading = false,\n contentStyles,\n ...otherProps\n }: ButtonProps,\n ref,\n ) => {\n if (variant === 'unstyled') {\n return (\n <UnstyledButton ref={ref} className={className} {...otherProps}>\n {children}\n </UnstyledButton>\n );\n }\n\n const VariantButton = variantMap[variant];\n\n const hasChildren = children !== undefined;\n const hasIcon = !!iconSlot;\n return (\n <VariantButton\n ref={ref}\n className={className}\n size={size}\n hasText={hasChildren}\n hasIcon={hasIcon}\n hasDropdown={dropdown}\n {...otherProps}\n >\n {(hasChildren \|\| hasIcon) && (\n <MainContent\n $loading={loading}\n hasText={!!children}\n size={children \|\| size === 'sm' ? 'base' : 'md'}\n style={contentStyles}\n >\n {iconSlot && iconSlot}\n {children !== undefined && children}\n {dropdown && <DropdownIcon />}\n </MainContent>\n )}\n\n {loading && (\n <LoadingWrapper>\n <Loader />\n </LoadingWrapper>\n )}\n </VariantButton>\n );\n },\n);\n"],"names":["React"],"mappings":";;;;;AAkBA,MAAM,UAAU,GAAG;AACjB,IAAA,OAAO,EAAE,aAAa;AACtB,IAAA,OAAO,EAAE,aAAa;AACtB,IAAA,WAAW,EAAE,wBAAwB;AACrC,IAAA,kBAAkB,EAAE,wBAAwB;AAC5C,IAAA,IAAI,EAAE,UAAU;AAChB,IAAA,IAAI,EAAE,UAAU;AAChB,IAAA,QAAQ,EAAE,cAAc;CACzB;AAEY,MAAA,MAAM,GAAG,UAAU,CAC9B,CACE,EACE,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,KAAK,EACf,aAAa,EACb,GAAG,UAAU,EACD,EACd,GAAG,KACD;IACF,IAAI,OAAO,KAAK,UAAU,EAAE;AAC1B,QAAA,QACEA,cAAC,CAAA,aAAA,CAAA,cAAc,EAAC,EAAA,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,EAAM,GAAA,UAAU,IAC3D,QAAQ,CACM;AAEpB;AAED,IAAA,MAAM,aAAa,GAAG,UAAU,CAAC,OAAO,CAAC;AAEzC,IAAA,MAAM,WAAW,GAAG,QAAQ,KAAK,SAAS;AAC1C,IAAA,MAAM,OAAO,GAAG,CAAC,CAAC,QAAQ;AAC1B,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,EACZ,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,QAAQ,EAAA,GACjB,UAAU,EAAA;AAEb,QAAA,CAAC,WAAW,IAAI,OAAO,MACtBA,cAAA,CAAA,aAAA,CAAC,WAAW,EAAA,EAAA,UAAA,EACA,OAAO,EACjB,OAAO,EAAE,CAAC,CAAC,QAAQ,EACnB,IAAI,EAAE,QAAQ,IAAI,IAAI,KAAK,IAAI,GAAG,MAAM,GAAG,IAAI,EAC/C,KAAK,EAAE,aAAa,EAAA;AAEnB,YAAA,QAAQ,IAAI,QAAQ;YACpB,QAAQ,KAAK,SAAS,IAAI,QAAQ;AAClC,YAAA,QAAQ,IAAIA,cAAA,CAAA,aAAA,CAAC,YAAY,EAAA,IAAA,CAAG,CACjB,CACf;QAEA,OAAO,KACNA,cAAA,CAAA,aAAA,CAAC,cAAc,EAAA,IAAA;AACb,YAAAA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAG,IAAA,CAAA,CACK,CAClB,CACa;AAEpB,CAAC;;;;"}
1	+ {"version":3,"file":"Button.js","sources":["../../../src/components/Button/Button.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { ButtonProps } from './types';\nimport { Loader } from '../Loader';\n\nimport {\n DefaultButton,\n DefaultDestructiveButton,\n PrimaryButton,\n PrimaryDestructiveButton,\n FlatButton,\n LinkButton,\n UnstyledButton,\n LoadingWrapper,\n MainContent,\n} from './components/styled';\nimport { DropdownIcon } from '../../icons';\n\nconst variantMap = {\n default: DefaultButton,\n primary: PrimaryButton,\n destructive: DefaultDestructiveButton,\n primaryDestructive: PrimaryDestructiveButton,\n flat: FlatButton,\n link: LinkButton,\n unstyled: UnstyledButton,\n};\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n className,\n children,\n iconSlot,\n variant = 'default',\n size = 'base',\n dropdown = false,\n loading = false,\n contentStyles,\n ...otherProps\n }: ButtonProps,\n ref,\n ) => {\n if (variant === 'unstyled') {\n return (\n <UnstyledButton ref={ref} className={className} {...otherProps}>\n {children}\n </UnstyledButton>\n );\n }\n\n const VariantButton = variantMap[variant];\n\n const hasChildren = children !== undefined;\n const hasIcon = !!iconSlot;\n return (\n <VariantButton\n ref={ref}\n className={className}\n size={size}\n hasText={hasChildren}\n hasIcon={hasIcon}\n hasDropdown={dropdown}\n {...otherProps}\n >\n {(hasChildren \|\| hasIcon) && (\n <MainContent\n $loading={loading}\n hasText={!!children}\n size={children \|\| size === 'sm' ? 'base' : 'md'}\n style={contentStyles}\n >\n {iconSlot && iconSlot}\n {children !== undefined && children}\n {dropdown && <DropdownIcon />}\n </MainContent>\n )}\n\n {loading && (\n <LoadingWrapper>\n <Loader />\n </LoadingWrapper>\n )}\n </VariantButton>\n );\n },\n);\n"],"names":["React"],"mappings":";;;;;AAkBA,MAAM,UAAU,GAAG;AACjB,IAAA,OAAO,EAAE,aAAa;AACtB,IAAA,OAAO,EAAE,aAAa;AACtB,IAAA,WAAW,EAAE,wBAAwB;AACrC,IAAA,kBAAkB,EAAE,wBAAwB;AAC5C,IAAA,IAAI,EAAE,UAAU;AAChB,IAAA,IAAI,EAAE,UAAU;AAChB,IAAA,QAAQ,EAAE,cAAc;CACzB;AAEY,MAAA,MAAM,GAAG,UAAU,CAC9B,CACE,EACE,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,KAAK,EACf,aAAa,EACb,GAAG,UAAU,EACD,EACd,GAAG,KACD;IACF,IAAI,OAAO,KAAK,UAAU,EAAE;AAC1B,QAAA,QACEA,cAAC,CAAA,aAAA,CAAA,cAAc,EAAC,EAAA,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,EAAM,GAAA,UAAU,IAC3D,QAAQ,CACM;AAEpB;AAED,IAAA,MAAM,aAAa,GAAG,UAAU,CAAC,OAAO,CAAC;AAEzC,IAAA,MAAM,WAAW,GAAG,QAAQ,KAAK,SAAS;AAC1C,IAAA,MAAM,OAAO,GAAG,CAAC,CAAC,QAAQ;AAC1B,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,EACZ,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,QAAQ,EAAA,GACjB,UAAU,EAAA;AAEb,QAAA,CAAC,WAAW,IAAI,OAAO,MACtBA,cAAA,CAAA,aAAA,CAAC,WAAW,EAAA,EAAA,UAAA,EACA,OAAO,EACjB,OAAO,EAAE,CAAC,CAAC,QAAQ,EACnB,IAAI,EAAE,QAAQ,IAAI,IAAI,KAAK,IAAI,GAAG,MAAM,GAAG,IAAI,EAC/C,KAAK,EAAE,aAAa,EAAA;AAEnB,YAAA,QAAQ,IAAI,QAAQ;YACpB,QAAQ,KAAK,SAAS,IAAI,QAAQ;AAClC,YAAA,QAAQ,IAAIA,cAAA,CAAA,aAAA,CAAC,YAAY,EAAA,IAAA,CAAG,CACjB,CACf;QAEA,OAAO,KACNA,cAAA,CAAA,aAAA,CAAC,cAAc,EAAA,IAAA;AACb,YAAAA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAG,IAAA,CAAA,CACK,CAClB,CACa;AAEpB,CAAC;;;;"}

package/dist/components/Calendars/components/subcomponents/CalendarHeader.cjs CHANGED Viewed

@@ -3,12 +3,12 @@
 var React = require('react');
 var reactAriaComponents = require('react-aria-components');
 var Button = require('../../../Button/Button.cjs');
-var RightArrowIcon = require('../../../../icons/RightArrowIcon.cjs');
-var LeftArrowIcon = require('../../../../icons/LeftArrowIcon.cjs');
+var DownArrowIcon = require('../../../../icons/design-system/components/DownArrowIcon.cjs');
+var LeftArrowIcon = require('../../../../icons/design-system/components/LeftArrowIcon.cjs');
+var RightArrowIcon = require('../../../../icons/design-system/components/RightArrowIcon.cjs');
+var UpArrowIcon = require('../../../../icons/design-system/components/UpArrowIcon.cjs');
 var Stack = require('../../../Stack/Stack.cjs');
 require('../../../Stack/types.cjs');
-var UpArrowIcon = require('../../../../icons/UpArrowIcon.cjs');
-var DownArrowIcon = require('../../../../icons/DownArrowIcon.cjs');
 var types = require('../../types.cjs');
 var constants = require('../../data/constants.cjs');
 var CalendarHeading = require('./CalendarHeading.cjs');
@@ -19,12 +19,12 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 const CalendarHeader = ({ level, currentYear, handleSwitchLevel, isDisabled, }) => (React__default.default.createElement(Stack.Stack, { as: "header", direction: "horizontal", alignX: "between", alignY: "center", spacing: "0" },
     React__default.default.createElement(reactAriaComponents.Button, { slot: "previous", isDisabled: isDisabled, type: "button" },
-        React__default.default.createElement(LeftArrowIcon.LeftArrowIcon, null)),
+        React__default.default.createElement(LeftArrowIcon.ReactComponent, null)),
     React__default.default.createElement(Stack.Stack, { direction: "horizontal", alignY: "center", alignX: "stretch", spacing: "xs", style: { margin: '0 4px' } },
         React__default.default.createElement(CalendarHeading.CalendarHeading, { level: level, currentYear: currentYear }),
-        React__default.default.createElement(Button.Button, { type: "button", "aria-label": constants.levelMoveLabelMap[level], variant: "flat", iconSlot: level === types.CalendarLevel.DODECADE ? React__default.default.createElement(UpArrowIcon.UpArrowIcon, null) : React__default.default.createElement(DownArrowIcon.DownArrowIcon, null), size: "sm", onClick: handleSwitchLevel, disabled: isDisabled })),
+        React__default.default.createElement(Button.Button, { type: "button", "aria-label": constants.levelMoveLabelMap[level], variant: "flat", iconSlot: level === types.CalendarLevel.DODECADE ? React__default.default.createElement(UpArrowIcon.ReactComponent, null) : React__default.default.createElement(DownArrowIcon.ReactComponent, null), size: "sm", onClick: handleSwitchLevel, disabled: isDisabled })),
     React__default.default.createElement(reactAriaComponents.Button, { slot: "next", isDisabled: isDisabled, type: "button" },
-        React__default.default.createElement(RightArrowIcon.RightArrowIcon, null))));
+        React__default.default.createElement(RightArrowIcon.ReactComponent, null))));
 exports.CalendarHeader = CalendarHeader;
 //# sourceMappingURL=CalendarHeader.cjs.map

package/dist/components/Calendars/components/subcomponents/CalendarHeader.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CalendarHeader.cjs","sources":["../../../../../src/components/Calendars/components/subcomponents/CalendarHeader.tsx"],"sourcesContent":["import React from 'react';\nimport { Button } from 'react-aria-components';\n\nimport { Button as VQBtn } from '../../../Button';\nimport { RightArrowIcon } ~~from~~ ~~'../../../../icons/RightArrowIcon';\nimport~~ ~~{ LeftArrowIcon~~ } from '../../../../icons~~/LeftArrowIcon~~';\nimport { Stack } from '../../../Stack';\nimport { ~~UpArrowIcon } from '../../../../icons/UpArrowIcon';\nimport { DownArrowIcon } from '../../../../icons/DownArrowIcon';\nimport {~~ CalendarLevel } from '../../types';\nimport { levelMoveLabelMap } from '../../data/constants';\nimport { CalendarHeading } from './CalendarHeading';\n\ntype CalendarHeaderProps = {\n level: CalendarLevel;\n currentYear: number;\n handleSwitchLevel: () => void;\n isDisabled?: boolean;\n};\n\nexport const CalendarHeader = ({\n level,\n currentYear,\n handleSwitchLevel,\n isDisabled,\n}: CalendarHeaderProps) => (\n <Stack as=\"header\" direction=\"horizontal\" alignX=\"between\" alignY=\"center\" spacing=\"0\">\n <Button slot=\"previous\" isDisabled={isDisabled} type=\"button\">\n <LeftArrowIcon />\n </Button>\n <Stack\n direction=\"horizontal\"\n alignY=\"center\"\n alignX=\"stretch\"\n spacing=\"xs\"\n style={{ margin: '0 4px' }}\n >\n <CalendarHeading level={level} currentYear={currentYear} />\n <VQBtn\n type=\"button\"\n aria-label={levelMoveLabelMap[level]}\n variant=\"flat\"\n iconSlot={level === CalendarLevel.DODECADE ? <UpArrowIcon /> : <DownArrowIcon />}\n size=\"sm\"\n onClick={handleSwitchLevel}\n disabled={isDisabled}\n />\n </Stack>\n <Button slot=\"next\" isDisabled={isDisabled} type=\"button\">\n <RightArrowIcon />\n </Button>\n </Stack>\n);\n"],"names":["React","Stack","Button","LeftArrowIcon","CalendarHeading","VQBtn","levelMoveLabelMap","CalendarLevel","UpArrowIcon","DownArrowIcon","RightArrowIcon"],"mappings":";;;;;;;;;;;;;;;;;;;~~AAoBa~~,MAAA,cAAc,GAAG,CAAC,EAC7B,KAAK,EACL,WAAW,EACX,iBAAiB,EACjB,UAAU,GACU,MACpBA,sBAAA,CAAA,aAAA,CAACC,WAAK,EAAA,EAAC,EAAE,EAAC,QAAQ,EAAC,SAAS,EAAC,YAAY,EAAC,MAAM,EAAC,SAAS,EAAC,MAAM,EAAC,QAAQ,EAAC,OAAO,EAAC,GAAG,EAAA;AACpF,IAAAD,sBAAA,CAAA,aAAA,CAACE,0BAAM,EAAA,EAAC,IAAI,EAAC,UAAU,EAAC,UAAU,EAAE,UAAU,EAAE,IAAI,EAAC,QAAQ,EAAA;QAC3DF,sBAAC,CAAA,aAAA,CAAAG,~~2BAAa~~,OAAG,CACV;IACTH,sBAAC,CAAA,aAAA,CAAAC,WAAK,EACJ,EAAA,SAAS,EAAC,YAAY,EACtB,MAAM,EAAC,QAAQ,EACf,MAAM,EAAC,SAAS,EAChB,OAAO,EAAC,IAAI,EACZ,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,EAAA;QAE1BD,sBAAC,CAAA,aAAA,CAAAI,+BAAe,IAAC,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,EAAI,CAAA;QAC3DJ,sBAAC,CAAA,aAAA,CAAAK,aAAK,IACJ,IAAI,EAAC,QAAQ,EACD,YAAA,EAAAC,2BAAiB,CAAC,KAAK,CAAC,EACpC,OAAO,EAAC,MAAM,EACd,QAAQ,EAAE,KAAK,KAAKC,mBAAa,CAAC,QAAQ,GAAGP,sBAAA,CAAA,aAAA,CAACQ,~~uBAAW~~,EAAG,IAAA,CAAA,GAAGR,sBAAA,CAAA,aAAA,CAACS,~~2BAAa~~,EAAA,IAAA,CAAG,EAChF,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,iBAAiB,EAC1B,QAAQ,EAAE,UAAU,EAAA,CACpB,CACI;AACR,IAAAT,sBAAA,CAAA,aAAA,CAACE,0BAAM,EAAA,EAAC,IAAI,EAAC,MAAM,EAAC,UAAU,EAAE,UAAU,EAAE,IAAI,EAAC,QAAQ,EAAA;AACvD,QAAAF,sBAAA,CAAA,aAAA,CAACU,6BAAc,EAAA,IAAA,CAAG,CACX,CACH;;;;"}
1	+ {"version":3,"file":"CalendarHeader.cjs","sources":["../../../../../src/components/Calendars/components/subcomponents/CalendarHeader.tsx"],"sourcesContent":["import React from 'react';\nimport { Button } from 'react-aria-components';\n\nimport { Button as VQBtn } from '../../../Button';\nimport { RightArrowIcon, LeftArrowIcon, UpArrowIcon, DownArrowIcon } from '../../../../icons';\nimport { Stack } from '../../../Stack';\nimport { CalendarLevel } from '../../types';\nimport { levelMoveLabelMap } from '../../data/constants';\nimport { CalendarHeading } from './CalendarHeading';\n\ntype CalendarHeaderProps = {\n level: CalendarLevel;\n currentYear: number;\n handleSwitchLevel: () => void;\n isDisabled?: boolean;\n};\n\nexport const CalendarHeader = ({\n level,\n currentYear,\n handleSwitchLevel,\n isDisabled,\n}: CalendarHeaderProps) => (\n <Stack as=\"header\" direction=\"horizontal\" alignX=\"between\" alignY=\"center\" spacing=\"0\">\n <Button slot=\"previous\" isDisabled={isDisabled} type=\"button\">\n <LeftArrowIcon />\n </Button>\n <Stack\n direction=\"horizontal\"\n alignY=\"center\"\n alignX=\"stretch\"\n spacing=\"xs\"\n style={{ margin: '0 4px' }}\n >\n <CalendarHeading level={level} currentYear={currentYear} />\n <VQBtn\n type=\"button\"\n aria-label={levelMoveLabelMap[level]}\n variant=\"flat\"\n iconSlot={level === CalendarLevel.DODECADE ? <UpArrowIcon /> : <DownArrowIcon />}\n size=\"sm\"\n onClick={handleSwitchLevel}\n disabled={isDisabled}\n />\n </Stack>\n <Button slot=\"next\" isDisabled={isDisabled} type=\"button\">\n <RightArrowIcon />\n </Button>\n </Stack>\n);\n"],"names":["React","Stack","Button","LeftArrowIcon","CalendarHeading","VQBtn","levelMoveLabelMap","CalendarLevel","UpArrowIcon","DownArrowIcon","RightArrowIcon"],"mappings":";;;;;;;;;;;;;;;;;;;AAiBa,MAAA,cAAc,GAAG,CAAC,EAC7B,KAAK,EACL,WAAW,EACX,iBAAiB,EACjB,UAAU,GACU,MACpBA,sBAAA,CAAA,aAAA,CAACC,WAAK,EAAA,EAAC,EAAE,EAAC,QAAQ,EAAC,SAAS,EAAC,YAAY,EAAC,MAAM,EAAC,SAAS,EAAC,MAAM,EAAC,QAAQ,EAAC,OAAO,EAAC,GAAG,EAAA;AACpF,IAAAD,sBAAA,CAAA,aAAA,CAACE,0BAAM,EAAA,EAAC,IAAI,EAAC,UAAU,EAAC,UAAU,EAAE,UAAU,EAAE,IAAI,EAAC,QAAQ,EAAA;QAC3DF,sBAAC,CAAA,aAAA,CAAAG,4BAAa,OAAG,CACV;IACTH,sBAAC,CAAA,aAAA,CAAAC,WAAK,EACJ,EAAA,SAAS,EAAC,YAAY,EACtB,MAAM,EAAC,QAAQ,EACf,MAAM,EAAC,SAAS,EAChB,OAAO,EAAC,IAAI,EACZ,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,EAAA;QAE1BD,sBAAC,CAAA,aAAA,CAAAI,+BAAe,IAAC,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,EAAI,CAAA;QAC3DJ,sBAAC,CAAA,aAAA,CAAAK,aAAK,IACJ,IAAI,EAAC,QAAQ,EACD,YAAA,EAAAC,2BAAiB,CAAC,KAAK,CAAC,EACpC,OAAO,EAAC,MAAM,EACd,QAAQ,EAAE,KAAK,KAAKC,mBAAa,CAAC,QAAQ,GAAGP,sBAAA,CAAA,aAAA,CAACQ,0BAAW,EAAG,IAAA,CAAA,GAAGR,sBAAA,CAAA,aAAA,CAACS,4BAAa,EAAA,IAAA,CAAG,EAChF,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,iBAAiB,EAC1B,QAAQ,EAAE,UAAU,EAAA,CACpB,CACI;AACR,IAAAT,sBAAA,CAAA,aAAA,CAACE,0BAAM,EAAA,EAAC,IAAI,EAAC,MAAM,EAAC,UAAU,EAAE,UAAU,EAAE,IAAI,EAAC,QAAQ,EAAA;AACvD,QAAAF,sBAAA,CAAA,aAAA,CAACU,6BAAc,EAAA,IAAA,CAAG,CACX,CACH;;;;"}

package/dist/components/Calendars/components/subcomponents/CalendarHeader.js CHANGED Viewed

@@ -1,12 +1,12 @@
 import React__default from 'react';
 import { Button } from 'react-aria-components';
 import { Button as Button$1 } from '../../../Button/Button.js';
-import { RightArrowIcon } from '../../../../icons/RightArrowIcon.js';
-import { LeftArrowIcon } from '../../../../icons/LeftArrowIcon.js';
+import { ReactComponent as DownArrowIcon } from '../../../../icons/design-system/components/DownArrowIcon.js';
+import { ReactComponent as LeftArrowIcon } from '../../../../icons/design-system/components/LeftArrowIcon.js';
+import { ReactComponent as RightArrowIcon } from '../../../../icons/design-system/components/RightArrowIcon.js';
+import { ReactComponent as UpArrowIcon } from '../../../../icons/design-system/components/UpArrowIcon.js';
 import { Stack } from '../../../Stack/Stack.js';
 import '../../../Stack/types.js';
-import { UpArrowIcon } from '../../../../icons/UpArrowIcon.js';
-import { DownArrowIcon } from '../../../../icons/DownArrowIcon.js';
 import { CalendarLevel } from '../../types.js';
 import { levelMoveLabelMap } from '../../data/constants.js';
 import { CalendarHeading } from './CalendarHeading.js';

package/dist/components/Calendars/components/subcomponents/CalendarHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CalendarHeader.js","sources":["../../../../../src/components/Calendars/components/subcomponents/CalendarHeader.tsx"],"sourcesContent":["import React from 'react';\nimport { Button } from 'react-aria-components';\n\nimport { Button as VQBtn } from '../../../Button';\nimport { RightArrowIcon } ~~from~~ ~~'../../../../icons/RightArrowIcon';\nimport~~ ~~{ LeftArrowIcon~~ } from '../../../../icons~~/LeftArrowIcon~~';\nimport { Stack } from '../../../Stack';\nimport { ~~UpArrowIcon } from '../../../../icons/UpArrowIcon';\nimport { DownArrowIcon } from '../../../../icons/DownArrowIcon';\nimport {~~ CalendarLevel } from '../../types';\nimport { levelMoveLabelMap } from '../../data/constants';\nimport { CalendarHeading } from './CalendarHeading';\n\ntype CalendarHeaderProps = {\n level: CalendarLevel;\n currentYear: number;\n handleSwitchLevel: () => void;\n isDisabled?: boolean;\n};\n\nexport const CalendarHeader = ({\n level,\n currentYear,\n handleSwitchLevel,\n isDisabled,\n}: CalendarHeaderProps) => (\n <Stack as=\"header\" direction=\"horizontal\" alignX=\"between\" alignY=\"center\" spacing=\"0\">\n <Button slot=\"previous\" isDisabled={isDisabled} type=\"button\">\n <LeftArrowIcon />\n </Button>\n <Stack\n direction=\"horizontal\"\n alignY=\"center\"\n alignX=\"stretch\"\n spacing=\"xs\"\n style={{ margin: '0 4px' }}\n >\n <CalendarHeading level={level} currentYear={currentYear} />\n <VQBtn\n type=\"button\"\n aria-label={levelMoveLabelMap[level]}\n variant=\"flat\"\n iconSlot={level === CalendarLevel.DODECADE ? <UpArrowIcon /> : <DownArrowIcon />}\n size=\"sm\"\n onClick={handleSwitchLevel}\n disabled={isDisabled}\n />\n </Stack>\n <Button slot=\"next\" isDisabled={isDisabled} type=\"button\">\n <RightArrowIcon />\n </Button>\n </Stack>\n);\n"],"names":["React","VQBtn"],"mappings":";;;;;;;;;;;;;~~AAoBa~~,MAAA,cAAc,GAAG,CAAC,EAC7B,KAAK,EACL,WAAW,EACX,iBAAiB,EACjB,UAAU,GACU,MACpBA,cAAA,CAAA,aAAA,CAAC,KAAK,EAAA,EAAC,EAAE,EAAC,QAAQ,EAAC,SAAS,EAAC,YAAY,EAAC,MAAM,EAAC,SAAS,EAAC,MAAM,EAAC,QAAQ,EAAC,OAAO,EAAC,GAAG,EAAA;AACpF,IAAAA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EAAC,IAAI,EAAC,UAAU,EAAC,UAAU,EAAE,UAAU,EAAE,IAAI,EAAC,QAAQ,EAAA;QAC3DA,cAAC,CAAA,aAAA,CAAA,aAAa,OAAG,CACV;IACTA,cAAC,CAAA,aAAA,CAAA,KAAK,EACJ,EAAA,SAAS,EAAC,YAAY,EACtB,MAAM,EAAC,QAAQ,EACf,MAAM,EAAC,SAAS,EAChB,OAAO,EAAC,IAAI,EACZ,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,EAAA;QAE1BA,cAAC,CAAA,aAAA,CAAA,eAAe,IAAC,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,EAAI,CAAA;QAC3DA,cAAC,CAAA,aAAA,CAAAC,QAAK,IACJ,IAAI,EAAC,QAAQ,EACD,YAAA,EAAA,iBAAiB,CAAC,KAAK,CAAC,EACpC,OAAO,EAAC,MAAM,EACd,QAAQ,EAAE,KAAK,KAAK,aAAa,CAAC,QAAQ,GAAGD,cAAA,CAAA,aAAA,CAAC,WAAW,EAAG,IAAA,CAAA,GAAGA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,IAAA,CAAG,EAChF,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,iBAAiB,EAC1B,QAAQ,EAAE,UAAU,EAAA,CACpB,CACI;AACR,IAAAA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EAAC,IAAI,EAAC,MAAM,EAAC,UAAU,EAAE,UAAU,EAAE,IAAI,EAAC,QAAQ,EAAA;AACvD,QAAAA,cAAA,CAAA,aAAA,CAAC,cAAc,EAAA,IAAA,CAAG,CACX,CACH;;;;"}
1	+ {"version":3,"file":"CalendarHeader.js","sources":["../../../../../src/components/Calendars/components/subcomponents/CalendarHeader.tsx"],"sourcesContent":["import React from 'react';\nimport { Button } from 'react-aria-components';\n\nimport { Button as VQBtn } from '../../../Button';\nimport { RightArrowIcon, LeftArrowIcon, UpArrowIcon, DownArrowIcon } from '../../../../icons';\nimport { Stack } from '../../../Stack';\nimport { CalendarLevel } from '../../types';\nimport { levelMoveLabelMap } from '../../data/constants';\nimport { CalendarHeading } from './CalendarHeading';\n\ntype CalendarHeaderProps = {\n level: CalendarLevel;\n currentYear: number;\n handleSwitchLevel: () => void;\n isDisabled?: boolean;\n};\n\nexport const CalendarHeader = ({\n level,\n currentYear,\n handleSwitchLevel,\n isDisabled,\n}: CalendarHeaderProps) => (\n <Stack as=\"header\" direction=\"horizontal\" alignX=\"between\" alignY=\"center\" spacing=\"0\">\n <Button slot=\"previous\" isDisabled={isDisabled} type=\"button\">\n <LeftArrowIcon />\n </Button>\n <Stack\n direction=\"horizontal\"\n alignY=\"center\"\n alignX=\"stretch\"\n spacing=\"xs\"\n style={{ margin: '0 4px' }}\n >\n <CalendarHeading level={level} currentYear={currentYear} />\n <VQBtn\n type=\"button\"\n aria-label={levelMoveLabelMap[level]}\n variant=\"flat\"\n iconSlot={level === CalendarLevel.DODECADE ? <UpArrowIcon /> : <DownArrowIcon />}\n size=\"sm\"\n onClick={handleSwitchLevel}\n disabled={isDisabled}\n />\n </Stack>\n <Button slot=\"next\" isDisabled={isDisabled} type=\"button\">\n <RightArrowIcon />\n </Button>\n </Stack>\n);\n"],"names":["React","VQBtn"],"mappings":";;;;;;;;;;;;;AAiBa,MAAA,cAAc,GAAG,CAAC,EAC7B,KAAK,EACL,WAAW,EACX,iBAAiB,EACjB,UAAU,GACU,MACpBA,cAAA,CAAA,aAAA,CAAC,KAAK,EAAA,EAAC,EAAE,EAAC,QAAQ,EAAC,SAAS,EAAC,YAAY,EAAC,MAAM,EAAC,SAAS,EAAC,MAAM,EAAC,QAAQ,EAAC,OAAO,EAAC,GAAG,EAAA;AACpF,IAAAA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EAAC,IAAI,EAAC,UAAU,EAAC,UAAU,EAAE,UAAU,EAAE,IAAI,EAAC,QAAQ,EAAA;QAC3DA,cAAC,CAAA,aAAA,CAAA,aAAa,OAAG,CACV;IACTA,cAAC,CAAA,aAAA,CAAA,KAAK,EACJ,EAAA,SAAS,EAAC,YAAY,EACtB,MAAM,EAAC,QAAQ,EACf,MAAM,EAAC,SAAS,EAChB,OAAO,EAAC,IAAI,EACZ,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,EAAA;QAE1BA,cAAC,CAAA,aAAA,CAAA,eAAe,IAAC,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,EAAI,CAAA;QAC3DA,cAAC,CAAA,aAAA,CAAAC,QAAK,IACJ,IAAI,EAAC,QAAQ,EACD,YAAA,EAAA,iBAAiB,CAAC,KAAK,CAAC,EACpC,OAAO,EAAC,MAAM,EACd,QAAQ,EAAE,KAAK,KAAK,aAAa,CAAC,QAAQ,GAAGD,cAAA,CAAA,aAAA,CAAC,WAAW,EAAG,IAAA,CAAA,GAAGA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,IAAA,CAAG,EAChF,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,iBAAiB,EAC1B,QAAQ,EAAE,UAAU,EAAA,CACpB,CACI;AACR,IAAAA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EAAC,IAAI,EAAC,MAAM,EAAC,UAAU,EAAE,UAAU,EAAE,IAAI,EAAC,QAAQ,EAAA;AACvD,QAAAA,cAAA,CAAA,aAAA,CAAC,cAAc,EAAA,IAAA,CAAG,CACX,CACH;;;;"}

package/dist/components/CardHeader/CardHeader.cjs CHANGED Viewed

@@ -4,9 +4,9 @@ var React = require('react');
 var Text = require('../Text/Text.cjs');
 var Button = require('../Button/Button.cjs');
 var styled = require('./styled.cjs');
-var DownArrowIcon = require('../../icons/DownArrowIcon.cjs');
-var UpArrowIcon = require('../../icons/UpArrowIcon.cjs');
-var CrossIcon = require('../../icons/CrossIcon.cjs');
+var CrossIcon = require('../../icons/design-system/components/CrossIcon.cjs');
+var DownArrowIcon = require('../../icons/design-system/components/DownArrowIcon.cjs');
+var UpArrowIcon = require('../../icons/design-system/components/UpArrowIcon.cjs');
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
@@ -17,8 +17,8 @@ const CardHeader = ({ id, title, subtitle, headerVariant = 'headingSmall', actio
         React__default.default.createElement(Text.Text, { id: id, variant: headerVariant }, title),
         action && (React__default.default.createElement(Button.Button, { variant: "link", onClick: action.onClick }, action.title)),
         actionSlot,
-        onClickCollapse && (React__default.default.createElement(Button.Button, { variant: "flat", iconSlot: isCollapsed ? React__default.default.createElement(DownArrowIcon.DownArrowIcon, null) : React__default.default.createElement(UpArrowIcon.UpArrowIcon, null), onClick: onClickCollapse })),
-        onClickClose && (React__default.default.createElement(Button.Button, { variant: "flat", iconSlot: React__default.default.createElement(CrossIcon.CrossIcon, null), onClick: onClickClose, "aria-label": "Close", type: "button" }))),
+        onClickCollapse && (React__default.default.createElement(Button.Button, { variant: "flat", iconSlot: isCollapsed ? React__default.default.createElement(DownArrowIcon.ReactComponent, null) : React__default.default.createElement(UpArrowIcon.ReactComponent, null), onClick: onClickCollapse })),
+        onClickClose && (React__default.default.createElement(Button.Button, { variant: "flat", iconSlot: React__default.default.createElement(CrossIcon.ReactComponent, null), onClick: onClickClose, "aria-label": "Close", type: "button" }))),
     subtitle && React__default.default.createElement(Text.Text, { variant: "subheadingSmall" }, subtitle)));
 exports.CardHeader = CardHeader;

package/dist/components/CardHeader/CardHeader.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CardHeader.cjs","sources":["../../../src/components/CardHeader/CardHeader.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Text } from '../Text';\nimport { Button } from '../Button';\nimport { Header, HeaderGrid } from './styled';\nimport { HeaderVariant } from '../Text/types';\nimport { DownArrowIcon ~~} from '../../icons/DownArrowIcon';\nimport {~~ UpArrowIcon ~~} from '../../icons/UpArrowIcon';\nimport {~~ CrossIcon } from '../../icons~~/CrossIcon~~';\n\ntype CardHeaderAction = {\n title: string;\n onClick: () => void;\n};\n\nexport interface CardHeaderProps {\n id?: string;\n title?: string;\n subtitle?: string;\n headerVariant?: HeaderVariant;\n action?: CardHeaderAction;\n actionSlot?: React.ReactNode;\n isCollapsed?: boolean;\n onClickCollapse?: () => void;\n onClickClose?: () => void;\n}\n\nexport const CardHeader = ({\n id,\n title,\n subtitle,\n headerVariant = 'headingSmall',\n action,\n actionSlot,\n isCollapsed,\n onClickCollapse,\n onClickClose,\n}: CardHeaderProps) => (\n <Header>\n <HeaderGrid>\n <Text id={id} variant={headerVariant}>\n {title}\n </Text>\n {action && (\n <Button variant=\"link\" onClick={action.onClick}>\n {action.title}\n </Button>\n )}\n {actionSlot}\n {onClickCollapse && (\n <Button\n variant=\"flat\"\n iconSlot={isCollapsed ? <DownArrowIcon /> : <UpArrowIcon />}\n onClick={onClickCollapse}\n />\n )}\n {onClickClose && (\n <Button\n variant=\"flat\"\n iconSlot={<CrossIcon />}\n onClick={onClickClose}\n aria-label=\"Close\"\n type=\"button\"\n />\n )}\n </HeaderGrid>\n {subtitle && <Text variant=\"subheadingSmall\">{subtitle}</Text>}\n </Header>\n);\n"],"names":["React","Header","HeaderGrid","Text","Button","DownArrowIcon","UpArrowIcon","CrossIcon"],"mappings":";;;;;;;;;;;;;;~~AA2BO~~,MAAM,UAAU,GAAG,CAAC,EACzB,EAAE,EACF,KAAK,EACL,QAAQ,EACR,aAAa,GAAG,cAAc,EAC9B,MAAM,EACN,UAAU,EACV,WAAW,EACX,eAAe,EACf,YAAY,GACI,MAChBA,qCAACC,aAAM,EAAA,IAAA;AACL,IAAAD,sBAAA,CAAA,aAAA,CAACE,iBAAU,EAAA,IAAA;QACTF,sBAAC,CAAA,aAAA,CAAAG,SAAI,EAAC,EAAA,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE,aAAa,EACjC,EAAA,KAAK,CACD;AACN,QAAA,MAAM,KACLH,sBAAA,CAAA,aAAA,CAACI,aAAM,EAAC,EAAA,OAAO,EAAC,MAAM,EAAC,OAAO,EAAE,MAAM,CAAC,OAAO,EAAA,EAC3C,MAAM,CAAC,KAAK,CACN,CACV;QACA,UAAU;AACV,QAAA,eAAe,KACdJ,sBAAC,CAAA,aAAA,CAAAI,aAAM,EACL,EAAA,OAAO,EAAC,MAAM,EACd,QAAQ,EAAE,WAAW,GAAGJ,sBAAA,CAAA,aAAA,CAACK,~~2BAAa~~,EAAA,IAAA,CAAG,GAAGL,sBAAA,CAAA,aAAA,CAACM,~~uBAAW~~,EAAA,IAAA,CAAG,EAC3D,OAAO,EAAE,eAAe,GACxB,CACH;QACA,YAAY,KACXN,sBAAA,CAAA,aAAA,CAACI,aAAM,EAAA,EACL,OAAO,EAAC,MAAM,EACd,QAAQ,EAAEJ,sBAAC,CAAA,aAAA,CAAAO,~~mBAAS~~,OAAG,EACvB,OAAO,EAAE,YAAY,EACV,YAAA,EAAA,OAAO,EAClB,IAAI,EAAC,QAAQ,EACb,CAAA,CACH,CACU;AACZ,IAAA,QAAQ,IAAIP,sBAAA,CAAA,aAAA,CAACG,SAAI,EAAA,EAAC,OAAO,EAAC,iBAAiB,EAAA,EAAE,QAAQ,CAAQ,CACvD;;;;"}
1	+ {"version":3,"file":"CardHeader.cjs","sources":["../../../src/components/CardHeader/CardHeader.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Text } from '../Text';\nimport { Button } from '../Button';\nimport { Header, HeaderGrid } from './styled';\nimport { HeaderVariant } from '../Text/types';\nimport { DownArrowIcon, UpArrowIcon, CrossIcon } from '../../icons';\n\ntype CardHeaderAction = {\n title: string;\n onClick: () => void;\n};\n\nexport interface CardHeaderProps {\n id?: string;\n title?: string;\n subtitle?: string;\n headerVariant?: HeaderVariant;\n action?: CardHeaderAction;\n actionSlot?: React.ReactNode;\n isCollapsed?: boolean;\n onClickCollapse?: () => void;\n onClickClose?: () => void;\n}\n\nexport const CardHeader = ({\n id,\n title,\n subtitle,\n headerVariant = 'headingSmall',\n action,\n actionSlot,\n isCollapsed,\n onClickCollapse,\n onClickClose,\n}: CardHeaderProps) => (\n <Header>\n <HeaderGrid>\n <Text id={id} variant={headerVariant}>\n {title}\n </Text>\n {action && (\n <Button variant=\"link\" onClick={action.onClick}>\n {action.title}\n </Button>\n )}\n {actionSlot}\n {onClickCollapse && (\n <Button\n variant=\"flat\"\n iconSlot={isCollapsed ? <DownArrowIcon /> : <UpArrowIcon />}\n onClick={onClickCollapse}\n />\n )}\n {onClickClose && (\n <Button\n variant=\"flat\"\n iconSlot={<CrossIcon />}\n onClick={onClickClose}\n aria-label=\"Close\"\n type=\"button\"\n />\n )}\n </HeaderGrid>\n {subtitle && <Text variant=\"subheadingSmall\">{subtitle}</Text>}\n </Header>\n);\n"],"names":["React","Header","HeaderGrid","Text","Button","DownArrowIcon","UpArrowIcon","CrossIcon"],"mappings":";;;;;;;;;;;;;;AAyBO,MAAM,UAAU,GAAG,CAAC,EACzB,EAAE,EACF,KAAK,EACL,QAAQ,EACR,aAAa,GAAG,cAAc,EAC9B,MAAM,EACN,UAAU,EACV,WAAW,EACX,eAAe,EACf,YAAY,GACI,MAChBA,qCAACC,aAAM,EAAA,IAAA;AACL,IAAAD,sBAAA,CAAA,aAAA,CAACE,iBAAU,EAAA,IAAA;QACTF,sBAAC,CAAA,aAAA,CAAAG,SAAI,EAAC,EAAA,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE,aAAa,EACjC,EAAA,KAAK,CACD;AACN,QAAA,MAAM,KACLH,sBAAA,CAAA,aAAA,CAACI,aAAM,EAAC,EAAA,OAAO,EAAC,MAAM,EAAC,OAAO,EAAE,MAAM,CAAC,OAAO,EAAA,EAC3C,MAAM,CAAC,KAAK,CACN,CACV;QACA,UAAU;AACV,QAAA,eAAe,KACdJ,sBAAC,CAAA,aAAA,CAAAI,aAAM,EACL,EAAA,OAAO,EAAC,MAAM,EACd,QAAQ,EAAE,WAAW,GAAGJ,sBAAA,CAAA,aAAA,CAACK,4BAAa,EAAA,IAAA,CAAG,GAAGL,sBAAA,CAAA,aAAA,CAACM,0BAAW,EAAA,IAAA,CAAG,EAC3D,OAAO,EAAE,eAAe,GACxB,CACH;QACA,YAAY,KACXN,sBAAA,CAAA,aAAA,CAACI,aAAM,EAAA,EACL,OAAO,EAAC,MAAM,EACd,QAAQ,EAAEJ,sBAAC,CAAA,aAAA,CAAAO,wBAAS,OAAG,EACvB,OAAO,EAAE,YAAY,EACV,YAAA,EAAA,OAAO,EAClB,IAAI,EAAC,QAAQ,EACb,CAAA,CACH,CACU;AACZ,IAAA,QAAQ,IAAIP,sBAAA,CAAA,aAAA,CAACG,SAAI,EAAA,EAAC,OAAO,EAAC,iBAAiB,EAAA,EAAE,QAAQ,CAAQ,CACvD;;;;"}

package/dist/components/CardHeader/CardHeader.js CHANGED Viewed

@@ -2,9 +2,9 @@ import React__default from 'react';
 import { Text } from '../Text/Text.js';
 import { Button } from '../Button/Button.js';
 import { Header, HeaderGrid } from './styled.js';
-import { DownArrowIcon } from '../../icons/DownArrowIcon.js';
-import { UpArrowIcon } from '../../icons/UpArrowIcon.js';
-import { CrossIcon } from '../../icons/CrossIcon.js';
+import { ReactComponent as CrossIcon } from '../../icons/design-system/components/CrossIcon.js';
+import { ReactComponent as DownArrowIcon } from '../../icons/design-system/components/DownArrowIcon.js';
+import { ReactComponent as UpArrowIcon } from '../../icons/design-system/components/UpArrowIcon.js';
 const CardHeader = ({ id, title, subtitle, headerVariant = 'headingSmall', action, actionSlot, isCollapsed, onClickCollapse, onClickClose, }) => (React__default.createElement(Header, null,
     React__default.createElement(HeaderGrid, null,

package/dist/components/CardHeader/CardHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CardHeader.js","sources":["../../../src/components/CardHeader/CardHeader.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Text } from '../Text';\nimport { Button } from '../Button';\nimport { Header, HeaderGrid } from './styled';\nimport { HeaderVariant } from '../Text/types';\nimport { DownArrowIcon ~~} from '../../icons/DownArrowIcon';\nimport {~~ UpArrowIcon ~~} from '../../icons/UpArrowIcon';\nimport {~~ CrossIcon } from '../../icons~~/CrossIcon~~';\n\ntype CardHeaderAction = {\n title: string;\n onClick: () => void;\n};\n\nexport interface CardHeaderProps {\n id?: string;\n title?: string;\n subtitle?: string;\n headerVariant?: HeaderVariant;\n action?: CardHeaderAction;\n actionSlot?: React.ReactNode;\n isCollapsed?: boolean;\n onClickCollapse?: () => void;\n onClickClose?: () => void;\n}\n\nexport const CardHeader = ({\n id,\n title,\n subtitle,\n headerVariant = 'headingSmall',\n action,\n actionSlot,\n isCollapsed,\n onClickCollapse,\n onClickClose,\n}: CardHeaderProps) => (\n <Header>\n <HeaderGrid>\n <Text id={id} variant={headerVariant}>\n {title}\n </Text>\n {action && (\n <Button variant=\"link\" onClick={action.onClick}>\n {action.title}\n </Button>\n )}\n {actionSlot}\n {onClickCollapse && (\n <Button\n variant=\"flat\"\n iconSlot={isCollapsed ? <DownArrowIcon /> : <UpArrowIcon />}\n onClick={onClickCollapse}\n />\n )}\n {onClickClose && (\n <Button\n variant=\"flat\"\n iconSlot={<CrossIcon />}\n onClick={onClickClose}\n aria-label=\"Close\"\n type=\"button\"\n />\n )}\n </HeaderGrid>\n {subtitle && <Text variant=\"subheadingSmall\">{subtitle}</Text>}\n </Header>\n);\n"],"names":["React"],"mappings":";;;;;;;;~~AA2BO~~,MAAM,UAAU,GAAG,CAAC,EACzB,EAAE,EACF,KAAK,EACL,QAAQ,EACR,aAAa,GAAG,cAAc,EAC9B,MAAM,EACN,UAAU,EACV,WAAW,EACX,eAAe,EACf,YAAY,GACI,MAChBA,6BAAC,MAAM,EAAA,IAAA;AACL,IAAAA,cAAA,CAAA,aAAA,CAAC,UAAU,EAAA,IAAA;QACTA,cAAC,CAAA,aAAA,CAAA,IAAI,EAAC,EAAA,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE,aAAa,EACjC,EAAA,KAAK,CACD;AACN,QAAA,MAAM,KACLA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAC,EAAA,OAAO,EAAC,MAAM,EAAC,OAAO,EAAE,MAAM,CAAC,OAAO,EAAA,EAC3C,MAAM,CAAC,KAAK,CACN,CACV;QACA,UAAU;AACV,QAAA,eAAe,KACdA,cAAC,CAAA,aAAA,CAAA,MAAM,EACL,EAAA,OAAO,EAAC,MAAM,EACd,QAAQ,EAAE,WAAW,GAAGA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,IAAA,CAAG,GAAGA,cAAA,CAAA,aAAA,CAAC,WAAW,EAAA,IAAA,CAAG,EAC3D,OAAO,EAAE,eAAe,GACxB,CACH;QACA,YAAY,KACXA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EACL,OAAO,EAAC,MAAM,EACd,QAAQ,EAAEA,cAAC,CAAA,aAAA,CAAA,SAAS,OAAG,EACvB,OAAO,EAAE,YAAY,EACV,YAAA,EAAA,OAAO,EAClB,IAAI,EAAC,QAAQ,EACb,CAAA,CACH,CACU;AACZ,IAAA,QAAQ,IAAIA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,OAAO,EAAC,iBAAiB,EAAA,EAAE,QAAQ,CAAQ,CACvD;;;;"}
1	+ {"version":3,"file":"CardHeader.js","sources":["../../../src/components/CardHeader/CardHeader.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Text } from '../Text';\nimport { Button } from '../Button';\nimport { Header, HeaderGrid } from './styled';\nimport { HeaderVariant } from '../Text/types';\nimport { DownArrowIcon, UpArrowIcon, CrossIcon } from '../../icons';\n\ntype CardHeaderAction = {\n title: string;\n onClick: () => void;\n};\n\nexport interface CardHeaderProps {\n id?: string;\n title?: string;\n subtitle?: string;\n headerVariant?: HeaderVariant;\n action?: CardHeaderAction;\n actionSlot?: React.ReactNode;\n isCollapsed?: boolean;\n onClickCollapse?: () => void;\n onClickClose?: () => void;\n}\n\nexport const CardHeader = ({\n id,\n title,\n subtitle,\n headerVariant = 'headingSmall',\n action,\n actionSlot,\n isCollapsed,\n onClickCollapse,\n onClickClose,\n}: CardHeaderProps) => (\n <Header>\n <HeaderGrid>\n <Text id={id} variant={headerVariant}>\n {title}\n </Text>\n {action && (\n <Button variant=\"link\" onClick={action.onClick}>\n {action.title}\n </Button>\n )}\n {actionSlot}\n {onClickCollapse && (\n <Button\n variant=\"flat\"\n iconSlot={isCollapsed ? <DownArrowIcon /> : <UpArrowIcon />}\n onClick={onClickCollapse}\n />\n )}\n {onClickClose && (\n <Button\n variant=\"flat\"\n iconSlot={<CrossIcon />}\n onClick={onClickClose}\n aria-label=\"Close\"\n type=\"button\"\n />\n )}\n </HeaderGrid>\n {subtitle && <Text variant=\"subheadingSmall\">{subtitle}</Text>}\n </Header>\n);\n"],"names":["React"],"mappings":";;;;;;;;AAyBO,MAAM,UAAU,GAAG,CAAC,EACzB,EAAE,EACF,KAAK,EACL,QAAQ,EACR,aAAa,GAAG,cAAc,EAC9B,MAAM,EACN,UAAU,EACV,WAAW,EACX,eAAe,EACf,YAAY,GACI,MAChBA,6BAAC,MAAM,EAAA,IAAA;AACL,IAAAA,cAAA,CAAA,aAAA,CAAC,UAAU,EAAA,IAAA;QACTA,cAAC,CAAA,aAAA,CAAA,IAAI,EAAC,EAAA,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE,aAAa,EACjC,EAAA,KAAK,CACD;AACN,QAAA,MAAM,KACLA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAC,EAAA,OAAO,EAAC,MAAM,EAAC,OAAO,EAAE,MAAM,CAAC,OAAO,EAAA,EAC3C,MAAM,CAAC,KAAK,CACN,CACV;QACA,UAAU;AACV,QAAA,eAAe,KACdA,cAAC,CAAA,aAAA,CAAA,MAAM,EACL,EAAA,OAAO,EAAC,MAAM,EACd,QAAQ,EAAE,WAAW,GAAGA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,IAAA,CAAG,GAAGA,cAAA,CAAA,aAAA,CAAC,WAAW,EAAA,IAAA,CAAG,EAC3D,OAAO,EAAE,eAAe,GACxB,CACH;QACA,YAAY,KACXA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EACL,OAAO,EAAC,MAAM,EACd,QAAQ,EAAEA,cAAC,CAAA,aAAA,CAAA,SAAS,OAAG,EACvB,OAAO,EAAE,YAAY,EACV,YAAA,EAAA,OAAO,EAClB,IAAI,EAAC,QAAQ,EACb,CAAA,CACH,CACU;AACZ,IAAA,QAAQ,IAAIA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,OAAO,EAAC,iBAAiB,EAAA,EAAE,QAAQ,CAAQ,CACvD;;;;"}

package/dist/components/Choice/Choice.cjs CHANGED Viewed

@@ -5,7 +5,7 @@ var Stack = require('../Stack/Stack.cjs');
 require('../Stack/types.cjs');
 var index = require('../../theme/index.cjs');
 var styled = require('./components/styled.cjs');
-var HelpIcon = require('../../icons/HelpIcon.cjs');
+var HelpIcon = require('../../icons/design-system/components/HelpIcon.cjs');
 var Text = require('../Text/Text.cjs');
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
@@ -28,7 +28,7 @@ const Choice = ({ htmlFor, className, label, hint, tooltip, tooltipContent, erro
                 Badge,
                 label && (React__default.default.createElement(Text.Text, { as: "label", htmlFor: htmlFor, variant: labelVariant, className: classNames.label }, label)),
                 (tooltip || tooltipContent) && (React__default.default.createElement(styled.BlockTooltip, { text: tooltip, content: tooltipContent, className: classNames.tooltip },
-                    React__default.default.createElement(HelpIcon.HelpIcon, { "data-testid": "tooltip-help", name: "help", width: index.theme.sizes.base, color: index.theme.colors.neutral.ink.lightest })))),
+                    React__default.default.createElement(HelpIcon.ReactComponent, { "data-testid": "tooltip-help", name: "help", width: index.theme.sizes.base, color: index.theme.colors.neutral.ink.lightest })))),
             hint && (React__default.default.createElement(Text.Text, { id: `hint-${htmlFor}`, variant: "hintText", className: classNames.hint }, hint)),
             error && (React__default.default.createElement(Text.Text, { variant: "error", className: classNames.error }, error)),
             Footer)) : null,

package/dist/components/Choice/Choice.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Choice.cjs","sources":["../../../src/components/Choice/Choice.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { Stack } from '../Stack';\nimport { theme } from '../../theme';\n\nimport {\n Wrapper,\n BorderedWrapper,\n RootLayout,\n InputLayout,\n AccessoryLayout,\n TextLayout,\n BlockTooltip,\n} from './components/styled';\nimport { HelpIcon } from '../../icons~~/HelpIcon~~';\nimport { Text } from '../Text';\nimport { TextVariant } from '../Text/types';\n\nexport interface ForwardedChoiceProps {\n className?: string;\n disabled?: boolean;\n label?: ReactNode;\n hint?: ReactNode;\n tooltip?: string;\n tooltipContent?: ReactNode;\n error?: ReactNode;\n bordered?: boolean;\n Badge?: ReactNode;\n Accessory?: ReactNode;\n Footer?: ReactNode;\n inputPosition?: 'left' \| 'right';\n labelVariant?: TextVariant;\n}\n\nexport interface ChoiceProps extends ForwardedChoiceProps {\n htmlFor: string;\n children: ReactNode;\n}\n\nconst generateClassNames = (prefix?: string): any => ({\n hint: prefix ? 'choice__hint' : undefined,\n label: prefix ? 'choice__label' : undefined,\n tooltip: prefix ? 'choice__tooltip' : undefined,\n error: prefix ? 'choice__error' : undefined,\n});\n\nexport const Choice = ({\n htmlFor,\n className,\n label,\n hint,\n tooltip,\n tooltipContent,\n error,\n bordered,\n Badge,\n Accessory,\n Footer,\n children,\n disabled = false,\n labelVariant = 'body',\n inputPosition = 'left',\n}: ChoiceProps) => {\n const classNames = generateClassNames(className);\n\n const contentMarkup = (\n <RootLayout>\n {inputPosition === 'left' && (\n <InputLayout align={Accessory ? 'center' : 'top'}>{children}</InputLayout>\n )}\n {Accessory && <AccessoryLayout>{Accessory}</AccessoryLayout>}\n {label \|\| hint \|\| error \|\| Badge \|\| Footer ? (\n <TextLayout>\n <Stack direction=\"horizontal\" alignY=\"center\" spacing=\"sm\">\n {Badge}\n {label && (\n <Text\n as=\"label\"\n htmlFor={htmlFor}\n variant={labelVariant}\n className={classNames.label}\n >\n {label}\n </Text>\n )}\n {(tooltip \|\| tooltipContent) && (\n <BlockTooltip text={tooltip} content={tooltipContent} className={classNames.tooltip}>\n <HelpIcon\n data-testid=\"tooltip-help\"\n name=\"help\"\n width={theme.sizes.base}\n color={theme.colors.neutral.ink.lightest}\n />\n </BlockTooltip>\n )}\n </Stack>\n {hint && (\n <Text id={`hint-${htmlFor}`} variant=\"hintText\" className={classNames.hint}>\n {hint}\n </Text>\n )}\n {error && (\n <Text variant=\"error\" className={classNames.error}>\n {error}\n </Text>\n )}\n {Footer}\n </TextLayout>\n ) : null}\n {inputPosition === 'right' && (\n <InputLayout align={Accessory ? 'center' : 'top'}>{children}</InputLayout>\n )}\n </RootLayout>\n );\n\n if (bordered) {\n return (\n <BorderedWrapper disabled={disabled} className={className}>\n {contentMarkup}\n </BorderedWrapper>\n );\n }\n\n return (\n <Wrapper disabled={disabled} className={className}>\n {contentMarkup}\n </Wrapper>\n );\n};\n"],"names":["React","RootLayout","InputLayout","AccessoryLayout","TextLayout","Stack","Text","BlockTooltip","HelpIcon","theme","BorderedWrapper","Wrapper"],"mappings":";;;;;;;;;;;;;;AAsCA,MAAM,kBAAkB,GAAG,CAAC,MAAe,MAAW;IACpD,IAAI,EAAE,MAAM,GAAG,cAAc,GAAG,SAAS;IACzC,KAAK,EAAE,MAAM,GAAG,eAAe,GAAG,SAAS;IAC3C,OAAO,EAAE,MAAM,GAAG,iBAAiB,GAAG,SAAS;IAC/C,KAAK,EAAE,MAAM,GAAG,eAAe,GAAG,SAAS;AAC5C,CAAA,CAAC;AAEW,MAAA,MAAM,GAAG,CAAC,EACrB,OAAO,EACP,SAAS,EACT,KAAK,EACL,IAAI,EACJ,OAAO,EACP,cAAc,EACd,KAAK,EACL,QAAQ,EACR,KAAK,EACL,SAAS,EACT,MAAM,EACN,QAAQ,EACR,QAAQ,GAAG,KAAK,EAChB,YAAY,GAAG,MAAM,EACrB,aAAa,GAAG,MAAM,GACV,KAAI;AAChB,IAAA,MAAM,UAAU,GAAG,kBAAkB,CAAC,SAAS,CAAC;AAEhD,IAAA,MAAM,aAAa,IACjBA,sBAAA,CAAA,aAAA,CAACC,iBAAU,EAAA,IAAA;QACR,aAAa,KAAK,MAAM,KACvBD,qCAACE,kBAAW,EAAA,EAAC,KAAK,EAAE,SAAS,GAAG,QAAQ,GAAG,KAAK,EAAA,EAAG,QAAQ,CAAe,CAC3E;AACA,QAAA,SAAS,IAAIF,sBAAA,CAAA,aAAA,CAACG,sBAAe,EAAA,IAAA,EAAE,SAAS,CAAmB;AAC3D,QAAA,KAAK,IAAI,IAAI,IAAI,KAAK,IAAI,KAAK,IAAI,MAAM,IACxCH,qCAACI,iBAAU,EAAA,IAAA;AACT,YAAAJ,sBAAA,CAAA,aAAA,CAACK,WAAK,EAAA,EAAC,SAAS,EAAC,YAAY,EAAC,MAAM,EAAC,QAAQ,EAAC,OAAO,EAAC,IAAI,EAAA;gBACvD,KAAK;gBACL,KAAK,KACJL,sBAAA,CAAA,aAAA,CAACM,SAAI,EAAA,EACH,EAAE,EAAC,OAAO,EACV,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,YAAY,EACrB,SAAS,EAAE,UAAU,CAAC,KAAK,EAAA,EAE1B,KAAK,CACD,CACR;gBACA,CAAC,OAAO,IAAI,cAAc,MACzBN,sBAAA,CAAA,aAAA,CAACO,mBAAY,EAAC,EAAA,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,UAAU,CAAC,OAAO,EAAA;AACjF,oBAAAP,sBAAA,CAAA,aAAA,CAACQ,~~iBAAQ~~,EAAA,EAAA,aAAA,EACK,cAAc,EAC1B,IAAI,EAAC,MAAM,EACX,KAAK,EAAEC,WAAK,CAAC,KAAK,CAAC,IAAI,EACvB,KAAK,EAAEA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,EACxC,CAAA,CACW,CAChB,CACK;YACP,IAAI,KACHT,sBAAC,CAAA,aAAA,CAAAM,SAAI,IAAC,EAAE,EAAE,CAAQ,KAAA,EAAA,OAAO,CAAE,CAAA,EAAE,OAAO,EAAC,UAAU,EAAC,SAAS,EAAE,UAAU,CAAC,IAAI,EAAA,EACvE,IAAI,CACA,CACR;AACA,YAAA,KAAK,KACJN,sBAAA,CAAA,aAAA,CAACM,SAAI,EAAA,EAAC,OAAO,EAAC,OAAO,EAAC,SAAS,EAAE,UAAU,CAAC,KAAK,EAC9C,EAAA,KAAK,CACD,CACR;AACA,YAAA,MAAM,CACI,IACX,IAAI;QACP,aAAa,KAAK,OAAO,KACxBN,sBAAA,CAAA,aAAA,CAACE,kBAAW,EAAC,EAAA,KAAK,EAAE,SAAS,GAAG,QAAQ,GAAG,KAAK,EAAA,EAAG,QAAQ,CAAe,CAC3E,CACU,CACd;AAED,IAAA,IAAI,QAAQ,EAAE;AACZ,QAAA,QACEF,sBAAA,CAAA,aAAA,CAACU,sBAAe,EAAA,EAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAA,EACtD,aAAa,CACE;AAErB;AAED,IAAA,QACEV,sBAAA,CAAA,aAAA,CAACW,cAAO,EAAA,EAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAA,EAC9C,aAAa,CACN;AAEd;;;;"}
1	+ {"version":3,"file":"Choice.cjs","sources":["../../../src/components/Choice/Choice.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { Stack } from '../Stack';\nimport { theme } from '../../theme';\n\nimport {\n Wrapper,\n BorderedWrapper,\n RootLayout,\n InputLayout,\n AccessoryLayout,\n TextLayout,\n BlockTooltip,\n} from './components/styled';\nimport { HelpIcon } from '../../icons';\nimport { Text } from '../Text';\nimport { TextVariant } from '../Text/types';\n\nexport interface ForwardedChoiceProps {\n className?: string;\n disabled?: boolean;\n label?: ReactNode;\n hint?: ReactNode;\n tooltip?: string;\n tooltipContent?: ReactNode;\n error?: ReactNode;\n bordered?: boolean;\n Badge?: ReactNode;\n Accessory?: ReactNode;\n Footer?: ReactNode;\n inputPosition?: 'left' \| 'right';\n labelVariant?: TextVariant;\n}\n\nexport interface ChoiceProps extends ForwardedChoiceProps {\n htmlFor: string;\n children: ReactNode;\n}\n\nconst generateClassNames = (prefix?: string): any => ({\n hint: prefix ? 'choice__hint' : undefined,\n label: prefix ? 'choice__label' : undefined,\n tooltip: prefix ? 'choice__tooltip' : undefined,\n error: prefix ? 'choice__error' : undefined,\n});\n\nexport const Choice = ({\n htmlFor,\n className,\n label,\n hint,\n tooltip,\n tooltipContent,\n error,\n bordered,\n Badge,\n Accessory,\n Footer,\n children,\n disabled = false,\n labelVariant = 'body',\n inputPosition = 'left',\n}: ChoiceProps) => {\n const classNames = generateClassNames(className);\n\n const contentMarkup = (\n <RootLayout>\n {inputPosition === 'left' && (\n <InputLayout align={Accessory ? 'center' : 'top'}>{children}</InputLayout>\n )}\n {Accessory && <AccessoryLayout>{Accessory}</AccessoryLayout>}\n {label \|\| hint \|\| error \|\| Badge \|\| Footer ? (\n <TextLayout>\n <Stack direction=\"horizontal\" alignY=\"center\" spacing=\"sm\">\n {Badge}\n {label && (\n <Text\n as=\"label\"\n htmlFor={htmlFor}\n variant={labelVariant}\n className={classNames.label}\n >\n {label}\n </Text>\n )}\n {(tooltip \|\| tooltipContent) && (\n <BlockTooltip text={tooltip} content={tooltipContent} className={classNames.tooltip}>\n <HelpIcon\n data-testid=\"tooltip-help\"\n name=\"help\"\n width={theme.sizes.base}\n color={theme.colors.neutral.ink.lightest}\n />\n </BlockTooltip>\n )}\n </Stack>\n {hint && (\n <Text id={`hint-${htmlFor}`} variant=\"hintText\" className={classNames.hint}>\n {hint}\n </Text>\n )}\n {error && (\n <Text variant=\"error\" className={classNames.error}>\n {error}\n </Text>\n )}\n {Footer}\n </TextLayout>\n ) : null}\n {inputPosition === 'right' && (\n <InputLayout align={Accessory ? 'center' : 'top'}>{children}</InputLayout>\n )}\n </RootLayout>\n );\n\n if (bordered) {\n return (\n <BorderedWrapper disabled={disabled} className={className}>\n {contentMarkup}\n </BorderedWrapper>\n );\n }\n\n return (\n <Wrapper disabled={disabled} className={className}>\n {contentMarkup}\n </Wrapper>\n );\n};\n"],"names":["React","RootLayout","InputLayout","AccessoryLayout","TextLayout","Stack","Text","BlockTooltip","HelpIcon","theme","BorderedWrapper","Wrapper"],"mappings":"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"}

package/dist/components/Choice/Choice.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { Stack } from '../Stack/Stack.js';
 import '../Stack/types.js';
 import { theme } from '../../theme/index.js';
 import { RootLayout, InputLayout, AccessoryLayout, TextLayout, BlockTooltip, BorderedWrapper, Wrapper } from './components/styled.js';
-import { HelpIcon } from '../../icons/HelpIcon.js';
+import { ReactComponent as HelpIcon } from '../../icons/design-system/components/HelpIcon.js';
 import { Text } from '../Text/Text.js';
 const generateClassNames = (prefix) => ({

package/dist/components/Choice/Choice.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Choice.js","sources":["../../../src/components/Choice/Choice.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { Stack } from '../Stack';\nimport { theme } from '../../theme';\n\nimport {\n Wrapper,\n BorderedWrapper,\n RootLayout,\n InputLayout,\n AccessoryLayout,\n TextLayout,\n BlockTooltip,\n} from './components/styled';\nimport { HelpIcon } from '../../icons~~/HelpIcon~~';\nimport { Text } from '../Text';\nimport { TextVariant } from '../Text/types';\n\nexport interface ForwardedChoiceProps {\n className?: string;\n disabled?: boolean;\n label?: ReactNode;\n hint?: ReactNode;\n tooltip?: string;\n tooltipContent?: ReactNode;\n error?: ReactNode;\n bordered?: boolean;\n Badge?: ReactNode;\n Accessory?: ReactNode;\n Footer?: ReactNode;\n inputPosition?: 'left' \| 'right';\n labelVariant?: TextVariant;\n}\n\nexport interface ChoiceProps extends ForwardedChoiceProps {\n htmlFor: string;\n children: ReactNode;\n}\n\nconst generateClassNames = (prefix?: string): any => ({\n hint: prefix ? 'choice__hint' : undefined,\n label: prefix ? 'choice__label' : undefined,\n tooltip: prefix ? 'choice__tooltip' : undefined,\n error: prefix ? 'choice__error' : undefined,\n});\n\nexport const Choice = ({\n htmlFor,\n className,\n label,\n hint,\n tooltip,\n tooltipContent,\n error,\n bordered,\n Badge,\n Accessory,\n Footer,\n children,\n disabled = false,\n labelVariant = 'body',\n inputPosition = 'left',\n}: ChoiceProps) => {\n const classNames = generateClassNames(className);\n\n const contentMarkup = (\n <RootLayout>\n {inputPosition === 'left' && (\n <InputLayout align={Accessory ? 'center' : 'top'}>{children}</InputLayout>\n )}\n {Accessory && <AccessoryLayout>{Accessory}</AccessoryLayout>}\n {label \|\| hint \|\| error \|\| Badge \|\| Footer ? (\n <TextLayout>\n <Stack direction=\"horizontal\" alignY=\"center\" spacing=\"sm\">\n {Badge}\n {label && (\n <Text\n as=\"label\"\n htmlFor={htmlFor}\n variant={labelVariant}\n className={classNames.label}\n >\n {label}\n </Text>\n )}\n {(tooltip \|\| tooltipContent) && (\n <BlockTooltip text={tooltip} content={tooltipContent} className={classNames.tooltip}>\n <HelpIcon\n data-testid=\"tooltip-help\"\n name=\"help\"\n width={theme.sizes.base}\n color={theme.colors.neutral.ink.lightest}\n />\n </BlockTooltip>\n )}\n </Stack>\n {hint && (\n <Text id={`hint-${htmlFor}`} variant=\"hintText\" className={classNames.hint}>\n {hint}\n </Text>\n )}\n {error && (\n <Text variant=\"error\" className={classNames.error}>\n {error}\n </Text>\n )}\n {Footer}\n </TextLayout>\n ) : null}\n {inputPosition === 'right' && (\n <InputLayout align={Accessory ? 'center' : 'top'}>{children}</InputLayout>\n )}\n </RootLayout>\n );\n\n if (bordered) {\n return (\n <BorderedWrapper disabled={disabled} className={className}>\n {contentMarkup}\n </BorderedWrapper>\n );\n }\n\n return (\n <Wrapper disabled={disabled} className={className}>\n {contentMarkup}\n </Wrapper>\n );\n};\n"],"names":["React"],"mappings":"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"}
1	+ {"version":3,"file":"Choice.js","sources":["../../../src/components/Choice/Choice.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { Stack } from '../Stack';\nimport { theme } from '../../theme';\n\nimport {\n Wrapper,\n BorderedWrapper,\n RootLayout,\n InputLayout,\n AccessoryLayout,\n TextLayout,\n BlockTooltip,\n} from './components/styled';\nimport { HelpIcon } from '../../icons';\nimport { Text } from '../Text';\nimport { TextVariant } from '../Text/types';\n\nexport interface ForwardedChoiceProps {\n className?: string;\n disabled?: boolean;\n label?: ReactNode;\n hint?: ReactNode;\n tooltip?: string;\n tooltipContent?: ReactNode;\n error?: ReactNode;\n bordered?: boolean;\n Badge?: ReactNode;\n Accessory?: ReactNode;\n Footer?: ReactNode;\n inputPosition?: 'left' \| 'right';\n labelVariant?: TextVariant;\n}\n\nexport interface ChoiceProps extends ForwardedChoiceProps {\n htmlFor: string;\n children: ReactNode;\n}\n\nconst generateClassNames = (prefix?: string): any => ({\n hint: prefix ? 'choice__hint' : undefined,\n label: prefix ? 'choice__label' : undefined,\n tooltip: prefix ? 'choice__tooltip' : undefined,\n error: prefix ? 'choice__error' : undefined,\n});\n\nexport const Choice = ({\n htmlFor,\n className,\n label,\n hint,\n tooltip,\n tooltipContent,\n error,\n bordered,\n Badge,\n Accessory,\n Footer,\n children,\n disabled = false,\n labelVariant = 'body',\n inputPosition = 'left',\n}: ChoiceProps) => {\n const classNames = generateClassNames(className);\n\n const contentMarkup = (\n <RootLayout>\n {inputPosition === 'left' && (\n <InputLayout align={Accessory ? 'center' : 'top'}>{children}</InputLayout>\n )}\n {Accessory && <AccessoryLayout>{Accessory}</AccessoryLayout>}\n {label \|\| hint \|\| error \|\| Badge \|\| Footer ? (\n <TextLayout>\n <Stack direction=\"horizontal\" alignY=\"center\" spacing=\"sm\">\n {Badge}\n {label && (\n <Text\n as=\"label\"\n htmlFor={htmlFor}\n variant={labelVariant}\n className={classNames.label}\n >\n {label}\n </Text>\n )}\n {(tooltip \|\| tooltipContent) && (\n <BlockTooltip text={tooltip} content={tooltipContent} className={classNames.tooltip}>\n <HelpIcon\n data-testid=\"tooltip-help\"\n name=\"help\"\n width={theme.sizes.base}\n color={theme.colors.neutral.ink.lightest}\n />\n </BlockTooltip>\n )}\n </Stack>\n {hint && (\n <Text id={`hint-${htmlFor}`} variant=\"hintText\" className={classNames.hint}>\n {hint}\n </Text>\n )}\n {error && (\n <Text variant=\"error\" className={classNames.error}>\n {error}\n </Text>\n )}\n {Footer}\n </TextLayout>\n ) : null}\n {inputPosition === 'right' && (\n <InputLayout align={Accessory ? 'center' : 'top'}>{children}</InputLayout>\n )}\n </RootLayout>\n );\n\n if (bordered) {\n return (\n <BorderedWrapper disabled={disabled} className={className}>\n {contentMarkup}\n </BorderedWrapper>\n );\n }\n\n return (\n <Wrapper disabled={disabled} className={className}>\n {contentMarkup}\n </Wrapper>\n );\n};\n"],"names":["React"],"mappings":"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"}

package/dist/components/CopyToClipboard/CopyToClipboard.cjs CHANGED Viewed

@@ -4,10 +4,10 @@ var React = require('react');
 var styled = require('styled-components');
 var Tooltip = require('../Tooltip/Tooltip.cjs');
 var colors = require('../../theme/modules/colors.cjs');
-var SuccessIcon = require('../../icons/SuccessIcon.cjs');
+var ClipboardIcon = require('../../icons/design-system/components/ClipboardIcon.cjs');
+var SuccessIcon = require('../../icons/design-system/components/SuccessIcon.cjs');
 var sizes = require('../../theme/modules/sizes.cjs');
 var Button = require('../Button/Button.cjs');
-var ClipboardIcon = require('../../icons/ClipboardIcon.cjs');
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
@@ -33,7 +33,7 @@ const CopyToClipboard = ({ className, text, onCopy }) => {
         setTimeout(() => setCopied(false), 2500);
     }, [onCopy, text]);
     return (React__default.default.createElement(Tooltip.Tooltip, { text: copied ? 'Copied!' : 'Copy to clipboard' },
-        React__default.default.createElement(XSButton, { variant: "flat", size: "sm", className: className, "aria-label": `${copied ? 'Copied' : 'Copy'} "${text}" to clipboard`, iconSlot: copied ? (React__default.default.createElement(SuccessIcon.SuccessIcon, { color: colors.colors.secondary.green.base, ...iconSizes })) : (React__default.default.createElement(ClipboardIcon.ClipboardIcon, { color: colors.colors.secondary.blue.base, ...iconSizes })), onClick: handleCopy })));
+        React__default.default.createElement(XSButton, { variant: "flat", size: "sm", className: className, "aria-label": `${copied ? 'Copied' : 'Copy'} "${text}" to clipboard`, iconSlot: copied ? (React__default.default.createElement(SuccessIcon.ReactComponent, { color: colors.colors.secondary.green.base, ...iconSizes })) : (React__default.default.createElement(ClipboardIcon.ReactComponent, { color: colors.colors.secondary.blue.base, ...iconSizes })), onClick: handleCopy })));
 };
 exports.CopyToClipboard = CopyToClipboard;

package/dist/components/CopyToClipboard/CopyToClipboard.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CopyToClipboard.cjs","sources":["../../../src/components/CopyToClipboard/CopyToClipboard.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\n\nimport styled from 'styled-components';\nimport { Tooltip } from '../Tooltip';\nimport { colors } from '../../theme/modules/colors';\nimport { SuccessIcon } from '../../icons~~/SuccessIcon~~';\nimport { sizes } from '../../theme/modules/sizes';\nimport { Button } from '../Button';\~~nimport { ClipboardIcon } from '../../icons/ClipboardIcon';\~~n\nexport interface CopyToClipboardProps {\n className?: string;\n text: string;\n onCopy?: () => void;\n}\n\nconst iconSizes = { width: sizes.base, height: sizes.base };\n\n/*\n Created in here to fix orders table sizes. Bad pattern to use in main button component, as\n * touch target is below A11y guidelines.\n /\nconst XSButton = styled(Button)`\n padding: 1px;\n height: unset;\n\n span {\n height: ${sizes.base};\n width: ${sizes.base};\n top: unset;\n }\n`;\n\n/\n A dynamic button to facilitate copying text to a users' keyboard when clicked.\n */\nexport const CopyToClipboard = ({ className, text, onCopy }: CopyToClipboardProps) => {\n const [copied, setCopied] = React.useState(false);\n\n const handleCopy = useCallback(() => {\n navigator.clipboard.writeText(text);\n if (onCopy) onCopy();\n setCopied(true);\n setTimeout(() => setCopied(false), 2500);\n }, [onCopy, text]);\n\n return (\n <Tooltip text={copied ? 'Copied!' : 'Copy to clipboard'}>\n <XSButton\n variant=\"flat\"\n size=\"sm\"\n className={className}\n aria-label={`${copied ? 'Copied' : 'Copy'} \"${text}\" to clipboard`}\n iconSlot={\n copied ? (\n <SuccessIcon color={colors.secondary.green.base} {...iconSizes} />\n ) : (\n <ClipboardIcon color={colors.secondary.blue.base} {...iconSizes} />\n )\n }\n onClick={handleCopy}\n />\n </Tooltip>\n );\n};\n"],"names":["sizes","styled","Button","React","useCallback","Tooltip","SuccessIcon","colors","ClipboardIcon"],"mappings":";;;;;;;;;;;;;;;;~~AAgBA~~,MAAM,SAAS,GAAG,EAAE,KAAK,EAAEA,WAAK,CAAC,IAAI,EAAE,MAAM,EAAEA,WAAK,CAAC,IAAI,EAAE;AAE3D;;;AAGG;AACH,MAAM,QAAQ,GAAGC,uBAAM,CAACC,aAAM,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,eAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,qCAAA,EAKjBF,WAAK,CAAC,IAAI,CACX,OAAA,EAAAA,WAAK,CAAC,IAAI,cAGtB;AAED;;AAEG;AACI,MAAM,eAAe,GAAG,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,EAAwB,KAAI;AACnF,IAAA,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAGG,sBAAK,CAAC,QAAQ,CAAC,KAAK,CAAC;AAEjD,IAAA,MAAM,UAAU,GAAGC,iBAAW,CAAC,MAAK;AAClC,QAAA,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC;AACnC,QAAA,IAAI,MAAM;AAAE,YAAA,MAAM,EAAE;QACpB,SAAS,CAAC,IAAI,CAAC;QACf,UAAU,CAAC,MAAM,SAAS,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC;AAC1C,KAAC,EAAE,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;AAElB,IAAA,QACED,sBAAA,CAAA,aAAA,CAACE,eAAO,EAAA,EAAC,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG,mBAAmB,EAAA;AACrD,QAAAF,sBAAA,CAAA,aAAA,CAAC,QAAQ,EACP,EAAA,OAAO,EAAC,MAAM,EACd,IAAI,EAAC,IAAI,EACT,SAAS,EAAE,SAAS,EACR,YAAA,EAAA,CAAA,EAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAA,EAAA,EAAK,IAAI,CAAgB,cAAA,CAAA,EAClE,QAAQ,EACN,MAAM,IACJA,sBAAA,CAAA,aAAA,CAACG,~~uBAAW~~,EAAC,EAAA,KAAK,EAAEC,aAAM,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,EAAM,GAAA,SAAS,EAAI,CAAA,KAElEJ,sBAAA,CAAA,aAAA,CAACK,~~2BAAa~~,EAAC,EAAA,KAAK,EAAED,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,EAAM,GAAA,SAAS,EAAI,CAAA,CACpE,EAEH,OAAO,EAAE,UAAU,EACnB,CAAA,CACM;AAEd;;;;"}
1	+ {"version":3,"file":"CopyToClipboard.cjs","sources":["../../../src/components/CopyToClipboard/CopyToClipboard.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\n\nimport styled from 'styled-components';\nimport { Tooltip } from '../Tooltip';\nimport { colors } from '../../theme/modules/colors';\nimport { SuccessIcon, ClipboardIcon } from '../../icons';\nimport { sizes } from '../../theme/modules/sizes';\nimport { Button } from '../Button';\n\nexport interface CopyToClipboardProps {\n className?: string;\n text: string;\n onCopy?: () => void;\n}\n\nconst iconSizes = { width: sizes.base, height: sizes.base };\n\n/*\n Created in here to fix orders table sizes. Bad pattern to use in main button component, as\n * touch target is below A11y guidelines.\n /\nconst XSButton = styled(Button)`\n padding: 1px;\n height: unset;\n\n span {\n height: ${sizes.base};\n width: ${sizes.base};\n top: unset;\n }\n`;\n\n/\n A dynamic button to facilitate copying text to a users' keyboard when clicked.\n */\nexport const CopyToClipboard = ({ className, text, onCopy }: CopyToClipboardProps) => {\n const [copied, setCopied] = React.useState(false);\n\n const handleCopy = useCallback(() => {\n navigator.clipboard.writeText(text);\n if (onCopy) onCopy();\n setCopied(true);\n setTimeout(() => setCopied(false), 2500);\n }, [onCopy, text]);\n\n return (\n <Tooltip text={copied ? 'Copied!' : 'Copy to clipboard'}>\n <XSButton\n variant=\"flat\"\n size=\"sm\"\n className={className}\n aria-label={`${copied ? 'Copied' : 'Copy'} \"${text}\" to clipboard`}\n iconSlot={\n copied ? (\n <SuccessIcon color={colors.secondary.green.base} {...iconSizes} />\n ) : (\n <ClipboardIcon color={colors.secondary.blue.base} {...iconSizes} />\n )\n }\n onClick={handleCopy}\n />\n </Tooltip>\n );\n};\n"],"names":["sizes","styled","Button","React","useCallback","Tooltip","SuccessIcon","colors","ClipboardIcon"],"mappings":";;;;;;;;;;;;;;;;AAeA,MAAM,SAAS,GAAG,EAAE,KAAK,EAAEA,WAAK,CAAC,IAAI,EAAE,MAAM,EAAEA,WAAK,CAAC,IAAI,EAAE;AAE3D;;;AAGG;AACH,MAAM,QAAQ,GAAGC,uBAAM,CAACC,aAAM,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,eAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,qCAAA,EAKjBF,WAAK,CAAC,IAAI,CACX,OAAA,EAAAA,WAAK,CAAC,IAAI,cAGtB;AAED;;AAEG;AACI,MAAM,eAAe,GAAG,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,EAAwB,KAAI;AACnF,IAAA,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAGG,sBAAK,CAAC,QAAQ,CAAC,KAAK,CAAC;AAEjD,IAAA,MAAM,UAAU,GAAGC,iBAAW,CAAC,MAAK;AAClC,QAAA,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC;AACnC,QAAA,IAAI,MAAM;AAAE,YAAA,MAAM,EAAE;QACpB,SAAS,CAAC,IAAI,CAAC;QACf,UAAU,CAAC,MAAM,SAAS,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC;AAC1C,KAAC,EAAE,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;AAElB,IAAA,QACED,sBAAA,CAAA,aAAA,CAACE,eAAO,EAAA,EAAC,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG,mBAAmB,EAAA;AACrD,QAAAF,sBAAA,CAAA,aAAA,CAAC,QAAQ,EACP,EAAA,OAAO,EAAC,MAAM,EACd,IAAI,EAAC,IAAI,EACT,SAAS,EAAE,SAAS,EACR,YAAA,EAAA,CAAA,EAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAA,EAAA,EAAK,IAAI,CAAgB,cAAA,CAAA,EAClE,QAAQ,EACN,MAAM,IACJA,sBAAA,CAAA,aAAA,CAACG,0BAAW,EAAC,EAAA,KAAK,EAAEC,aAAM,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,EAAM,GAAA,SAAS,EAAI,CAAA,KAElEJ,sBAAA,CAAA,aAAA,CAACK,4BAAa,EAAC,EAAA,KAAK,EAAED,aAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,EAAM,GAAA,SAAS,EAAI,CAAA,CACpE,EAEH,OAAO,EAAE,UAAU,EACnB,CAAA,CACM;AAEd;;;;"}

package/dist/components/CopyToClipboard/CopyToClipboard.js CHANGED Viewed

@@ -2,10 +2,10 @@ import React__default, { useCallback } from 'react';
 import styled from 'styled-components';
 import { Tooltip } from '../Tooltip/Tooltip.js';
 import { colors } from '../../theme/modules/colors.js';
-import { SuccessIcon } from '../../icons/SuccessIcon.js';
+import { ReactComponent as ClipboardIcon } from '../../icons/design-system/components/ClipboardIcon.js';
+import { ReactComponent as SuccessIcon } from '../../icons/design-system/components/SuccessIcon.js';
 import { sizes } from '../../theme/modules/sizes.js';
 import { Button } from '../Button/Button.js';
-import { ClipboardIcon } from '../../icons/ClipboardIcon.js';
 const iconSizes = { width: sizes.base, height: sizes.base };
 /**

package/dist/components/CopyToClipboard/CopyToClipboard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CopyToClipboard.js","sources":["../../../src/components/CopyToClipboard/CopyToClipboard.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\n\nimport styled from 'styled-components';\nimport { Tooltip } from '../Tooltip';\nimport { colors } from '../../theme/modules/colors';\nimport { SuccessIcon } from '../../icons~~/SuccessIcon~~';\nimport { sizes } from '../../theme/modules/sizes';\nimport { Button } from '../Button';\~~nimport { ClipboardIcon } from '../../icons/ClipboardIcon';\~~n\nexport interface CopyToClipboardProps {\n className?: string;\n text: string;\n onCopy?: () => void;\n}\n\nconst iconSizes = { width: sizes.base, height: sizes.base };\n\n/*\n Created in here to fix orders table sizes. Bad pattern to use in main button component, as\n * touch target is below A11y guidelines.\n /\nconst XSButton = styled(Button)`\n padding: 1px;\n height: unset;\n\n span {\n height: ${sizes.base};\n width: ${sizes.base};\n top: unset;\n }\n`;\n\n/\n A dynamic button to facilitate copying text to a users' keyboard when clicked.\n */\nexport const CopyToClipboard = ({ className, text, onCopy }: CopyToClipboardProps) => {\n const [copied, setCopied] = React.useState(false);\n\n const handleCopy = useCallback(() => {\n navigator.clipboard.writeText(text);\n if (onCopy) onCopy();\n setCopied(true);\n setTimeout(() => setCopied(false), 2500);\n }, [onCopy, text]);\n\n return (\n <Tooltip text={copied ? 'Copied!' : 'Copy to clipboard'}>\n <XSButton\n variant=\"flat\"\n size=\"sm\"\n className={className}\n aria-label={`${copied ? 'Copied' : 'Copy'} \"${text}\" to clipboard`}\n iconSlot={\n copied ? (\n <SuccessIcon color={colors.secondary.green.base} {...iconSizes} />\n ) : (\n <ClipboardIcon color={colors.secondary.blue.base} {...iconSizes} />\n )\n }\n onClick={handleCopy}\n />\n </Tooltip>\n );\n};\n"],"names":["React"],"mappings":";;;;;;;;;~~AAgBA~~,MAAM,SAAS,GAAG,EAAE,KAAK,EAAE,KAAK,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,CAAC,IAAI,EAAE;AAE3D;;;AAGG;AACH,MAAM,QAAQ,GAAG,MAAM,CAAC,MAAM,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,eAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,qCAAA,EAKjB,KAAK,CAAC,IAAI,CACX,OAAA,EAAA,KAAK,CAAC,IAAI,cAGtB;AAED;;AAEG;AACI,MAAM,eAAe,GAAG,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,EAAwB,KAAI;AACnF,IAAA,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAGA,cAAK,CAAC,QAAQ,CAAC,KAAK,CAAC;AAEjD,IAAA,MAAM,UAAU,GAAG,WAAW,CAAC,MAAK;AAClC,QAAA,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC;AACnC,QAAA,IAAI,MAAM;AAAE,YAAA,MAAM,EAAE;QACpB,SAAS,CAAC,IAAI,CAAC;QACf,UAAU,CAAC,MAAM,SAAS,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC;AAC1C,KAAC,EAAE,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;AAElB,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,OAAO,EAAA,EAAC,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG,mBAAmB,EAAA;AACrD,QAAAA,cAAA,CAAA,aAAA,CAAC,QAAQ,EACP,EAAA,OAAO,EAAC,MAAM,EACd,IAAI,EAAC,IAAI,EACT,SAAS,EAAE,SAAS,EACR,YAAA,EAAA,CAAA,EAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAA,EAAA,EAAK,IAAI,CAAgB,cAAA,CAAA,EAClE,QAAQ,EACN,MAAM,IACJA,cAAA,CAAA,aAAA,CAAC,WAAW,EAAC,EAAA,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,EAAM,GAAA,SAAS,EAAI,CAAA,KAElEA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAC,EAAA,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,EAAM,GAAA,SAAS,EAAI,CAAA,CACpE,EAEH,OAAO,EAAE,UAAU,EACnB,CAAA,CACM;AAEd;;;;"}
1	+ {"version":3,"file":"CopyToClipboard.js","sources":["../../../src/components/CopyToClipboard/CopyToClipboard.tsx"],"sourcesContent":["import React, { useCallback } from 'react';\n\nimport styled from 'styled-components';\nimport { Tooltip } from '../Tooltip';\nimport { colors } from '../../theme/modules/colors';\nimport { SuccessIcon, ClipboardIcon } from '../../icons';\nimport { sizes } from '../../theme/modules/sizes';\nimport { Button } from '../Button';\n\nexport interface CopyToClipboardProps {\n className?: string;\n text: string;\n onCopy?: () => void;\n}\n\nconst iconSizes = { width: sizes.base, height: sizes.base };\n\n/*\n Created in here to fix orders table sizes. Bad pattern to use in main button component, as\n * touch target is below A11y guidelines.\n /\nconst XSButton = styled(Button)`\n padding: 1px;\n height: unset;\n\n span {\n height: ${sizes.base};\n width: ${sizes.base};\n top: unset;\n }\n`;\n\n/\n A dynamic button to facilitate copying text to a users' keyboard when clicked.\n */\nexport const CopyToClipboard = ({ className, text, onCopy }: CopyToClipboardProps) => {\n const [copied, setCopied] = React.useState(false);\n\n const handleCopy = useCallback(() => {\n navigator.clipboard.writeText(text);\n if (onCopy) onCopy();\n setCopied(true);\n setTimeout(() => setCopied(false), 2500);\n }, [onCopy, text]);\n\n return (\n <Tooltip text={copied ? 'Copied!' : 'Copy to clipboard'}>\n <XSButton\n variant=\"flat\"\n size=\"sm\"\n className={className}\n aria-label={`${copied ? 'Copied' : 'Copy'} \"${text}\" to clipboard`}\n iconSlot={\n copied ? (\n <SuccessIcon color={colors.secondary.green.base} {...iconSizes} />\n ) : (\n <ClipboardIcon color={colors.secondary.blue.base} {...iconSizes} />\n )\n }\n onClick={handleCopy}\n />\n </Tooltip>\n );\n};\n"],"names":["React"],"mappings":";;;;;;;;;AAeA,MAAM,SAAS,GAAG,EAAE,KAAK,EAAE,KAAK,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,CAAC,IAAI,EAAE;AAE3D;;;AAGG;AACH,MAAM,QAAQ,GAAG,MAAM,CAAC,MAAM,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,eAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,qCAAA,EAKjB,KAAK,CAAC,IAAI,CACX,OAAA,EAAA,KAAK,CAAC,IAAI,cAGtB;AAED;;AAEG;AACI,MAAM,eAAe,GAAG,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,EAAwB,KAAI;AACnF,IAAA,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAGA,cAAK,CAAC,QAAQ,CAAC,KAAK,CAAC;AAEjD,IAAA,MAAM,UAAU,GAAG,WAAW,CAAC,MAAK;AAClC,QAAA,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC;AACnC,QAAA,IAAI,MAAM;AAAE,YAAA,MAAM,EAAE;QACpB,SAAS,CAAC,IAAI,CAAC;QACf,UAAU,CAAC,MAAM,SAAS,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC;AAC1C,KAAC,EAAE,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;AAElB,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,OAAO,EAAA,EAAC,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG,mBAAmB,EAAA;AACrD,QAAAA,cAAA,CAAA,aAAA,CAAC,QAAQ,EACP,EAAA,OAAO,EAAC,MAAM,EACd,IAAI,EAAC,IAAI,EACT,SAAS,EAAE,SAAS,EACR,YAAA,EAAA,CAAA,EAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAA,EAAA,EAAK,IAAI,CAAgB,cAAA,CAAA,EAClE,QAAQ,EACN,MAAM,IACJA,cAAA,CAAA,aAAA,CAAC,WAAW,EAAC,EAAA,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,EAAM,GAAA,SAAS,EAAI,CAAA,KAElEA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAC,EAAA,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,EAAM,GAAA,SAAS,EAAI,CAAA,CACpE,EAEH,OAAO,EAAE,UAAU,EACnB,CAAA,CACM;AAEd;;;;"}

package/dist/components/DataGrid/components/CellContent/ExpandButton/ExpandButton.cjs CHANGED Viewed

@@ -1,9 +1,8 @@
 'use strict';
 var React = require('react');
-var DownArrowIcon = require('../../../../../icons/DownArrowIcon.cjs');
-var RightArrowIcon = require('../../../../../icons/RightArrowIcon.cjs');
-require('../../../../../theme/modules/sizes.cjs');
+var DownArrowIcon = require('../../../../../icons/design-system/components/DownArrowIcon.cjs');
+var RightArrowIcon = require('../../../../../icons/design-system/components/RightArrowIcon.cjs');
 var Button = require('../../../../Button/Button.cjs');
 var ExpandButton_module = require('./ExpandButton.module.scss.cjs');
@@ -13,7 +12,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 const ExpandButton = ({ isExpanded, onToggle, containerStyle }) => {
     return (React__default.default.createElement("div", { className: ExpandButton_module.expandButtonContainer, style: containerStyle },
-        React__default.default.createElement(Button.Button, { size: "sm", variant: "flat", className: ExpandButton_module.expandButton, iconSlot: isExpanded ? React__default.default.createElement(DownArrowIcon.DownArrowIcon, null) : React__default.default.createElement(RightArrowIcon.RightArrowIcon, null), onClick: onToggle, "aria-label": isExpanded ? 'Collapse row' : 'Expand row', "aria-expanded": isExpanded })));
+        React__default.default.createElement(Button.Button, { size: "sm", variant: "flat", className: ExpandButton_module.expandButton, iconSlot: isExpanded ? React__default.default.createElement(DownArrowIcon.ReactComponent, null) : React__default.default.createElement(RightArrowIcon.ReactComponent, null), onClick: onToggle, "aria-label": isExpanded ? 'Collapse row' : 'Expand row', "aria-expanded": isExpanded })));
 };
 exports.ExpandButton = ExpandButton;

package/dist/components/DataGrid/components/CellContent/ExpandButton/ExpandButton.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ExpandButton.cjs","sources":["../../../../../../src/components/DataGrid/components/CellContent/ExpandButton/ExpandButton.tsx"],"sourcesContent":["import React from 'react';\n\nimport { DownArrowIcon, RightArrowIcon } from '../../../../../icons';\nimport { Button } from '../../../../Button';\n\nimport styles from './ExpandButton.module.scss';\n\ntype ExpandButtonProps = {\n isExpanded: boolean;\n onToggle: () => void;\n containerStyle?: React.CSSProperties;\n};\n\nconst ExpandButton = ({ isExpanded, onToggle, containerStyle }: ExpandButtonProps) => {\n return (\n <div className={styles.expandButtonContainer} style={containerStyle}>\n <Button\n size=\"sm\"\n variant=\"flat\"\n className={styles.expandButton}\n iconSlot={isExpanded ? <DownArrowIcon /> : <RightArrowIcon />}\n onClick={onToggle}\n aria-label={isExpanded ? 'Collapse row' : 'Expand row'}\n aria-expanded={isExpanded}\n />\n </div>\n );\n};\n\nexport { ExpandButton };\nexport type { ExpandButtonProps };\n"],"names":["React","styles","Button","DownArrowIcon","RightArrowIcon"],"mappings":"~~;;;;;;;;;;;;;~~AAaM,MAAA,YAAY,GAAG,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAqB,KAAI;IACnF,QACEA,sBAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEC,mBAAM,CAAC,qBAAqB,EAAE,KAAK,EAAE,cAAc,EAAA;QACjED,sBAAC,CAAA,aAAA,CAAAE,aAAM,IACL,IAAI,EAAC,IAAI,EACT,OAAO,EAAC,MAAM,EACd,SAAS,EAAED,mBAAM,CAAC,YAAY,EAC9B,QAAQ,EAAE,UAAU,GAAGD,sBAAA,CAAA,aAAA,CAACG,~~2BAAa~~,EAAA,IAAA,CAAG,GAAGH,qCAACI,6BAAc,EAAA,IAAA,CAAG,EAC7D,OAAO,EAAE,QAAQ,EAAA,YAAA,EACL,UAAU,GAAG,cAAc,GAAG,YAAY,mBACvC,UAAU,EAAA,CACzB,CACE;AAEV;;;;"}
1	+ {"version":3,"file":"ExpandButton.cjs","sources":["../../../../../../src/components/DataGrid/components/CellContent/ExpandButton/ExpandButton.tsx"],"sourcesContent":["import React from 'react';\n\nimport { DownArrowIcon, RightArrowIcon } from '../../../../../icons';\nimport { Button } from '../../../../Button';\n\nimport styles from './ExpandButton.module.scss';\n\ntype ExpandButtonProps = {\n isExpanded: boolean;\n onToggle: () => void;\n containerStyle?: React.CSSProperties;\n};\n\nconst ExpandButton = ({ isExpanded, onToggle, containerStyle }: ExpandButtonProps) => {\n return (\n <div className={styles.expandButtonContainer} style={containerStyle}>\n <Button\n size=\"sm\"\n variant=\"flat\"\n className={styles.expandButton}\n iconSlot={isExpanded ? <DownArrowIcon /> : <RightArrowIcon />}\n onClick={onToggle}\n aria-label={isExpanded ? 'Collapse row' : 'Expand row'}\n aria-expanded={isExpanded}\n />\n </div>\n );\n};\n\nexport { ExpandButton };\nexport type { ExpandButtonProps };\n"],"names":["React","styles","Button","DownArrowIcon","RightArrowIcon"],"mappings":";;;;;;;;;;;;AAaM,MAAA,YAAY,GAAG,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAqB,KAAI;IACnF,QACEA,sBAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEC,mBAAM,CAAC,qBAAqB,EAAE,KAAK,EAAE,cAAc,EAAA;QACjED,sBAAC,CAAA,aAAA,CAAAE,aAAM,IACL,IAAI,EAAC,IAAI,EACT,OAAO,EAAC,MAAM,EACd,SAAS,EAAED,mBAAM,CAAC,YAAY,EAC9B,QAAQ,EAAE,UAAU,GAAGD,sBAAA,CAAA,aAAA,CAACG,4BAAa,EAAA,IAAA,CAAG,GAAGH,qCAACI,6BAAc,EAAA,IAAA,CAAG,EAC7D,OAAO,EAAE,QAAQ,EAAA,YAAA,EACL,UAAU,GAAG,cAAc,GAAG,YAAY,mBACvC,UAAU,EAAA,CACzB,CACE;AAEV;;;;"}

package/dist/components/DataGrid/components/CellContent/ExpandButton/ExpandButton.js CHANGED Viewed

@@ -1,7 +1,6 @@
 import React__default from 'react';
-import { DownArrowIcon } from '../../../../../icons/DownArrowIcon.js';
-import { RightArrowIcon } from '../../../../../icons/RightArrowIcon.js';
-import '../../../../../theme/modules/sizes.js';
+import { ReactComponent as DownArrowIcon } from '../../../../../icons/design-system/components/DownArrowIcon.js';
+import { ReactComponent as RightArrowIcon } from '../../../../../icons/design-system/components/RightArrowIcon.js';
 import { Button } from '../../../../Button/Button.js';
 import styles from './ExpandButton.module.scss.js';

package/dist/components/DataGrid/components/CellContent/ExpandButton/ExpandButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ExpandButton.js","sources":["../../../../../../src/components/DataGrid/components/CellContent/ExpandButton/ExpandButton.tsx"],"sourcesContent":["import React from 'react';\n\nimport { DownArrowIcon, RightArrowIcon } from '../../../../../icons';\nimport { Button } from '../../../../Button';\n\nimport styles from './ExpandButton.module.scss';\n\ntype ExpandButtonProps = {\n isExpanded: boolean;\n onToggle: () => void;\n containerStyle?: React.CSSProperties;\n};\n\nconst ExpandButton = ({ isExpanded, onToggle, containerStyle }: ExpandButtonProps) => {\n return (\n <div className={styles.expandButtonContainer} style={containerStyle}>\n <Button\n size=\"sm\"\n variant=\"flat\"\n className={styles.expandButton}\n iconSlot={isExpanded ? <DownArrowIcon /> : <RightArrowIcon />}\n onClick={onToggle}\n aria-label={isExpanded ? 'Collapse row' : 'Expand row'}\n aria-expanded={isExpanded}\n />\n </div>\n );\n};\n\nexport { ExpandButton };\nexport type { ExpandButtonProps };\n"],"names":["React"],"mappings":"~~;;;;;;;~~AAaM,MAAA,YAAY,GAAG,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAqB,KAAI;IACnF,QACEA,cAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,qBAAqB,EAAE,KAAK,EAAE,cAAc,EAAA;QACjEA,cAAC,CAAA,aAAA,CAAA,MAAM,IACL,IAAI,EAAC,IAAI,EACT,OAAO,EAAC,MAAM,EACd,SAAS,EAAE,MAAM,CAAC,YAAY,EAC9B,QAAQ,EAAE,UAAU,GAAGA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,IAAA,CAAG,GAAGA,6BAAC,cAAc,EAAA,IAAA,CAAG,EAC7D,OAAO,EAAE,QAAQ,EAAA,YAAA,EACL,UAAU,GAAG,cAAc,GAAG,YAAY,mBACvC,UAAU,EAAA,CACzB,CACE;AAEV;;;;"}
1	+ {"version":3,"file":"ExpandButton.js","sources":["../../../../../../src/components/DataGrid/components/CellContent/ExpandButton/ExpandButton.tsx"],"sourcesContent":["import React from 'react';\n\nimport { DownArrowIcon, RightArrowIcon } from '../../../../../icons';\nimport { Button } from '../../../../Button';\n\nimport styles from './ExpandButton.module.scss';\n\ntype ExpandButtonProps = {\n isExpanded: boolean;\n onToggle: () => void;\n containerStyle?: React.CSSProperties;\n};\n\nconst ExpandButton = ({ isExpanded, onToggle, containerStyle }: ExpandButtonProps) => {\n return (\n <div className={styles.expandButtonContainer} style={containerStyle}>\n <Button\n size=\"sm\"\n variant=\"flat\"\n className={styles.expandButton}\n iconSlot={isExpanded ? <DownArrowIcon /> : <RightArrowIcon />}\n onClick={onToggle}\n aria-label={isExpanded ? 'Collapse row' : 'Expand row'}\n aria-expanded={isExpanded}\n />\n </div>\n );\n};\n\nexport { ExpandButton };\nexport type { ExpandButtonProps };\n"],"names":["React"],"mappings":";;;;;;AAaM,MAAA,YAAY,GAAG,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAqB,KAAI;IACnF,QACEA,cAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,qBAAqB,EAAE,KAAK,EAAE,cAAc,EAAA;QACjEA,cAAC,CAAA,aAAA,CAAA,MAAM,IACL,IAAI,EAAC,IAAI,EACT,OAAO,EAAC,MAAM,EACd,SAAS,EAAE,MAAM,CAAC,YAAY,EAC9B,QAAQ,EAAE,UAAU,GAAGA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,IAAA,CAAG,GAAGA,6BAAC,cAAc,EAAA,IAAA,CAAG,EAC7D,OAAO,EAAE,QAAQ,EAAA,YAAA,EACL,UAAU,GAAG,cAAc,GAAG,YAAY,mBACvC,UAAU,EAAA,CACzB,CACE;AAEV;;;;"}

package/dist/components/DataGrid/components/Header/HeaderCell/SortIcon/SortIcon.cjs CHANGED Viewed

@@ -2,10 +2,10 @@
 var React = require('react');
 var index = require('../../../../../../theme/index.cjs');
-var ArrowDownIcon = require('../../../../../../icons/ArrowDownIcon.cjs');
-var ArrowUpIcon = require('../../../../../../icons/ArrowUpIcon.cjs');
-var DoubleArrowIcon = require('../../../../../../icons/DoubleArrowIcon.cjs');
-require('../../../../../../theme/modules/sizes.cjs');
+var sizes = require('../../../../../../theme/modules/sizes.cjs');
+var ArrowDownIcon = require('../../../../../../icons/design-system/components/ArrowDownIcon.cjs');
+var ArrowUpIcon = require('../../../../../../icons/design-system/components/ArrowUpIcon.cjs');
+var DoubleArrowIcon = require('../../../../../../icons/design-system/components/DoubleArrowIcon.cjs');
 var HeaderCell_module = require('../HeaderCell.module.scss.cjs');
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
@@ -18,9 +18,9 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 const SortIcon = ({ isSorted }) => {
     const icon = React.useMemo(() => {
         if (!isSorted) {
-            return React__default.default.createElement(DoubleArrowIcon.DoubleArrowIcon, { size: 5 });
+            return React__default.default.createElement(DoubleArrowIcon.ReactComponent, { width: sizes.sizes[5] });
         }
-        return isSorted === 'asc' ? (React__default.default.createElement(ArrowUpIcon.ArrowUpIcon, { color: index.theme.colors.neutral.ink.dark, size: 5 })) : (React__default.default.createElement(ArrowDownIcon.ArrowDownIcon, { color: index.theme.colors.neutral.ink.dark, size: 5 }));
+        return isSorted === 'asc' ? (React__default.default.createElement(ArrowUpIcon.ReactComponent, { color: index.theme.colors.neutral.ink.dark })) : (React__default.default.createElement(ArrowDownIcon.ReactComponent, { color: index.theme.colors.neutral.ink.dark }));
     }, [isSorted]);
     return React__default.default.createElement("span", { className: HeaderCell_module.sortIcon }, icon);
 };

package/dist/components/DataGrid/components/Header/HeaderCell/SortIcon/SortIcon.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SortIcon.cjs","sources":["../../../../../../../src/components/DataGrid/components/Header/HeaderCell/SortIcon/SortIcon.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\n\nimport { SortDirection } from '@tanstack/react-table';\n\nimport { theme } from 'Theme';\n\nimport { ArrowDownIcon, ArrowUpIcon, DoubleArrowIcon } from '../../../../../../icons';\nimport styles from '../HeaderCell.module.scss';\n\ntype SortIconProps = {\n isSorted?: boolean \| SortDirection;\n};\n\n/*\n Sort icon for a column header.\n */\nexport const SortIcon = ({ isSorted }: SortIconProps) => {\n const icon = useMemo(() => {\n if (!isSorted) {\n return <DoubleArrowIcon ~~size~~={5} />;\n }\n\n return isSorted === 'asc' ? (\n <ArrowUpIcon color={theme.colors.neutral.ink.dark} ~~size={5}~~ />\n ) : (\n <ArrowDownIcon color={theme.colors.neutral.ink.dark} ~~size={5}~~ />\n );\n }, [isSorted]);\n\n return <span className={styles.sortIcon}>{icon}</span>;\n};\n"],"names":["useMemo","React","DoubleArrowIcon","ArrowUpIcon","theme","ArrowDownIcon","styles"],"mappings":";;;;;;;;;;;;;;~~AAaA~~;;AAEG;MACU,QAAQ,GAAG,CAAC,EAAE,QAAQ,EAAiB,KAAI;AACtD,IAAA,MAAM,IAAI,GAAGA,aAAO,CAAC,MAAK;QACxB,IAAI,CAAC,QAAQ,EAAE;~~AACb~~,~~YAAA,~~OAAOC,~~qCAACC,+BAAe~~,EAAA,EAAC,~~IAAI~~,~~EAAE~~,CAAC,~~GAAI~~;~~AACpC~~;~~QAED~~,OAAO,QAAQ,KAAK,KAAK,~~IACvBD~~,sBAAC,CAAA,aAAA,~~CAAAE~~,~~uBAAW~~,~~EAAC~~,~~EAAA,~~KAAK,EAAEC,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,~~EAAE,IAAI,EAAE,CAAC,~~GAAI,~~KAE9DH~~,~~sBAAA~~,~~CAAA~~,~~aAAA~~,~~CAACI,2BAAa,~~EAAC,~~EAAA,~~KAAK,EAAED,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,~~EAAE~~,~~IAAI~~,~~EAAE,CAAC,EAAI,CAAA,CACjE~~;AACH,KAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;IAEd,~~OAAOH~~,sBAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,~~EAAEK~~,iBAAM,CAAC,QAAQ,EAAA,EAAG,IAAI,CAAQ;AACxD;;;;"}
1	+ {"version":3,"file":"SortIcon.cjs","sources":["../../../../../../../src/components/DataGrid/components/Header/HeaderCell/SortIcon/SortIcon.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\n\nimport { SortDirection } from '@tanstack/react-table';\n\nimport { theme } from 'Theme';\n\nimport { sizes } from 'Theme/modules/sizes';\nimport { ArrowDownIcon, ArrowUpIcon, DoubleArrowIcon } from '../../../../../../icons';\nimport styles from '../HeaderCell.module.scss';\n\ntype SortIconProps = {\n isSorted?: boolean \| SortDirection;\n};\n\n/*\n Sort icon for a column header.\n */\nexport const SortIcon = ({ isSorted }: SortIconProps) => {\n const icon = useMemo(() => {\n if (!isSorted) {\n return <DoubleArrowIcon width={sizes[5]} />;\n }\n\n return isSorted === 'asc' ? (\n <ArrowUpIcon color={theme.colors.neutral.ink.dark} />\n ) : (\n <ArrowDownIcon color={theme.colors.neutral.ink.dark} />\n );\n }, [isSorted]);\n\n return <span className={styles.sortIcon}>{icon}</span>;\n};\n"],"names":["useMemo","React","DoubleArrowIcon","sizes","ArrowUpIcon","theme","ArrowDownIcon","styles"],"mappings":";;;;;;;;;;;;;;AAcA;;AAEG;MACU,QAAQ,GAAG,CAAC,EAAE,QAAQ,EAAiB,KAAI;AACtD,IAAA,MAAM,IAAI,GAAGA,aAAO,CAAC,MAAK;QACxB,IAAI,CAAC,QAAQ,EAAE;YACb,OAAOC,sBAAA,CAAA,aAAA,CAACC,8BAAe,EAAA,EAAC,KAAK,EAAEC,WAAK,CAAC,CAAC,CAAC,EAAA,CAAI;AAC5C;AAED,QAAA,OAAO,QAAQ,KAAK,KAAK,IACvBF,sBAAC,CAAA,aAAA,CAAAG,0BAAW,IAAC,KAAK,EAAEC,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,GAAI,KAErDJ,qCAACK,4BAAa,EAAA,EAAC,KAAK,EAAED,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,EAAA,CAAI,CACxD;AACH,KAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;IAEd,OAAOJ,sBAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAEM,iBAAM,CAAC,QAAQ,EAAA,EAAG,IAAI,CAAQ;AACxD;;;;"}

package/dist/components/DataGrid/components/Header/HeaderCell/SortIcon/SortIcon.js CHANGED Viewed

@@ -1,9 +1,9 @@
 import React__default, { useMemo } from 'react';
 import { theme } from '../../../../../../theme/index.js';
-import { ArrowDownIcon } from '../../../../../../icons/ArrowDownIcon.js';
-import { ArrowUpIcon } from '../../../../../../icons/ArrowUpIcon.js';
-import { DoubleArrowIcon } from '../../../../../../icons/DoubleArrowIcon.js';
-import '../../../../../../theme/modules/sizes.js';
+import { sizes } from '../../../../../../theme/modules/sizes.js';
+import { ReactComponent as ArrowDownIcon } from '../../../../../../icons/design-system/components/ArrowDownIcon.js';
+import { ReactComponent as ArrowUpIcon } from '../../../../../../icons/design-system/components/ArrowUpIcon.js';
+import { ReactComponent as DoubleArrowIcon } from '../../../../../../icons/design-system/components/DoubleArrowIcon.js';
 import styles from '../HeaderCell.module.scss.js';
 /**
@@ -12,9 +12,9 @@ import styles from '../HeaderCell.module.scss.js';
 const SortIcon = ({ isSorted }) => {
     const icon = useMemo(() => {
         if (!isSorted) {
-            return React__default.createElement(DoubleArrowIcon, { size: 5 });
+            return React__default.createElement(DoubleArrowIcon, { width: sizes[5] });
         }
-        return isSorted === 'asc' ? (React__default.createElement(ArrowUpIcon, { color: theme.colors.neutral.ink.dark, size: 5 })) : (React__default.createElement(ArrowDownIcon, { color: theme.colors.neutral.ink.dark, size: 5 }));
+        return isSorted === 'asc' ? (React__default.createElement(ArrowUpIcon, { color: theme.colors.neutral.ink.dark })) : (React__default.createElement(ArrowDownIcon, { color: theme.colors.neutral.ink.dark }));
     }, [isSorted]);
     return React__default.createElement("span", { className: styles.sortIcon }, icon);
 };

package/dist/components/DataGrid/components/Header/HeaderCell/SortIcon/SortIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SortIcon.js","sources":["../../../../../../../src/components/DataGrid/components/Header/HeaderCell/SortIcon/SortIcon.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\n\nimport { SortDirection } from '@tanstack/react-table';\n\nimport { theme } from 'Theme';\n\nimport { ArrowDownIcon, ArrowUpIcon, DoubleArrowIcon } from '../../../../../../icons';\nimport styles from '../HeaderCell.module.scss';\n\ntype SortIconProps = {\n isSorted?: boolean \| SortDirection;\n};\n\n/*\n Sort icon for a column header.\n */\nexport const SortIcon = ({ isSorted }: SortIconProps) => {\n const icon = useMemo(() => {\n if (!isSorted) {\n return <DoubleArrowIcon ~~size~~={5} />;\n }\n\n return isSorted === 'asc' ? (\n <ArrowUpIcon color={theme.colors.neutral.ink.dark} ~~size={5}~~ />\n ) : (\n <ArrowDownIcon color={theme.colors.neutral.ink.dark} ~~size={5}~~ />\n );\n }, [isSorted]);\n\n return <span className={styles.sortIcon}>{icon}</span>;\n};\n"],"names":["React"],"mappings":";;;;;;;;~~AAaA~~;;AAEG;MACU,QAAQ,GAAG,CAAC,EAAE,QAAQ,EAAiB,KAAI;AACtD,IAAA,MAAM,IAAI,GAAG,OAAO,CAAC,MAAK;QACxB,IAAI,CAAC,QAAQ,EAAE;~~AACb~~,~~YAAA,~~OAAOA,~~6BAAC~~,eAAe,EAAA,EAAC,~~IAAI~~,EAAE,CAAC,~~GAAI~~;~~AACpC~~;~~QAED~~,OAAO,QAAQ,KAAK,KAAK,IACvBA,cAAC,CAAA,aAAA,CAAA,WAAW,~~EAAC~~,~~EAAA,~~KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,~~EAAE,IAAI,EAAE,CAAC,~~GAAI,~~KAE9DA~~,~~cAAA~~,~~CAAA~~,~~aAAA~~,~~CAAC,aAAa,~~EAAC,~~EAAA,~~KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,~~EAAE~~,~~IAAI~~,~~EAAE,CAAC,EAAI,CAAA,CACjE~~;AACH,KAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;IAEd,OAAOA,cAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,MAAM,CAAC,QAAQ,EAAA,EAAG,IAAI,CAAQ;AACxD;;;;"}
1	+ {"version":3,"file":"SortIcon.js","sources":["../../../../../../../src/components/DataGrid/components/Header/HeaderCell/SortIcon/SortIcon.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\n\nimport { SortDirection } from '@tanstack/react-table';\n\nimport { theme } from 'Theme';\n\nimport { sizes } from 'Theme/modules/sizes';\nimport { ArrowDownIcon, ArrowUpIcon, DoubleArrowIcon } from '../../../../../../icons';\nimport styles from '../HeaderCell.module.scss';\n\ntype SortIconProps = {\n isSorted?: boolean \| SortDirection;\n};\n\n/*\n Sort icon for a column header.\n */\nexport const SortIcon = ({ isSorted }: SortIconProps) => {\n const icon = useMemo(() => {\n if (!isSorted) {\n return <DoubleArrowIcon width={sizes[5]} />;\n }\n\n return isSorted === 'asc' ? (\n <ArrowUpIcon color={theme.colors.neutral.ink.dark} />\n ) : (\n <ArrowDownIcon color={theme.colors.neutral.ink.dark} />\n );\n }, [isSorted]);\n\n return <span className={styles.sortIcon}>{icon}</span>;\n};\n"],"names":["React"],"mappings":";;;;;;;;AAcA;;AAEG;MACU,QAAQ,GAAG,CAAC,EAAE,QAAQ,EAAiB,KAAI;AACtD,IAAA,MAAM,IAAI,GAAG,OAAO,CAAC,MAAK;QACxB,IAAI,CAAC,QAAQ,EAAE;YACb,OAAOA,cAAA,CAAA,aAAA,CAAC,eAAe,EAAA,EAAC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,EAAA,CAAI;AAC5C;AAED,QAAA,OAAO,QAAQ,KAAK,KAAK,IACvBA,cAAC,CAAA,aAAA,CAAA,WAAW,IAAC,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,GAAI,KAErDA,6BAAC,aAAa,EAAA,EAAC,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,EAAA,CAAI,CACxD;AACH,KAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;IAEd,OAAOA,cAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,MAAM,CAAC,QAAQ,EAAA,EAAG,IAAI,CAAQ;AACxD;;;;"}