@alto-avios/alto-ui 2.3.2 → 2.4.0

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

@@ -26,10 +26,10 @@ export interface TagProps extends AriaTagProps {
     /**
      * Whether the tag is removable
      */
-    isRemovable?: boolean; /**
+    isRemovable?: boolean /**
     /**
      * The focus style of the button
-     */
+     */;
     focusStyle?: 'default' | 'white';
 }
 export declare const Tag: ({ children, id, leadingIconProps, isDisabled, isRemovable, focusStyle, ...props }: TagProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Tag/Tag.js

@@ -3,9 +3,9 @@ import { Tag as Tag$1 } from "react-aria-components";
 import { Icon } from "../Icon/Icon.js";
 import { IconButton } from "../IconButton/IconButton.js";
 import { focusStyleVariants } from "../../utils/focus/focusStyles.js";
-import '../../assets/Tag.css';const tag = "_tag_15o1i_1";
-const isRemovable = "_isRemovable_15o1i_21";
-const iconWrapper = "_iconWrapper_15o1i_121";
+import '../../assets/Tag.css';const tag = "_tag_ob7tq_1";
+const isRemovable = "_isRemovable_ob7tq_21";
+const iconWrapper = "_iconWrapper_ob7tq_123";
 const styles = {
   tag,
   isRemovable,
@@ -20,7 +20,7 @@ const Tag = ({
   focusStyle = "default",
   ...props
 }) => {
-  let textValue = typeof children === "string" ? children : void 0;
+  const textValue = typeof children === "string" ? children : void 0;
   return /* @__PURE__ */ jsxs(Tag$1, { className: `${styles.tag} ${isRemovable2 ? styles.isRemovable : ""} ${focusStyleVariants({
     focusStyle
   })}`, isDisabled, id: id == null ? void 0 : id.toString(), textValue, ...props, children: [

package/dist/components/TagGroup/TagGroup.d.ts

@@ -1,8 +1,8 @@
 import { TagGroupProps as AriaTagGroupProps, PressEvent, TagListProps } from 'react-aria-components';
-export interface TagGroupProps<T> extends Omit<AriaTagGroupProps, "children">, Pick<TagListProps<T>, "items" | "children" | "renderEmptyState"> {
+export interface TagGroupProps<T> extends Omit<AriaTagGroupProps, 'children'>, Pick<TagListProps<T>, 'items' | 'children' | 'renderEmptyState'> {
     label?: string;
     description?: string;
-    selectionMode?: "single" | "multiple";
+    selectionMode?: 'single' | 'multiple';
     clearButton?: boolean;
     clearButtonOnClick?: (e: PressEvent) => void;
 }

package/dist/components/TextAreaField/TextAreaField.js

@@ -1,8 +1,8 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { TextField, TextArea } from "react-aria-components";
 import { FieldHeader } from "../FieldHeader/FieldHeader.js";
-import '../../assets/TextAreaField.css';const textAreaField = "_textAreaField_1h7su_1";
-const validationError = "_validationError_1h7su_67";
+import '../../assets/TextAreaField.css';const textAreaField = "_textAreaField_bruz2_1";
+const validationError = "_validationError_bruz2_67";
 const styles = {
   textAreaField,
   validationError

package/dist/components/ToggleButton/ToggleButton.js

@@ -4,14 +4,14 @@ import { useRef, useState, useEffect } from "react";
 import { ToggleButton as ToggleButton$1 } from "react-aria-components";
 import LoadingSpinner from "../LoadingSpinner/LoadingSpinner.js";
 import { focusStyleVariants } from "../../utils/focus/focusStyles.js";
-import '../../assets/ToggleButton.css';const toggleButton$1 = "_toggleButton_eymuc_1";
-const sm = "_sm_eymuc_34";
-const md = "_md_eymuc_41";
-const lg = "_lg_eymuc_47";
+import '../../assets/ToggleButton.css';const toggleButton$1 = "_toggleButton_17fie_1";
+const sm = "_sm_17fie_35";
+const md = "_md_17fie_42";
+const lg = "_lg_17fie_48";
 const styles = {
   toggleButton: toggleButton$1,
-  "fa-spinner-third": "_fa-spinner-third_eymuc_20",
-  "icon-wrapper": "_icon-wrapper_eymuc_25",
+  "fa-spinner-third": "_fa-spinner-third_17fie_21",
+  "icon-wrapper": "_icon-wrapper_17fie_26",
   sm,
   md,
   lg

package/dist/components/ToggleIconButton/ToggleIconButton.js

@@ -5,17 +5,17 @@ import { ToggleButton } from "react-aria-components";
 import { Icon } from "../Icon/Icon.js";
 import LoadingSpinner from "../LoadingSpinner/LoadingSpinner.js";
 import { focusStyleVariants } from "../../utils/focus/focusStyles.js";
-import '../../assets/ToggleIconButton.css';const toggleIconButton$1 = "_toggleIconButton_1t6yj_1";
-const sm = "_sm_1t6yj_26";
-const md = "_md_1t6yj_32";
-const lg = "_lg_1t6yj_38";
+import '../../assets/ToggleIconButton.css';const toggleIconButton$1 = "_toggleIconButton_1pk2t_1";
+const sm = "_sm_1pk2t_26";
+const md = "_md_1pk2t_32";
+const lg = "_lg_1pk2t_38";
 const styles = {
   toggleIconButton: toggleIconButton$1,
-  "icon-wrapper": "_icon-wrapper_1t6yj_17",
+  "icon-wrapper": "_icon-wrapper_1pk2t_17",
   sm,
   md,
   lg,
-  "fa-spinner-third": "_fa-spinner-third_1t6yj_44"
+  "fa-spinner-third": "_fa-spinner-third_1pk2t_44"
 };
 const toggleIconButton = cva(styles.toggleIconButton, {
   variants: {

package/dist/components/Tooltip/Tooltip.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { TooltipTrigger, Tooltip as Tooltip$1 } from "react-aria-components";
-import '../../assets/Tooltip.css';const tooltip = "_tooltip_46243_2";
-const slide = "_slide_46243_1";
+import '../../assets/Tooltip.css';const tooltip = "_tooltip_1m8m8_2";
+const slide = "_slide_1m8m8_1";
 const styles = {
   tooltip,
   slide

package/dist/components/index.d.ts

@@ -19,8 +19,11 @@ export { default as IconButton } from './IconButton';
 export { default as Link } from './Link';
 export { default as LoadingSpinner } from './LoadingSpinner';
 export { default as NewButton } from './NewButton';
+export { default as NumberField } from './NumberField';
+export { default as Paragraph } from './Paragraph';
 export { default as Radio } from './Radio';
 export { default as RadioGroup } from './RadioGroup';
+export { default as Section } from './Section';
 export { default as SubHeading } from './SubHeading';
 export { default as Tag } from './Tag';
 export { default as TagGroup } from './TagGroup';

package/dist/components/index.js

@@ -20,15 +20,18 @@ import { IconButton } from "./IconButton/IconButton.js";
 import { default as default4 } from "./Link/Link.js";
 import { default as default5 } from "./LoadingSpinner/LoadingSpinner.js";
 import { NewButton } from "./NewButton/NewButton.js";
+import { NumberField } from "./NumberField/NumberField.js";
+import { Paragraph } from "./Paragraph/Paragraph.js";
 import { Radio } from "./Radio/Radio.js";
 import { RadioGroup } from "./RadioGroup/RadioGroup.js";
+import { default as default6 } from "./Section/Section.js";
 import { SubHeading } from "./SubHeading/SubHeading.js";
 import { Tag } from "./Tag/Tag.js";
 import { TagGroup } from "./TagGroup/TagGroup.js";
 import { TextField } from "./TextField/TextField.js";
 import { TextAreaField } from "./TextAreaField/TextAreaField.js";
-import { default as default6 } from "./ToggleButton/ToggleButton.js";
-import { default as default7 } from "./ToggleIconButton/ToggleIconButton.js";
+import { default as default7 } from "./ToggleButton/ToggleButton.js";
+import { default as default8 } from "./ToggleIconButton/ToggleIconButton.js";
 import { Tooltip } from "./Tooltip/Tooltip.js";
 export {
   Badge,
@@ -52,15 +55,18 @@ export {
   default4 as Link,
   default5 as LoadingSpinner,
   NewButton,
+  NumberField,
+  Paragraph,
   Radio,
   RadioGroup,
+  default6 as Section,
   SubHeading,
   Tag,
   TagGroup,
   TextAreaField,
   TextField,
-  default6 as ToggleButton,
-  default7 as ToggleIconButton,
+  default7 as ToggleButton,
+  default8 as ToggleIconButton,
   Tooltip
 };
 //# sourceMappingURL=index.js.map

package/dist/components/index.js.map

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

package/dist/index.js

@@ -20,15 +20,18 @@ import { IconButton } from "./components/IconButton/IconButton.js";
 import { default as default4 } from "./components/Link/Link.js";
 import { default as default5 } from "./components/LoadingSpinner/LoadingSpinner.js";
 import { NewButton } from "./components/NewButton/NewButton.js";
+import { NumberField } from "./components/NumberField/NumberField.js";
+import { Paragraph } from "./components/Paragraph/Paragraph.js";
 import { Radio } from "./components/Radio/Radio.js";
 import { RadioGroup } from "./components/RadioGroup/RadioGroup.js";
+import { default as default6 } from "./components/Section/Section.js";
 import { SubHeading } from "./components/SubHeading/SubHeading.js";
 import { Tag } from "./components/Tag/Tag.js";
 import { TagGroup } from "./components/TagGroup/TagGroup.js";
 import { TextField } from "./components/TextField/TextField.js";
 import { TextAreaField } from "./components/TextAreaField/TextAreaField.js";
-import { default as default6 } from "./components/ToggleButton/ToggleButton.js";
-import { default as default7 } from "./components/ToggleIconButton/ToggleIconButton.js";
+import { default as default7 } from "./components/ToggleButton/ToggleButton.js";
+import { default as default8 } from "./components/ToggleIconButton/ToggleIconButton.js";
 import { Tooltip } from "./components/Tooltip/Tooltip.js";
 export {
   Badge,
@@ -52,15 +55,18 @@ export {
   default4 as Link,
   default5 as LoadingSpinner,
   NewButton,
+  NumberField,
+  Paragraph,
   Radio,
   RadioGroup,
+  default6 as Section,
   SubHeading,
   Tag,
   TagGroup,
   TextAreaField,
   TextField,
-  default6 as ToggleButton,
-  default7 as ToggleIconButton,
+  default7 as ToggleButton,
+  default8 as ToggleIconButton,
   Tooltip
 };
 //# sourceMappingURL=index.js.map

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/dist/utils/backgroundColour/backgroundColour.d.ts

@@ -4,5 +4,5 @@ export declare const backgroundColorVariants: (props?: ({
     backgroundColour?: "transparent" | "base" | "layer1" | "layer2" | "layer3" | "accentVibrant" | "accentSubtle" | "accentDeep" | "criticalVibrant" | "criticalSubtle" | "warningVibrant" | "warningSubtle" | "cautionVibrant" | "cautionSubtle" | "successVibrant" | "successSubtle" | "informationVibrant" | "informationSubtle" | "inverseVibrant" | "inverseSubtle" | "whiteVibrant" | "whiteSubtle" | "disabledVibrant" | "disabledSubtle" | "saleVibrant" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type BackgroundVariants = VariantProps<typeof backgroundColorVariants>;
-export declare const backgroundColourOptions: BackgroundVariants["backgroundColour"][];
+export declare const backgroundColourOptions: BackgroundVariants['backgroundColour'][];
 export declare const backgroundColourArgTypes: Record<string, InputType>;

package/dist/utils/fgColour/fgColor.js

@@ -1,39 +1,39 @@
 import { c as cva } from "../../index-Bi3v_EjJ.js";
 import '../../assets/fgColor.css';const styles = {
-  "fgColor-primary": "_fgColor-primary_1njr6_1",
-  "fgColor-secondary": "_fgColor-secondary_1njr6_5",
-  "fgColor-accent-primary": "_fgColor-accent-primary_1njr6_9",
-  "fgColor-accent-secondary": "_fgColor-accent-secondary_1njr6_13",
-  "fgColor-accent-on-vibrant": "_fgColor-accent-on-vibrant_1njr6_17",
-  "fgColor-accent-on-vibrant-accent": "_fgColor-accent-on-vibrant-accent_1njr6_21",
-  "fgColor-accent-on-subtle": "_fgColor-accent-on-subtle_1njr6_25",
-  "fgColor-accent-on-deep": "_fgColor-accent-on-deep_1njr6_29",
-  "fgColor-critical-primary": "_fgColor-critical-primary_1njr6_33",
-  "fgColor-critical-on-vibrant": "_fgColor-critical-on-vibrant_1njr6_37",
-  "fgColor-critical-on-subtle": "_fgColor-critical-on-subtle_1njr6_41",
-  "fgColor-warning-primary": "_fgColor-warning-primary_1njr6_45",
-  "fgColor-warning-on-vibrant": "_fgColor-warning-on-vibrant_1njr6_49",
-  "fgColor-warning-on-subtle": "_fgColor-warning-on-subtle_1njr6_53",
-  "fgColor-caution-primary": "_fgColor-caution-primary_1njr6_57",
-  "fgColor-caution-on-vibrant": "_fgColor-caution-on-vibrant_1njr6_61",
-  "fgColor-caution-on-subtle": "_fgColor-caution-on-subtle_1njr6_65",
-  "fgColor-success-primary": "_fgColor-success-primary_1njr6_69",
-  "fgColor-success-on-vibrant": "_fgColor-success-on-vibrant_1njr6_73",
-  "fgColor-success-on-subtle": "_fgColor-success-on-subtle_1njr6_77",
-  "fgColor-information-primary": "_fgColor-information-primary_1njr6_81",
-  "fgColor-information-on-vibrant": "_fgColor-information-on-vibrant_1njr6_85",
-  "fgColor-information-on-subtle": "_fgColor-information-on-subtle_1njr6_89",
-  "fgColor-inverse-primary": "_fgColor-inverse-primary_1njr6_93",
-  "fgColor-inverse-on-vibrant": "_fgColor-inverse-on-vibrant_1njr6_97",
-  "fgColor-inverse-on-subtle": "_fgColor-inverse-on-subtle_1njr6_101",
-  "fgColor-white-primary": "_fgColor-white-primary_1njr6_105",
-  "fgColor-white-on-vibrant": "_fgColor-white-on-vibrant_1njr6_109",
-  "fgColor-white-on-subtle": "_fgColor-white-on-subtle_1njr6_113",
-  "fgColor-disabled-primary": "_fgColor-disabled-primary_1njr6_117",
-  "fgColor-disabled-on-vibrant": "_fgColor-disabled-on-vibrant_1njr6_121",
-  "fgColor-disabled-on-subtle": "_fgColor-disabled-on-subtle_1njr6_125",
-  "fgColor-sale-primary": "_fgColor-sale-primary_1njr6_129",
-  "fgColor-sale-on-vibrant": "_fgColor-sale-on-vibrant_1njr6_133"
+  "fgColor-primary": "_fgColor-primary_qlmrn_1",
+  "fgColor-secondary": "_fgColor-secondary_qlmrn_5",
+  "fgColor-accent-primary": "_fgColor-accent-primary_qlmrn_9",
+  "fgColor-accent-secondary": "_fgColor-accent-secondary_qlmrn_13",
+  "fgColor-accent-on-vibrant": "_fgColor-accent-on-vibrant_qlmrn_17",
+  "fgColor-accent-on-vibrant-accent": "_fgColor-accent-on-vibrant-accent_qlmrn_21",
+  "fgColor-accent-on-subtle": "_fgColor-accent-on-subtle_qlmrn_25",
+  "fgColor-accent-on-deep": "_fgColor-accent-on-deep_qlmrn_29",
+  "fgColor-critical-primary": "_fgColor-critical-primary_qlmrn_33",
+  "fgColor-critical-on-vibrant": "_fgColor-critical-on-vibrant_qlmrn_37",
+  "fgColor-critical-on-subtle": "_fgColor-critical-on-subtle_qlmrn_41",
+  "fgColor-warning-primary": "_fgColor-warning-primary_qlmrn_45",
+  "fgColor-warning-on-vibrant": "_fgColor-warning-on-vibrant_qlmrn_49",
+  "fgColor-warning-on-subtle": "_fgColor-warning-on-subtle_qlmrn_53",
+  "fgColor-caution-primary": "_fgColor-caution-primary_qlmrn_57",
+  "fgColor-caution-on-vibrant": "_fgColor-caution-on-vibrant_qlmrn_61",
+  "fgColor-caution-on-subtle": "_fgColor-caution-on-subtle_qlmrn_65",
+  "fgColor-success-primary": "_fgColor-success-primary_qlmrn_69",
+  "fgColor-success-on-vibrant": "_fgColor-success-on-vibrant_qlmrn_73",
+  "fgColor-success-on-subtle": "_fgColor-success-on-subtle_qlmrn_77",
+  "fgColor-information-primary": "_fgColor-information-primary_qlmrn_81",
+  "fgColor-information-on-vibrant": "_fgColor-information-on-vibrant_qlmrn_85",
+  "fgColor-information-on-subtle": "_fgColor-information-on-subtle_qlmrn_89",
+  "fgColor-inverse-primary": "_fgColor-inverse-primary_qlmrn_93",
+  "fgColor-inverse-on-vibrant": "_fgColor-inverse-on-vibrant_qlmrn_97",
+  "fgColor-inverse-on-subtle": "_fgColor-inverse-on-subtle_qlmrn_101",
+  "fgColor-white-primary": "_fgColor-white-primary_qlmrn_105",
+  "fgColor-white-on-vibrant": "_fgColor-white-on-vibrant_qlmrn_109",
+  "fgColor-white-on-subtle": "_fgColor-white-on-subtle_qlmrn_113",
+  "fgColor-disabled-primary": "_fgColor-disabled-primary_qlmrn_117",
+  "fgColor-disabled-on-vibrant": "_fgColor-disabled-on-vibrant_qlmrn_121",
+  "fgColor-disabled-on-subtle": "_fgColor-disabled-on-subtle_qlmrn_125",
+  "fgColor-sale-primary": "_fgColor-sale-primary_qlmrn_129",
+  "fgColor-sale-on-vibrant": "_fgColor-sale-on-vibrant_qlmrn_133"
 };
 const fgColorVariants = cva("", {
   variants: {

package/dist/utils/focus/focusStyles.js

@@ -1,6 +1,6 @@
 import { c as cva } from "../../index-Bi3v_EjJ.js";
-import '../../assets/focusStyles.css';const defaultFocus = "_defaultFocus_1xolq_1";
-const whiteFocus = "_whiteFocus_1xolq_5";
+import '../../assets/focusStyles.css';const defaultFocus = "_defaultFocus_17xw4_1";
+const whiteFocus = "_whiteFocus_17xw4_5";
 const styles = {
   defaultFocus,
   whiteFocus

package/dist/utils/padding/padding.d.ts

@@ -1,13 +1,13 @@
 import { VariantProps } from 'class-variance-authority';
 import { InputType } from 'storybook/internal/types';
 export declare const paddingVariants: (props?: ({
-    padding?: "lg" | "sm" | "md" | null | undefined;
-    paddingX?: "lg" | "sm" | "md" | null | undefined;
-    paddingY?: "lg" | "sm" | "md" | null | undefined;
-    paddingTop?: "lg" | "sm" | "md" | null | undefined;
-    paddingRight?: "lg" | "sm" | "md" | null | undefined;
-    paddingBottom?: "lg" | "sm" | "md" | null | undefined;
-    paddingLeft?: "lg" | "sm" | "md" | null | undefined;
+    padding?: "lg" | "sm" | "xs" | "md" | "5xs" | "4xs" | "3xs" | "2xs" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | null | undefined;
+    paddingX?: "lg" | "sm" | "xs" | "md" | "5xs" | "4xs" | "3xs" | "2xs" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | null | undefined;
+    paddingY?: "lg" | "sm" | "xs" | "md" | "5xs" | "4xs" | "3xs" | "2xs" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | null | undefined;
+    paddingTop?: "lg" | "sm" | "xs" | "md" | "5xs" | "4xs" | "3xs" | "2xs" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | null | undefined;
+    paddingRight?: "lg" | "sm" | "xs" | "md" | "5xs" | "4xs" | "3xs" | "2xs" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | null | undefined;
+    paddingBottom?: "lg" | "sm" | "xs" | "md" | "5xs" | "4xs" | "3xs" | "2xs" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | null | undefined;
+    paddingLeft?: "lg" | "sm" | "xs" | "md" | "5xs" | "4xs" | "3xs" | "2xs" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type PaddingVariants = VariantProps<typeof paddingVariants>;
 export declare const paddingArgTypes: Record<string, InputType>;