@veeqo/ui 13.0.0 → 13.2.0

package/dist/components/SelectDropdown/components/ListItem/ListItem.js

@@ -8,9 +8,9 @@ import { buildClassnames } from '../../../../utils/buildClassnames.js';
 import 'uid/secure';
 import itemStyles from '../item.module.scss.js';
 
-const ListItem = ({ id, label, href, appearance = 'primary', className, ...props }) => {
+const ListItem = ({ id, label, href, appearance = 'primary', shouldDisableSelectionRender = false, className, ...props }) => {
     const idComputed = useId({ id, prefix: 'list-item' });
-    return (React__default.createElement(ListBoxItem, { id: idComputed, textValue: label, href: href, className: buildClassnames([itemStyles.item, itemStyles[`appearance-${appearance}`], className]), ...props }, ({ selectionMode, allowsDragging, isSelected, isHovered }) => (React__default.createElement(ItemContent, { selectionMode: selectionMode, allowsDragging: allowsDragging, isSelected: isSelected, isHovered: isHovered, label: label, isLink: Boolean(href), appearance: appearance, itemType: "list", ...props }))));
+    return (React__default.createElement(ListBoxItem, { id: idComputed, textValue: label, href: href, className: buildClassnames([itemStyles.item, itemStyles[`appearance-${appearance}`], className]), ...props }, ({ selectionMode, allowsDragging, isSelected, isHovered }) => (React__default.createElement(ItemContent, { selectionMode: selectionMode, allowsDragging: allowsDragging, isSelected: isSelected, isHovered: isHovered, label: label, isLink: Boolean(href), appearance: appearance, itemType: "list", shouldDisableSelectionRender: shouldDisableSelectionRender, ...props }))));
 };
 
 export { ListItem };

package/dist/components/SelectDropdown/components/ListItem/ListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.js","sources":["../../../../../src/components/SelectDropdown/components/ListItem/ListItem.tsx"],"sourcesContent":["import React from 'react';\nimport { ListBoxItem, ListBoxItemRenderProps } from 'react-aria-components';\nimport { useId } from '../../../../hooks';\nimport { ListItemProps } from './types';\nimport { ItemContent } from '../ItemContent';\nimport { buildClassnames } from '../../../../utils';\n\nimport styles from '../item.module.scss';\n\nexport const ListItem = ({\n  id,\n  label,\n  href,\n  appearance = 'primary',\n  className,\n  ...props\n}: ListItemProps) => {\n  const idComputed = useId({ id, prefix: 'list-item' });\n\n  return (\n    <ListBoxItem\n      id={idComputed}\n      textValue={label}\n      href={href}\n      className={buildClassnames([styles.item, styles[`appearance-${appearance}`], className])}\n      {...props}\n    >\n      {/* use react aria's render props to add more such as isHovered */}\n      {({ selectionMode, allowsDragging, isSelected, isHovered }: ListBoxItemRenderProps) => (\n        <ItemContent\n          selectionMode={selectionMode}\n          allowsDragging={allowsDragging}\n          isSelected={isSelected}\n          isHovered={isHovered}\n          label={label}\n          isLink={Boolean(href)}\n          appearance={appearance}\n          itemType=\"list\"\n          {...props}\n        />\n      )}\n    </ListBoxItem>\n  );\n};\n"],"names":["React","styles"],"mappings":";;;;;;;;;;MASa,QAAQ,GAAG,CAAC,EACvB,EAAE,EACF,KAAK,EACL,IAAI,EACJ,UAAU,GAAG,SAAS,EACtB,SAAS,EACT,GAAG,KAAK,EACM,KAAI;AAClB,IAAA,MAAM,UAAU,GAAG,KAAK,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,CAAC;IAErD,QACEA,6BAAC,WAAW,EAAA,EACV,EAAE,EAAE,UAAU,EACd,SAAS,EAAE,KAAK,EAChB,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,eAAe,CAAC,CAACC,UAAM,CAAC,IAAI,EAAEA,UAAM,CAAC,CAAA,WAAA,EAAc,UAAU,CAAE,CAAA,CAAC,EAAE,SAAS,CAAC,CAAC,EACpF,GAAA,KAAK,IAGR,CAAC,EAAE,aAAa,EAAE,cAAc,EAAE,UAAU,EAAE,SAAS,EAA0B,MAChFD,cAAA,CAAA,aAAA,CAAC,WAAW,EACV,EAAA,aAAa,EAAE,aAAa,EAC5B,cAAc,EAAE,cAAc,EAC9B,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,OAAO,CAAC,IAAI,CAAC,EACrB,UAAU,EAAE,UAAU,EACtB,QAAQ,EAAC,MAAM,EAAA,GACX,KAAK,EACT,CAAA,CACH,CACW;AAElB;;;;"}
+{"version":3,"file":"ListItem.js","sources":["../../../../../src/components/SelectDropdown/components/ListItem/ListItem.tsx"],"sourcesContent":["import React from 'react';\nimport { ListBoxItem, ListBoxItemRenderProps } from 'react-aria-components';\nimport { useId } from '../../../../hooks';\nimport { ListItemProps } from './types';\nimport { ItemContent } from '../ItemContent';\nimport { buildClassnames } from '../../../../utils';\n\nimport styles from '../item.module.scss';\n\nexport const ListItem = ({\n  id,\n  label,\n  href,\n  appearance = 'primary',\n  shouldDisableSelectionRender = false,\n  className,\n  ...props\n}: ListItemProps) => {\n  const idComputed = useId({ id, prefix: 'list-item' });\n\n  return (\n    <ListBoxItem\n      id={idComputed}\n      textValue={label}\n      href={href}\n      className={buildClassnames([styles.item, styles[`appearance-${appearance}`], className])}\n      {...props}\n    >\n      {/* use react aria's render props to add more such as isHovered */}\n      {({ selectionMode, allowsDragging, isSelected, isHovered }: ListBoxItemRenderProps) => (\n        <ItemContent\n          selectionMode={selectionMode}\n          allowsDragging={allowsDragging}\n          isSelected={isSelected}\n          isHovered={isHovered}\n          label={label}\n          isLink={Boolean(href)}\n          appearance={appearance}\n          itemType=\"list\"\n          shouldDisableSelectionRender={shouldDisableSelectionRender}\n          {...props}\n        />\n      )}\n    </ListBoxItem>\n  );\n};\n"],"names":["React","styles"],"mappings":";;;;;;;;;;AASa,MAAA,QAAQ,GAAG,CAAC,EACvB,EAAE,EACF,KAAK,EACL,IAAI,EACJ,UAAU,GAAG,SAAS,EACtB,4BAA4B,GAAG,KAAK,EACpC,SAAS,EACT,GAAG,KAAK,EACM,KAAI;AAClB,IAAA,MAAM,UAAU,GAAG,KAAK,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,CAAC;IAErD,QACEA,6BAAC,WAAW,EAAA,EACV,EAAE,EAAE,UAAU,EACd,SAAS,EAAE,KAAK,EAChB,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,eAAe,CAAC,CAACC,UAAM,CAAC,IAAI,EAAEA,UAAM,CAAC,CAAc,WAAA,EAAA,UAAU,EAAE,CAAC,EAAE,SAAS,CAAC,CAAC,EAAA,GACpF,KAAK,EAGR,EAAA,CAAC,EAAE,aAAa,EAAE,cAAc,EAAE,UAAU,EAAE,SAAS,EAA0B,MAChFD,6BAAC,WAAW,EAAA,EACV,aAAa,EAAE,aAAa,EAC5B,cAAc,EAAE,cAAc,EAC9B,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,OAAO,CAAC,IAAI,CAAC,EACrB,UAAU,EAAE,UAAU,EACtB,QAAQ,EAAC,MAAM,EACf,4BAA4B,EAAE,4BAA4B,EAAA,GACtD,KAAK,EACT,CAAA,CACH,CACW;AAElB;;;;"}

package/dist/components/SelectDropdown/components/types.d.ts

@@ -17,4 +17,5 @@ export type BaseItemProps = {
     };
     /** Used to differentiate between items */
     appearance?: 'primary' | 'secondary';
+    shouldDisableSelectionRender?: boolean;
 };

package/dist/components/SelectDropdown/types.d.ts

@@ -1,5 +1,5 @@
 import { Key, ListBoxProps } from 'react-aria-components';
-import { ReactElement } from 'react';
+import { ReactNode, ReactElement } from 'react';
 import { ButtonProps } from '../Button/types';
 import { ListItemProps } from './components/ListItem/types';
 import { ListItemSectionProps } from './components/ListItemSection/ListItemSection';
@@ -34,6 +34,7 @@ export type SelectDropdownProps = (SelectDropdownSingleProps | SelectDropdownMul
     onSearchChange?: (value: string) => void;
     topAction?: CTAButtonProps;
     isSelectDropdownOpen?: boolean;
+    selectedSlot?: ReactNode;
     'aria-label'?: string;
     'aria-labelledby'?: string;
     'aria-describedby'?: string;

package/dist/components/Tag/Tag.cjs

@@ -1,17 +1,21 @@
 'use strict';
 
-var styled = require('styled-components');
-var colors = require('../../theme/modules/colors.cjs');
-var BaseContainer = require('../BaseContainer/BaseContainer.cjs');
+var React = require('react');
+var buildClassnames = require('../../utils/buildClassnames.cjs');
+require('uid/secure');
+var assignCssVars = require('../../utils/assignCssVars.cjs');
+var FlexRow = require('../Flex/FlexRow/FlexRow.cjs');
+var Text = require('../Text/Text.cjs');
+var Tag_module = require('./Tag.module.scss.cjs');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
-var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
-const Tag = styled__default.default(BaseContainer.BaseContainer).withConfig({ displayName: "vui--Tag", componentId: "vui--1rdo7hk" }) `display:inline-flex;flex-direction:row;justify-content:center;align-items:center;border-radius:4px;padding:4px 8px;${({ backgroundColor, color }) => `
-    color: ${color !== null && color !== undefined ? color : colors.colors.neutral.ink.base};
-    background-color: ${backgroundColor !== null && backgroundColor !== undefined ? backgroundColor : colors.colors.neutral.grey.base};
-  `}`;
+const Tag = ({ className, backgroundColor, textColor, children, label, compact = false, leftIconSlot, rightIconSlot, ...otherProps }) => (React__default.default.createElement(FlexRow.FlexRow, { flexWrap: "nowrap", justifyContent: "center", gap: "xs", className: buildClassnames.buildClassnames([Tag_module.tag, compact && Tag_module.compact, className]), style: { ...assignCssVars.assignCssVars({ customTextColor: textColor }), backgroundColor }, ...otherProps },
+    leftIconSlot,
+    children || React__default.default.createElement(Text.Text, { variant: "body" }, label),
+    rightIconSlot));
 
 exports.Tag = Tag;
 //# sourceMappingURL=Tag.cjs.map

package/dist/components/Tag/Tag.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.cjs","sources":["../../../src/components/Tag/Tag.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport { colors } from '../../theme/modules/colors';\nimport { BaseContainer } from '../BaseContainer';\n\nexport interface TagProps {\n  backgroundColor?: string;\n  color?: string;\n}\n\nexport const Tag = styled(BaseContainer)<TagProps>`\n  display: inline-flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  border-radius: 4px;\n  padding: 4px 8px;\n\n  ${({ backgroundColor, color }) => `\n    color: ${color ?? colors.neutral.ink.base};\n    background-color: ${backgroundColor ?? colors.neutral.grey.base};\n  `}\n`;\n"],"names":["styled","BaseContainer","colors"],"mappings":";;;;;;;;;;AAUa,MAAA,GAAG,GAAGA,uBAAM,CAACC,2BAAa,CAAC,CAQpC,UAAA,CAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,mHAAA,EAAA,CAAC,EAAE,eAAe,EAAE,KAAK,EAAE,KAAK;aACvB,KAAK,KAAA,IAAA,IAAL,KAAK,KAAA,SAAA,GAAL,KAAK,GAAIC,aAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAA;wBACrB,eAAe,KAAA,IAAA,IAAf,eAAe,KAAA,SAAA,GAAf,eAAe,GAAIA,aAAM,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA;AAChE,EAAA,CAAA,CAAA;;;;"}
+{"version":3,"file":"Tag.cjs","sources":["../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import React from 'react';\n\nimport { assignCssVars, buildClassnames } from '../../utils';\nimport { FlexRow } from '../Flex/FlexRow';\nimport { FlexProps } from '../Flex/types';\nimport { Text } from '../Text';\n\nimport styles from './Tag.module.scss';\n\ntype TagProps = Omit<FlexProps, 'color'> & {\n  backgroundColor?: string;\n  textColor?: string;\n  label?: string;\n  compact?: boolean;\n  leftIconSlot?: React.ReactNode;\n  rightIconSlot?: React.ReactNode;\n};\n\nexport const Tag = ({\n  className,\n  backgroundColor,\n  textColor,\n  children,\n  label,\n  compact = false,\n  leftIconSlot,\n  rightIconSlot,\n  ...otherProps\n}: TagProps) => (\n  <FlexRow\n    flexWrap=\"nowrap\"\n    justifyContent=\"center\"\n    gap=\"xs\"\n    className={buildClassnames([styles.tag, compact && styles.compact, className])}\n    style={{ ...assignCssVars({ customTextColor: textColor }), backgroundColor }}\n    {...otherProps}\n  >\n    {leftIconSlot}\n    {children || <Text variant=\"body\">{label}</Text>}\n    {rightIconSlot}\n  </FlexRow>\n);\n"],"names":["React","FlexRow","buildClassnames","styles","assignCssVars","Text"],"mappings":";;;;;;;;;;;;;;AAkBa,MAAA,GAAG,GAAG,CAAC,EAClB,SAAS,EACT,eAAe,EACf,SAAS,EACT,QAAQ,EACR,KAAK,EACL,OAAO,GAAG,KAAK,EACf,YAAY,EACZ,aAAa,EACb,GAAG,UAAU,EACJ,MACTA,qCAACC,eAAO,EAAA,EACN,QAAQ,EAAC,QAAQ,EACjB,cAAc,EAAC,QAAQ,EACvB,GAAG,EAAC,IAAI,EACR,SAAS,EAAEC,+BAAe,CAAC,CAACC,UAAM,CAAC,GAAG,EAAE,OAAO,IAAIA,UAAM,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC,EAC9E,KAAK,EAAE,EAAE,GAAGC,2BAAa,CAAC,EAAE,eAAe,EAAE,SAAS,EAAE,CAAC,EAAE,eAAe,EAAE,KACxE,UAAU,EAAA;IAEb,YAAY;IACZ,QAAQ,IAAIJ,qCAACK,SAAI,EAAA,EAAC,OAAO,EAAC,MAAM,EAAE,EAAA,KAAK,CAAQ;IAC/C,aAAa,CACN;;;;"}

package/dist/components/Tag/Tag.d.ts

@@ -1,5 +1,12 @@
-export interface TagProps {
+import React from 'react';
+import { FlexProps } from '../Flex/types';
+type TagProps = Omit<FlexProps, 'color'> & {
     backgroundColor?: string;
-    color?: string;
-}
-export declare const Tag: import("styled-components").StyledComponent<"div", any, TagProps, never>;
+    textColor?: string;
+    label?: string;
+    compact?: boolean;
+    leftIconSlot?: React.ReactNode;
+    rightIconSlot?: React.ReactNode;
+};
+export declare const Tag: ({ className, backgroundColor, textColor, children, label, compact, leftIconSlot, rightIconSlot, ...otherProps }: TagProps) => React.JSX.Element;
+export {};

package/dist/components/Tag/Tag.js

@@ -1,11 +1,15 @@
-import styled from 'styled-components';
-import { colors } from '../../theme/modules/colors.js';
-import { BaseContainer } from '../BaseContainer/BaseContainer.js';
+import React__default from 'react';
+import { buildClassnames } from '../../utils/buildClassnames.js';
+import 'uid/secure';
+import { assignCssVars } from '../../utils/assignCssVars.js';
+import { FlexRow } from '../Flex/FlexRow/FlexRow.js';
+import { Text } from '../Text/Text.js';
+import styles from './Tag.module.scss.js';
 
-const Tag = styled(BaseContainer).withConfig({ displayName: "vui--Tag", componentId: "vui--1rdo7hk" }) `display:inline-flex;flex-direction:row;justify-content:center;align-items:center;border-radius:4px;padding:4px 8px;${({ backgroundColor, color }) => `
-    color: ${color !== null && color !== undefined ? color : colors.neutral.ink.base};
-    background-color: ${backgroundColor !== null && backgroundColor !== undefined ? backgroundColor : colors.neutral.grey.base};
-  `}`;
+const Tag = ({ className, backgroundColor, textColor, children, label, compact = false, leftIconSlot, rightIconSlot, ...otherProps }) => (React__default.createElement(FlexRow, { flexWrap: "nowrap", justifyContent: "center", gap: "xs", className: buildClassnames([styles.tag, compact && styles.compact, className]), style: { ...assignCssVars({ customTextColor: textColor }), backgroundColor }, ...otherProps },
+    leftIconSlot,
+    children || React__default.createElement(Text, { variant: "body" }, label),
+    rightIconSlot));
 
 export { Tag };
 //# sourceMappingURL=Tag.js.map

package/dist/components/Tag/Tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.js","sources":["../../../src/components/Tag/Tag.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport { colors } from '../../theme/modules/colors';\nimport { BaseContainer } from '../BaseContainer';\n\nexport interface TagProps {\n  backgroundColor?: string;\n  color?: string;\n}\n\nexport const Tag = styled(BaseContainer)<TagProps>`\n  display: inline-flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  border-radius: 4px;\n  padding: 4px 8px;\n\n  ${({ backgroundColor, color }) => `\n    color: ${color ?? colors.neutral.ink.base};\n    background-color: ${backgroundColor ?? colors.neutral.grey.base};\n  `}\n`;\n"],"names":[],"mappings":";;;;AAUa,MAAA,GAAG,GAAG,MAAM,CAAC,aAAa,CAAC,CAQpC,UAAA,CAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,mHAAA,EAAA,CAAC,EAAE,eAAe,EAAE,KAAK,EAAE,KAAK;aACvB,KAAK,KAAA,IAAA,IAAL,KAAK,KAAA,SAAA,GAAL,KAAK,GAAI,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAA;wBACrB,eAAe,KAAA,IAAA,IAAf,eAAe,KAAA,SAAA,GAAf,eAAe,GAAI,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA;AAChE,EAAA,CAAA,CAAA;;;;"}
+{"version":3,"file":"Tag.js","sources":["../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import React from 'react';\n\nimport { assignCssVars, buildClassnames } from '../../utils';\nimport { FlexRow } from '../Flex/FlexRow';\nimport { FlexProps } from '../Flex/types';\nimport { Text } from '../Text';\n\nimport styles from './Tag.module.scss';\n\ntype TagProps = Omit<FlexProps, 'color'> & {\n  backgroundColor?: string;\n  textColor?: string;\n  label?: string;\n  compact?: boolean;\n  leftIconSlot?: React.ReactNode;\n  rightIconSlot?: React.ReactNode;\n};\n\nexport const Tag = ({\n  className,\n  backgroundColor,\n  textColor,\n  children,\n  label,\n  compact = false,\n  leftIconSlot,\n  rightIconSlot,\n  ...otherProps\n}: TagProps) => (\n  <FlexRow\n    flexWrap=\"nowrap\"\n    justifyContent=\"center\"\n    gap=\"xs\"\n    className={buildClassnames([styles.tag, compact && styles.compact, className])}\n    style={{ ...assignCssVars({ customTextColor: textColor }), backgroundColor }}\n    {...otherProps}\n  >\n    {leftIconSlot}\n    {children || <Text variant=\"body\">{label}</Text>}\n    {rightIconSlot}\n  </FlexRow>\n);\n"],"names":["React"],"mappings":";;;;;;;;AAkBa,MAAA,GAAG,GAAG,CAAC,EAClB,SAAS,EACT,eAAe,EACf,SAAS,EACT,QAAQ,EACR,KAAK,EACL,OAAO,GAAG,KAAK,EACf,YAAY,EACZ,aAAa,EACb,GAAG,UAAU,EACJ,MACTA,6BAAC,OAAO,EAAA,EACN,QAAQ,EAAC,QAAQ,EACjB,cAAc,EAAC,QAAQ,EACvB,GAAG,EAAC,IAAI,EACR,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,GAAG,EAAE,OAAO,IAAI,MAAM,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC,EAC9E,KAAK,EAAE,EAAE,GAAG,aAAa,CAAC,EAAE,eAAe,EAAE,SAAS,EAAE,CAAC,EAAE,eAAe,EAAE,KACxE,UAAU,EAAA;IAEb,YAAY;IACZ,QAAQ,IAAIA,6BAAC,IAAI,EAAA,EAAC,OAAO,EAAC,MAAM,EAAE,EAAA,KAAK,CAAQ;IAC/C,aAAa,CACN;;;;"}

package/dist/components/Tag/Tag.module.scss.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+var ___$insertStyle = require('../../_virtual/____insertStyle.cjs');
+
+___$insertStyle("._tag_81al6_1 {\n  border-radius: var(--sizes-xs);\n  padding: 2px var(--sizes-xs);\n  display: inline-flex;\n  min-width: var(--sizes-3);\n  min-height: var(--sizes-5);\n  color: var(--custom-text-color, var(--text-body-color));\n  font-size: var(--text-body-font-size);\n}\n._tag_81al6_1 span {\n  color: inherit;\n}\n._tag_81al6_1 svg {\n  width: var(--sizes-5);\n  height: var(--sizes-5);\n}\n._tag_81al6_1._compact_81al6_17 {\n  font-size: var(--text-body-small-font-size);\n}\n._tag_81al6_1._compact_81al6_17 span {\n  font-size: var(--text-body-small-font-size);\n}\n._tag_81al6_1._compact_81al6_17 svg {\n  width: var(--sizes-base);\n  height: var(--sizes-base);\n}");
+var styles = {"tag":"_tag_81al6_1","compact":"_compact_81al6_17"};
+
+module.exports = styles;
+//# sourceMappingURL=Tag.module.scss.cjs.map

package/dist/components/Tag/Tag.module.scss.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tag.module.scss.cjs","sources":["../../../src/components/Tag/Tag.module.scss"],"sourcesContent":[".tag {\n  border-radius: var(--sizes-xs);\n  padding: 2px var(--sizes-xs);\n  display: inline-flex;\n  min-width: var(--sizes-3);\n  min-height: var(--sizes-5);\n\n  // applies color and font-size for direct text children\n  color: var(--custom-text-color, var(--text-body-color));\n  font-size: var(--text-body-font-size);\n\n  // ensure Text components (spans) inherit the color\n  span {\n    color: inherit;\n  }\n\n  svg {\n    width: var(--sizes-5);\n    height: var(--sizes-5);\n  }\n\n  &.compact {\n    font-size: var(--text-body-small-font-size);\n\n    span {\n      font-size: var(--text-body-small-font-size);\n    }\n\n    svg {\n      width: var(--sizes-base);\n      height: var(--sizes-base);\n    }\n  }\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,mqBAAA;AACA,aAAA,CAAA,KAAA,CAAA,cAAA,CAAA,SAAA,CAAA,mBAAA;;;;"}

package/dist/components/Tag/Tag.module.scss.js

@@ -0,0 +1,7 @@
+import insertStyle from '../../_virtual/____insertStyle.js';
+
+insertStyle("._tag_81al6_1 {\n  border-radius: var(--sizes-xs);\n  padding: 2px var(--sizes-xs);\n  display: inline-flex;\n  min-width: var(--sizes-3);\n  min-height: var(--sizes-5);\n  color: var(--custom-text-color, var(--text-body-color));\n  font-size: var(--text-body-font-size);\n}\n._tag_81al6_1 span {\n  color: inherit;\n}\n._tag_81al6_1 svg {\n  width: var(--sizes-5);\n  height: var(--sizes-5);\n}\n._tag_81al6_1._compact_81al6_17 {\n  font-size: var(--text-body-small-font-size);\n}\n._tag_81al6_1._compact_81al6_17 span {\n  font-size: var(--text-body-small-font-size);\n}\n._tag_81al6_1._compact_81al6_17 svg {\n  width: var(--sizes-base);\n  height: var(--sizes-base);\n}");
+var styles = {"tag":"_tag_81al6_1","compact":"_compact_81al6_17"};
+
+export { styles as default };
+//# sourceMappingURL=Tag.module.scss.js.map

package/dist/components/Tag/Tag.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tag.module.scss.js","sources":["../../../src/components/Tag/Tag.module.scss"],"sourcesContent":[".tag {\n  border-radius: var(--sizes-xs);\n  padding: 2px var(--sizes-xs);\n  display: inline-flex;\n  min-width: var(--sizes-3);\n  min-height: var(--sizes-5);\n\n  // applies color and font-size for direct text children\n  color: var(--custom-text-color, var(--text-body-color));\n  font-size: var(--text-body-font-size);\n\n  // ensure Text components (spans) inherit the color\n  span {\n    color: inherit;\n  }\n\n  svg {\n    width: var(--sizes-5);\n    height: var(--sizes-5);\n  }\n\n  &.compact {\n    font-size: var(--text-body-small-font-size);\n\n    span {\n      font-size: var(--text-body-small-font-size);\n    }\n\n    svg {\n      width: var(--sizes-base);\n      height: var(--sizes-base);\n    }\n  }\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,mqBAAA;AACA,aAAA,CAAA,KAAA,CAAA,cAAA,CAAA,SAAA,CAAA,mBAAA;;;;"}

package/dist/components/index.d.ts

@@ -71,3 +71,4 @@ export { ThemeInjector } from './ThemeInjector';
 export { DataGrid } from './DataGrid';
 export { FlexCol } from './Flex/FlexCol';
 export { FlexRow } from './Flex/FlexRow';
+export { PhoneInput } from './PhoneInput';

package/dist/index.cjs

@@ -84,6 +84,7 @@ var ThemeInjector = require('./components/ThemeInjector/ThemeInjector.cjs');
 var DataGrid = require('./components/DataGrid/DataGrid.cjs');
 var FlexCol = require('./components/Flex/FlexCol/FlexCol.cjs');
 var FlexRow = require('./components/Flex/FlexRow/FlexRow.cjs');
+var index$5 = require('./components/PhoneInput/index.cjs');
 var useClickOutside = require('./hooks/useClickOutside.cjs');
 var useDebounce = require('./hooks/useDebounce.cjs');
 var useDropdown = require('./hooks/useDropdown.cjs');
@@ -101,7 +102,7 @@ var buildClassnames = require('./utils/buildClassnames.cjs');
 var color = require('./utils/color.cjs');
 var generateId = require('./utils/generateId.cjs');
 var assignCssVars = require('./utils/assignCssVars.cjs');
-var index$5 = require('./theme/index.cjs');
+var index$6 = require('./theme/index.cjs');
 var AccountsIcon = require('./icons/design-system/components/AccountsIcon.cjs');
 var AccountsOutlineIcon = require('./icons/design-system/components/AccountsOutlineIcon.cjs');
 var AddIcon = require('./icons/design-system/components/AddIcon.cjs');
@@ -412,6 +413,7 @@ exports.ThemeInjector = ThemeInjector.ThemeInjector;
 exports.DataGrid = DataGrid.DataGrid;
 exports.FlexCol = FlexCol.FlexCol;
 exports.FlexRow = FlexRow.FlexRow;
+exports.PhoneInput = index$5.PhoneInput;
 exports.useClickOutside = useClickOutside.useClickOutside;
 exports.useDebounce = useDebounce.useDebounce;
 exports.useDropdown = useDropdown.useDropdown;
@@ -431,7 +433,7 @@ exports.getOpaqueHexColor = color.getOpaqueHexColor;
 exports.hexToRgb = color.hexToRgb;
 exports.generateId = generateId.generateId;
 exports.assignCssVars = assignCssVars.assignCssVars;
-exports.theme = index$5.theme;
+exports.theme = index$6.theme;
 exports.AccountsIcon = AccountsIcon.ReactComponent;
 exports.AccountsOutlineIcon = AccountsOutlineIcon.ReactComponent;
 exports.AddIcon = AddIcon.ReactComponent;

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/index.js

@@ -82,6 +82,7 @@ export { ThemeInjector } from './components/ThemeInjector/ThemeInjector.js';
 export { DataGrid } from './components/DataGrid/DataGrid.js';
 export { FlexCol } from './components/Flex/FlexCol/FlexCol.js';
 export { FlexRow } from './components/Flex/FlexRow/FlexRow.js';
+export { PhoneInput } from './components/PhoneInput/index.js';
 export { useClickOutside } from './hooks/useClickOutside.js';
 export { useDebounce } from './hooks/useDebounce.js';
 export { useDropdown } from './hooks/useDropdown.js';

package/dist/index.js.map

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@veeqo/ui",
-  "version": "13.0.0",
+  "version": "13.2.0",
   "description": "New optimised component library for Veeqo.",
   "author": "Robert Wealthall",
   "license": "ISC",