@veracity/vui 2.1.0 → 2.3.0

package/dist/esm/input/theme.js

@@ -1,27 +1,20 @@
-function variantDefault(props) {
-    const { colorScheme: c } = props;
-    const container = {
-        borderColor: `${c}.80`,
+import { inputColors } from './consts';
+const baseStyle = {
+    container: {
         focusWithinRing: 2,
-        focusWithinRingColor: `${c}.80`
-    };
-    if (c === 'grey') {
-        container.borderColor = `${c}.60`;
-        container.focusWithinRingColor = 'blue.50';
+        color: inputColors.inputText
+    },
+    input: {
+        color: { placeholder: inputColors.placeholder }
     }
-    const icon = {};
-    const input = {};
-    return { container, icon, input };
-}
-const baseStyle = {};
+};
 const defaultProps = {
-    colorScheme: 'grey',
-    size: 'md',
-    variant: 'default'
+    size: 'lg',
+    variant: 'grey'
 };
 const parts = ['container', 'icon', 'input'];
 const sizes = {
-    xs: {
+    sm: {
         container: {
             fontSize: 'sm',
             h: 24
@@ -31,7 +24,7 @@ const sizes = {
         },
         input: {}
     },
-    sm: {
+    md: {
         container: {
             fontSize: 'sm',
             h: 32
@@ -41,7 +34,7 @@ const sizes = {
         },
         input: {}
     },
-    md: {
+    lg: {
         container: {
             fontSize: 'md',
             h: 40
@@ -51,7 +44,7 @@ const sizes = {
         },
         input: {}
     },
-    lg: {
+    xl: {
         container: {
             fontSize: 'lg',
             h: 48
@@ -63,7 +56,24 @@ const sizes = {
     }
 };
 const variants = {
-    default: variantDefault
+    grey: {
+        container: {
+            borderColor: inputColors.border,
+            focusWithinRingColor: inputColors.focus
+        }
+    },
+    green: {
+        container: {
+            borderColor: inputColors.success,
+            focusWithinRingColor: inputColors.success
+        }
+    },
+    red: {
+        container: {
+            borderColor: inputColors.error,
+            focusWithinRingColor: inputColors.error
+        }
+    }
 };
 export default {
     baseStyle,

package/dist/esm/list/listItem.js

@@ -14,8 +14,8 @@ export const ListItemBase = styled.liBox `
   transition-duration: fast;
 
   &[aria-disabled='true'] {
-    background-color: disabled .bg;
-    color: disabled .color;
+    background-color: sandstone.95;
+    color: sandstone.10;
     cursor: not-allowed;
     user-select: none;
   }

package/dist/esm/message/consts.d.ts

@@ -5,9 +5,15 @@ export declare const iconDictionary: {
     success: string;
 };
 export declare const spacingDictionary: {
-    md: number;
-    xs: number;
     sm: number;
+    md: number;
     lg: number;
+    xl: number;
+};
+export declare const messageColors: {
+    info: string;
+    warning: string;
+    error: string;
+    success: string;
 };
 //# sourceMappingURL=consts.d.ts.map

package/dist/esm/message/consts.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"consts.d.ts","sourceRoot":"","sources":["../../../src/message/consts.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,cAAc;;;;;CAK1B,CAAA;AAED,eAAO,MAAM,iBAAiB;;;;;CAK7B,CAAA"}
+{"version":3,"file":"consts.d.ts","sourceRoot":"","sources":["../../../src/message/consts.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,cAAc;;;;;CAK1B,CAAA;AAED,eAAO,MAAM,iBAAiB;;;;;CAK7B,CAAA;AAED,eAAO,MAAM,aAAa;;;;;CAKzB,CAAA"}

package/dist/esm/message/consts.js

@@ -5,8 +5,14 @@ export const iconDictionary = {
     success: 'falCheckCircle'
 };
 export const spacingDictionary = {
-    md: 8,
-    xs: 4,
-    sm: 6,
-    lg: 10
+    sm: 4,
+    md: 6,
+    lg: 8,
+    xl: 10
+};
+export const messageColors = {
+    info: 'seaBlue.28',
+    warning: 'terracotta.30',
+    error: 'energyRed.45',
+    success: 'landGreen.35'
 };

package/dist/esm/message/message.js

@@ -10,11 +10,11 @@ export const MessageBase = styled.divBox `
 `;
 /** Displays a simple message text. */
 export const Message = vui((props, ref) => {
-    const { children, className, text, size = 'md', variant = 'info', ...rest } = props;
+    const { children, className, text, size = 'lg', variant = 'info', ...rest } = props;
     const styles = useStyleConfig('Message', props);
     return (React.createElement(MessageBase, { className: cs('vui-message', className), ref: ref, ...styles, ...rest },
         React.createElement(Box, null,
-            React.createElement(Icon, { mr: `${spacingDictionary[size]}px`, name: iconDictionary[variant], size: size }),
-            React.createElement(T, { size: size }, children ?? text))));
+            React.createElement(Icon, { mr: `${spacingDictionary[size]}px`, name: iconDictionary[variant], size: styles.fontSize }),
+            React.createElement(T, { size: styles.fontSize }, children ?? text))));
 });
 export default Message;

package/dist/esm/message/theme.d.ts

@@ -2,11 +2,9 @@ declare const _default: {
     baseStyle: {};
     defaultProps: {
         variant: string;
+        size: string;
     };
     sizes: {
-        xs: {
-            fontSize: string;
-        };
         sm: {
             fontSize: string;
         };
@@ -16,6 +14,9 @@ declare const _default: {
         lg: {
             fontSize: string;
         };
+        xl: {
+            fontSize: string;
+        };
     };
     variants: {
         info: {

package/dist/esm/message/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/message/theme.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA,wBAKC"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/message/theme.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuCA,wBAKC"}

package/dist/esm/message/theme.js

@@ -1,33 +1,35 @@
+import { messageColors } from './consts';
 const baseStyle = {};
 const defaultProps = {
-    variant: 'info'
+    variant: 'info',
+    size: 'lg'
 };
 const sizes = {
-    xs: {
+    sm: {
         fontSize: 'xs'
     },
-    sm: {
+    md: {
         fontSize: 'sm'
     },
-    md: {
+    lg: {
         fontSize: 'md'
     },
-    lg: {
+    xl: {
         fontSize: 'lg'
     }
 };
 const variants = {
     info: {
-        color: 'blue.80'
+        color: messageColors.info
     },
     warning: {
-        color: 'yellow.90'
+        color: messageColors.warning
     },
     error: {
-        color: 'red.80'
+        color: messageColors.error
     },
     success: {
-        color: 'green.80'
+        color: messageColors.success
     }
 };
 export default {

package/dist/esm/select/select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../src/select/select.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAO5C;;;;GAIG;AACH,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,eAqDxC;yBArDe,MAAM;;;;;;;;;AA4DtB,eAAe,MAAM,CAAA"}
+{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../src/select/select.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAO5C;;;;GAIG;AACH,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,eAsDxC;yBAtDe,MAAM;;;;;;;;;AA6DtB,eAAe,MAAM,CAAA"}

package/dist/esm/select/select.js

@@ -13,7 +13,7 @@ import useSelect from './useSelect';
  * Supports single select and multi select, as well as controlled and uncontrolled modes.
  */
 export function Select(props) {
-    const { children, defaultValue, disabled, isInvalid, isMultiple, name, onChange, options, placeholder = 'Please select', readOnly, selectButton, size, value, variant, ...rest } = props;
+    const { children, defaultValue, disabled, isInvalid, isMultiple, maxHeight, name, onChange, options, placeholder = 'Please select', readOnly, selectButton, size, value, variant, ...rest } = props;
     const selectProps = useSelect({ defaultValue, isMultiple, onChange, value, options, children });
     if (__DEV__ && isMultiple && !Array.isArray(selectProps.value)) {
         console.error('<Select /> is used with isMultiple but its value is not an array: ', value);
@@ -35,7 +35,7 @@ export function Select(props) {
             React.createElement(React.Fragment, null,
                 selectButton ?? React.createElement(SelectButton, null),
                 React.createElement(SelectContent, null,
-                    React.createElement(SelectGroup, { tabIndex: 1000 }, children ??
+                    React.createElement(SelectGroup, { maxH: maxHeight, tabIndex: 1000 }, children ??
                         options?.map?.(option => React.createElement(SelectOption, { key: option.value, title: option.text, ...option }))))))));
 }
 Select.Button = SelectButton;

package/dist/esm/select/select.types.d.ts

@@ -14,6 +14,8 @@ export declare type SelectProps = ThemingProps<'Select'> & PopoverProps & UseSel
     disabled?: boolean;
     /** Represents invalid form input and is styled accordingly. */
     isInvalid?: boolean;
+    /** Maximum container height in px. */
+    maxHeight?: number;
     /** Name of the input. Used in custom change event to support form library integration. */
     name?: string;
     /** Data prop to display an array of options in the popover. */

package/dist/esm/select/select.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"select.types.d.ts","sourceRoot":"","sources":["../../../src/select/select.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAClD,OAAO,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAC9D,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AACvC,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAA;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAElD,oBAAY,iBAAiB,GAAG,WAAW,CAAA;AAE3C,oBAAY,kBAAkB,GAAG,mBAAmB,CAAA;AAEpD,oBAAY,aAAa,GAAG,IAAI,CAC9B,WAAW,EACX,UAAU,GAAG,WAAW,GAAG,YAAY,GAAG,MAAM,GAAG,SAAS,GAAG,aAAa,GAAG,UAAU,GAAG,MAAM,GAAG,SAAS,CAC/G,GACC,mBAAmB,CAAA;AAErB,oBAAY,gBAAgB,GAAG,SAAS,CAAA;AAExC,oBAAY,WAAW,GAAG,YAAY,CAAC,QAAQ,CAAC,GAC9C,YAAY,GACZ,cAAc,GAAG;IACf,yDAAyD;IACzD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+DAA+D;IAC/D,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,0FAA0F;IAC1F,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,+DAA+D;IAC/D,OAAO,CAAC,EAAE,gBAAgB,EAAE,CAAA;IAC5B,8DAA8D;IAC9D,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,yDAAyD;IACzD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,iCAAiC;IACjC,YAAY,CAAC,EAAE,SAAS,CAAA;CACzB,CAAA;AAEH,oBAAY,gBAAgB,GAAG;IAC7B,uCAAuC;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,gCAAgC;IAChC,IAAI,EAAE,MAAM,CAAA;IACZ,+BAA+B;IAC/B,KAAK,EAAE,WAAW,CAAA;CACnB,CAAA;AAED,oBAAY,iBAAiB,GAAG,aAAa,GAAG;IAC9C,mGAAmG;IACnG,KAAK,CAAC,EAAE,WAAW,CAAA;IACnB,wBAAwB;IACxB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED,oBAAY,WAAW,GAAG,MAAM,GAAG,MAAM,CAAA"}
+{"version":3,"file":"select.types.d.ts","sourceRoot":"","sources":["../../../src/select/select.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAClD,OAAO,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAC9D,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AACvC,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAA;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAElD,oBAAY,iBAAiB,GAAG,WAAW,CAAA;AAE3C,oBAAY,kBAAkB,GAAG,mBAAmB,CAAA;AAEpD,oBAAY,aAAa,GAAG,IAAI,CAC9B,WAAW,EACX,UAAU,GAAG,WAAW,GAAG,YAAY,GAAG,MAAM,GAAG,SAAS,GAAG,aAAa,GAAG,UAAU,GAAG,MAAM,GAAG,SAAS,CAC/G,GACC,mBAAmB,CAAA;AAErB,oBAAY,gBAAgB,GAAG,SAAS,CAAA;AAExC,oBAAY,WAAW,GAAG,YAAY,CAAC,QAAQ,CAAC,GAC9C,YAAY,GACZ,cAAc,GAAG;IACf,yDAAyD;IACzD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+DAA+D;IAC/D,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,sCAAsC;IACtC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,0FAA0F;IAC1F,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,+DAA+D;IAC/D,OAAO,CAAC,EAAE,gBAAgB,EAAE,CAAA;IAC5B,8DAA8D;IAC9D,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,yDAAyD;IACzD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,iCAAiC;IACjC,YAAY,CAAC,EAAE,SAAS,CAAA;CACzB,CAAA;AAEH,oBAAY,gBAAgB,GAAG;IAC7B,uCAAuC;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,gCAAgC;IAChC,IAAI,EAAE,MAAM,CAAA;IACZ,+BAA+B;IAC/B,KAAK,EAAE,WAAW,CAAA;CACnB,CAAA;AAED,oBAAY,iBAAiB,GAAG,aAAa,GAAG;IAC9C,mGAAmG;IACnG,KAAK,CAAC,EAAE,WAAW,CAAA;IACnB,wBAAwB;IACxB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED,oBAAY,WAAW,GAAG,MAAM,GAAG,MAAM,CAAA"}

package/dist/esm/select/selectButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"selectButton.d.ts","sourceRoot":"","sources":["../../../src/select/selectButton.tsx"],"names":[],"mappings":"AASA;;;;GAIG;AACH,eAAO,MAAM,YAAY,2EAoDvB,CAAA;AAEF,eAAe,YAAY,CAAA"}
+{"version":3,"file":"selectButton.d.ts","sourceRoot":"","sources":["../../../src/select/selectButton.tsx"],"names":[],"mappings":"AASA;;;;GAIG;AACH,eAAO,MAAM,YAAY,2EAqDvB,CAAA;AAEF,eAAe,YAAY,CAAA"}

package/dist/esm/select/selectButton.js

@@ -14,22 +14,23 @@ export const SelectButton = vui((props, ref) => {
     const { disabled, isInvalid, placeholder, readOnly, valueText } = useSelectContext() ?? {};
     const styles = useStyleConfig('Select', useSelectContext());
     const text = valueText || placeholder;
-    const textColor = disabled ? 'disabled.text' : !valueText ? 'grey.60' : undefined;
-    const iconColor = disabled ? 'disabled.text' : 'blue.80';
+    const textColor = disabled ? 'sandstone.10' : !valueText ? 'sandstone.10' : undefined;
+    const iconColor = disabled ? 'sandstone.10' : 'seaBlue.28';
     const readOnlyProps = readOnly
         ? {
-            activeBg: 'disabled.bg',
-            bg: 'disabled.bg',
-            color: 'darkBlue.18',
+            activeBg: 'sandstone.95',
+            bg: 'sandstone.95',
+            color: 'seaBlue.28',
             cursor: 'auto',
             disabled: true,
-            hoverBg: 'disabled.bg'
+            hoverBg: 'sandstone.95',
+            opacity: 1
         }
         : {};
     const isInvalidProps = isInvalid
         ? {
-            borderColor: 'red.80',
-            hoverBorderColor: 'red.80'
+            borderColor: 'energyRed.45',
+            hoverBorderColor: 'energyRed.45'
         }
         : {};
     return (React.createElement(PopoverTrigger, { as: LineButton, bg: "white", className: cs('vui-selectButton', className), colorScheme: "prussian", disabled: disabled, focusRing: 2, fontWeight: "regular", iconRight: React.createElement(Button.Icon, { color: iconColor, ml: "auto", name: "falAngleDown" }), isFullWidth: true, px: 1, ref: ref, text: React.createElement(Button.Text, { color: textColor, ...ellipsisOverflow }, text), userSelect: "text", ...styles.button, ...readOnlyProps, ...isInvalidProps, ...rest }));

package/dist/esm/select/selectOption.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"selectOption.d.ts","sourceRoot":"","sources":["../../../src/select/selectOption.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAElD;;;;GAIG;AACH,eAAO,MAAM,YAAY,yDA+CvB,CAAA;AAEF,eAAe,YAAY,CAAA"}
+{"version":3,"file":"selectOption.d.ts","sourceRoot":"","sources":["../../../src/select/selectOption.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAElD;;;;GAIG;AACH,eAAO,MAAM,YAAY,yDAkDvB,CAAA;AAEF,eAAe,YAAY,CAAA"}

package/dist/esm/select/selectOption.js

@@ -29,7 +29,7 @@ export const SelectOption = vui((props, ref) => {
         onChange?.(clonedEvent);
         !isMultiple && instance?.hide();
     });
-    return (React.createElement(ListItem, { className: cs('vui-selectOption', className), disabled: disabled, isInteractive: true, isSelected: isSelected, onClick: onClick, ref: ref, title: title, value: valueProp, ...styles.item, ...rest, ...ellipsisOverflow }, children ??
+    return (React.createElement(ListItem, { activeBg: "skyBlue.95", className: cs('vui-selectOption', className), disabled: disabled, hoverBg: "skyBlue.90", isInteractive: true, isSelected: isSelected, onClick: onClick, ref: ref, selectedBg: "skyBlue.95", title: title, value: valueProp, ...styles.item, ...rest, ...ellipsisOverflow }, children ??
         (isMultiple && (React.createElement(React.Fragment, null,
             React.createElement(Checkbox, { checked: isSelected, disabled: disabled, mr: 1 }),
             React.createElement(List.Text, null, props.text))))));

package/dist/esm/skeleton/skeleton.types.d.ts

@@ -3,7 +3,7 @@ import { ThemingProps } from '../theme';
 export declare type SkeletonProps = SystemProps & ThemingProps<'Skeleton'> & {
     /** Children are disabled for this component. */
     children?: never;
-    /** Available theme colors for this component. @default blue */
+    /** Available theme colors for this component. @deprecated */
     colorScheme?: 'blue' | 'grey';
     /** Displays given amount of skeleton elements. */
     repeat?: number;

package/dist/esm/skeleton/skeleton.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.types.d.ts","sourceRoot":"","sources":["../../../src/skeleton/skeleton.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,oBAAY,aAAa,GAAG,WAAW,GACrC,YAAY,CAAC,UAAU,CAAC,GAAG;IACzB,gDAAgD;IAChD,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,+DAA+D;IAC/D,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC7B,kDAAkD;IAClD,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB,CAAA"}
+{"version":3,"file":"skeleton.types.d.ts","sourceRoot":"","sources":["../../../src/skeleton/skeleton.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,oBAAY,aAAa,GAAG,WAAW,GACrC,YAAY,CAAC,UAAU,CAAC,GAAG;IACzB,gDAAgD;IAChD,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,6DAA6D;IAC7D,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC7B,kDAAkD;IAClD,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB,CAAA"}

package/dist/esm/skeleton/theme.d.ts

@@ -1,17 +1,8 @@
-import { Dict } from '../utils';
-declare function variantCircle(props: Dict): {
-    borderRadius: string;
-    bg: string;
-};
-declare function variantRectangle(props: Dict): {
-    borderRadius: string;
-    bg: string;
-    w: string;
-};
 declare const _default: {
-    baseStyle: {};
+    baseStyle: {
+        bg: string;
+    };
     defaultProps: {
-        colorScheme: string;
         size: string;
         variant: string;
     };
@@ -30,8 +21,13 @@ declare const _default: {
         };
     };
     variants: {
-        circle: typeof variantCircle;
-        rect: typeof variantRectangle;
+        circle: {
+            borderRadius: string;
+        };
+        rect: {
+            borderRadius: string;
+            w: string;
+        };
     };
 };
 export default _default;

package/dist/esm/skeleton/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/skeleton/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAE/B,iBAAS,aAAa,CAAC,KAAK,EAAE,IAAI;;;EASjC;AAED,iBAAS,gBAAgB,CAAC,KAAK,EAAE,IAAI;;;;EAUpC;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BD,wBAKC"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/skeleton/theme.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCA,wBAKC"}

package/dist/esm/skeleton/theme.js

@@ -1,23 +1,7 @@
-function variantCircle(props) {
-    const { colorScheme: c } = props;
-    const styles = {
-        borderRadius: '50%',
-        bg: `${c}.20`
-    };
-    return styles;
-}
-function variantRectangle(props) {
-    const { colorScheme: c } = props;
-    const styles = {
-        borderRadius: 'md',
-        bg: `${c}.20`,
-        w: '100%'
-    };
-    return styles;
-}
-const baseStyle = {};
+const baseStyle = {
+    bg: 'skyBlue.95'
+};
 const defaultProps = {
-    colorScheme: 'blue',
     size: 'md',
     variant: 'rect'
 };
@@ -36,8 +20,13 @@ const sizes = {
     }
 };
 const variants = {
-    circle: variantCircle,
-    rect: variantRectangle
+    circle: {
+        borderRadius: '50%'
+    },
+    rect: {
+        borderRadius: 'md',
+        w: '100%'
+    }
 };
 export default {
     baseStyle,

package/dist/esm/spinner/spinner.types.d.ts

@@ -3,7 +3,7 @@ import { ThemingProps } from '../theme';
 export declare type SpinnerProps = Omit<BoxProps, 'size' | 'variant'> & Omit<ThemingProps<'Spinner'>, 'size'> & {
     /** Children are disabled for this component. */
     children?: never;
-    /** Available theme colors for this component. @default blue */
+    /** @deprecated use 'variant' instead */
     colorScheme?: 'blue' | 'grey' | 'prussian';
     /** Color of the 'empty' part of the circle. */
     emptyColor?: string | 'transparent';

package/dist/esm/spinner/spinner.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"spinner.types.d.ts","sourceRoot":"","sources":["../../../src/spinner/spinner.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACjC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,oBAAY,YAAY,GAAG,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC,GAC3D,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC,GAAG;IACtC,gDAAgD;IAChD,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,+DAA+D;IAC/D,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,UAAU,CAAA;IAC1C,+CAA+C;IAC/C,UAAU,CAAC,EAAE,MAAM,GAAG,aAAa,CAAA;IACnC,qDAAqD;IACrD,KAAK,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAA;IAClC,wDAAwD;IACxD,IAAI,CAAC,EAAE,YAAY,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,GAAG,MAAM,CAAA;IAC/C,+CAA+C;IAC/C,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,8CAA8C;IAC9C,YAAY,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,CAAA;IAClD,iDAAiD;IACjD,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA"}
+{"version":3,"file":"spinner.types.d.ts","sourceRoot":"","sources":["../../../src/spinner/spinner.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAA;AACjC,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAEvC,oBAAY,YAAY,GAAG,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC,GAC3D,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC,GAAG;IACtC,gDAAgD;IAChD,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,wCAAwC;IACxC,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,UAAU,CAAA;IAC1C,+CAA+C;IAC/C,UAAU,CAAC,EAAE,MAAM,GAAG,aAAa,CAAA;IACnC,qDAAqD;IACrD,KAAK,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAA;IAClC,wDAAwD;IACxD,IAAI,CAAC,EAAE,YAAY,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,GAAG,MAAM,CAAA;IAC/C,+CAA+C;IAC/C,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,8CAA8C;IAC9C,YAAY,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,CAAA;IAClD,iDAAiD;IACjD,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA"}

package/dist/esm/spinner/theme.d.ts

@@ -1,18 +1,6 @@
-import { Dict } from '../utils';
-declare function variantDefault(props: Dict): {
-    container: {
-        color: string;
-    };
-    circle: {
-        borderColor: string;
-        borderTopColor: string;
-    };
-    text: {};
-};
 declare const _default: {
     baseStyle: {};
     defaultProps: {
-        colorScheme: string;
         size: string;
         variant: string;
     };
@@ -62,7 +50,24 @@ declare const _default: {
         };
     };
     variants: {
-        default: typeof variantDefault;
+        lightBackground: {
+            circle: {
+                borderColor: string;
+                borderTopColor: string;
+            };
+            text: {
+                color: string;
+            };
+        };
+        darkBackground: {
+            circle: {
+                borderColor: string;
+                borderTopColor: string;
+            };
+            text: {
+                color: string;
+            };
+        };
     };
 };
 export default _default;

package/dist/esm/spinner/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/spinner/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAE/B,iBAAS,cAAc,CAAC,KAAK,EAAE,IAAI;;;;;;;;;EAelC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6DD,wBAMC"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/spinner/theme.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2EA,wBAMC"}

package/dist/esm/spinner/theme.js

@@ -1,20 +1,7 @@
-function variantDefault(props) {
-    const { colorScheme: c } = props;
-    const container = {
-        color: `${c}.50`
-    };
-    const circle = {
-        borderColor: `${c}.20`,
-        borderTopColor: `${c}.50`
-    };
-    const text = {};
-    return { container, circle, text };
-}
 const baseStyle = {};
 const defaultProps = {
-    colorScheme: 'blue',
     size: 'page',
-    variant: 'default'
+    variant: 'lightBackground'
 };
 const parts = ['container', 'circle', 'text'];
 const sizes = {
@@ -62,7 +49,24 @@ const sizes = {
     }
 };
 const variants = {
-    default: variantDefault
+    lightBackground: {
+        circle: {
+            borderColor: 'seaBlue.80',
+            borderTopColor: 'seaBlue.28'
+        },
+        text: {
+            color: 'seaBlue.28'
+        }
+    },
+    darkBackground: {
+        circle: {
+            borderColor: 'digiGreen.30',
+            borderTopColor: 'digiGreen.78'
+        },
+        text: {
+            color: 'digiGreen.78'
+        }
+    }
 };
 export default {
     baseStyle,

package/dist/esm/tag/theme.d.ts

@@ -3,6 +3,7 @@ declare const _default: {
     defaultProps: {
         size: string;
         variant: string;
+        fontWeight: string;
     };
     parts: string[];
     sizes: {

package/dist/esm/tag/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/tag/theme.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAmJE,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsFpB,wBAMC"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/tag/theme.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAoJE,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsFpB,wBAMC"}

package/dist/esm/tag/theme.js

@@ -1,7 +1,8 @@
 const baseStyle = {};
 const defaultProps = {
     size: 'md',
-    variant: 'subtleBlue'
+    variant: 'subtleBlue',
+    fontWeight: 'medium'
 };
 const parts = ['container', 'button', 'icon', 'text'];
 const sizes = {