@drivy/cobalt 2.6.0 → 2.8.0

package/cjs/tokens/icons.js

@@ -239,6 +239,7 @@ const icons = {
 	searchCar: "search-car.svg",
 	searchPeople: "search-people.svg",
 	search: "search.svg",
+	seatbelt: "seatbelt.svg",
 	sedan: "sedan.svg",
 	send: "send.svg",
 	serviceBattery: "service-battery.svg",

package/cjs/tokens/icons.js.map

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

package/components/Buttons/Button/ButtonComponent.js

@@ -0,0 +1,22 @@
+import React, { forwardRef } from 'react';
+import '../../Icon/index.js';
+import LoadingIcon from '../../Icon/__generated__/LoadingIcon.js';
+
+const InnerButton = ({ children, loading, }) => (React.createElement(React.Fragment, null,
+    loading && React.createElement(LoadingIcon, { className: "cobalt-button__loading-icon" }),
+    children));
+const ButtonBase = forwardRef((props, ref) => {
+    const { disabled, loading, children, ...restProps } = props;
+    return (React.createElement("button", { ref: ref, "aria-disabled": disabled || loading, "aria-busy": loading, disabled: disabled || loading, ...restProps },
+        React.createElement(InnerButton, { loading: loading }, children)));
+});
+ButtonBase.displayName = "ButtonBase";
+const ButtonLinkBase = forwardRef((props, ref) => {
+    const { disabled, target, rel, loading, children, ...restProps } = props;
+    return (React.createElement("a", { ref: ref, "aria-disabled": disabled || loading, "aria-busy": loading, "data-disabled": disabled || loading, target: target, rel: target === "_blank" && !rel ? "noopener noreferrer" : rel, ...restProps },
+        React.createElement(InnerButton, { loading: loading }, children)));
+});
+ButtonLinkBase.displayName = "ButtonLinkBase";
+
+export { ButtonBase, ButtonLinkBase };
+//# sourceMappingURL=ButtonComponent.js.map

package/components/Buttons/Button/ButtonComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonComponent.js","sources":["../../../../src/components/Buttons/Button/ButtonComponent.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\"\nimport { LoadingIcon } from \"../../Icon\"\nimport { ButtonComponentProps, ButtonLinkComponentProps } from \"./type\"\n\nconst InnerButton = ({\n  children,\n  loading,\n}: {\n  children:\n    | ButtonComponentProps[\"children\"]\n    | ButtonLinkComponentProps[\"children\"]\n  loading: ButtonComponentProps[\"loading\"] | ButtonLinkComponentProps[\"loading\"]\n}) => (\n  <>\n    {loading && <LoadingIcon className=\"cobalt-button__loading-icon\" />}\n    {children}\n  </>\n)\n\nexport const ButtonBase = forwardRef<HTMLButtonElement, ButtonComponentProps>(\n  (props: ButtonComponentProps, ref) => {\n    const { disabled, loading, children, ...restProps } = props\n    return (\n      <button\n        ref={ref}\n        aria-disabled={disabled || loading}\n        aria-busy={loading}\n        disabled={disabled || loading}\n        {...restProps}\n      >\n        <InnerButton loading={loading}>{children}</InnerButton>\n      </button>\n    )\n  }\n)\nButtonBase.displayName = \"ButtonBase\"\n\nexport const ButtonLinkBase = forwardRef<\n  HTMLAnchorElement,\n  ButtonLinkComponentProps\n>((props: ButtonLinkComponentProps, ref) => {\n  const { disabled, target, rel, loading, children, ...restProps } = props\n  return (\n    <a\n      ref={ref}\n      aria-disabled={disabled || loading}\n      aria-busy={loading}\n      data-disabled={disabled || loading}\n      target={target}\n      rel={target === \"_blank\" && !rel ? \"noopener noreferrer\" : rel}\n      {...restProps}\n    >\n      <InnerButton loading={loading}>{children}</InnerButton>\n    </a>\n  )\n})\nButtonLinkBase.displayName = \"ButtonLinkBase\"\n"],"names":[],"mappings":";;;;AAIA,MAAM,WAAW,GAAG,CAAC,EACnB,QAAQ,EACR,OAAO,GAMR,MACC,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA;AACG,IAAA,OAAO,IAAI,KAAC,CAAA,aAAA,CAAA,WAAW,IAAC,SAAS,EAAC,6BAA6B,EAAG,CAAA;IAClE,QAAQ,CACR,CACJ,CAAA;AAEY,MAAA,UAAU,GAAG,UAAU,CAClC,CAAC,KAA2B,EAAE,GAAG,KAAI;AACnC,IAAA,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAA;AAC3D,IAAA,QACE,KACE,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,GAAG,EAAE,GAAG,EAAA,eAAA,EACO,QAAQ,IAAI,OAAO,EACvB,WAAA,EAAA,OAAO,EAClB,QAAQ,EAAE,QAAQ,IAAI,OAAO,KACzB,SAAS,EAAA;QAEb,KAAC,CAAA,aAAA,CAAA,WAAW,EAAC,EAAA,OAAO,EAAE,OAAO,IAAG,QAAQ,CAAe,CAChD,EACV;AACH,CAAC,EACF;AACD,UAAU,CAAC,WAAW,GAAG,YAAY,CAAA;AAExB,MAAA,cAAc,GAAG,UAAU,CAGtC,CAAC,KAA+B,EAAE,GAAG,KAAI;AACzC,IAAA,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAA;AACxE,IAAA,QACE,KACE,CAAA,aAAA,CAAA,GAAA,EAAA,EAAA,GAAG,EAAE,GAAG,mBACO,QAAQ,IAAI,OAAO,EAAA,WAAA,EACvB,OAAO,EACH,eAAA,EAAA,QAAQ,IAAI,OAAO,EAClC,MAAM,EAAE,MAAM,EACd,GAAG,EAAE,MAAM,KAAK,QAAQ,IAAI,CAAC,GAAG,GAAG,qBAAqB,GAAG,GAAG,KAC1D,SAAS,EAAA;QAEb,KAAC,CAAA,aAAA,CAAA,WAAW,EAAC,EAAA,OAAO,EAAE,OAAO,IAAG,QAAQ,CAAe,CACrD,EACL;AACH,CAAC,EAAC;AACF,cAAc,CAAC,WAAW,GAAG,gBAAgB;;;;"}

package/components/Buttons/Button/index.js

@@ -0,0 +1,49 @@
+import React, { forwardRef } from 'react';
+import cx from 'classnames';
+import { isLinkProps } from './type.js';
+import { ButtonLinkBase, ButtonBase } from './ButtonComponent.js';
+import '../../Icon/index.js';
+import ChevronRightIcon from '../../Icon/__generated__/ChevronRightIcon.js';
+
+const getComputedClassName = ({ className, variant, size, destructive, primary, text, isIconOnly, fullWidth, }) => {
+    return cx(className, "cobalt-button", {
+        "cobalt-button--primary": primary,
+        "cobalt-button--destructive": destructive,
+        "cobalt-button--text": text,
+        "cobalt-button--icon-only": isIconOnly,
+        "cobalt-button--small": size === "small",
+        "cobalt-button--large": size === "large",
+        "cobalt-button--warning": variant === "warning",
+        "cobalt-button--secondary": variant === "secondary",
+        "cobalt-button--tertiary": variant === "tertiary",
+        "cobalt-button--business": variant === "business",
+        "cobalt-button--success": variant === "success",
+        "cobalt-button--neutral": variant === "neutral",
+        "c-w-full": fullWidth,
+    });
+};
+const Button = forwardRef((props, ref) => {
+    const { children, className, variant, size, destructive, primary, text, icon, fullWidth, ...restProps } = props;
+    const computedClassName = getComputedClassName({
+        className,
+        variant,
+        size,
+        destructive,
+        primary,
+        text,
+        fullWidth,
+        isIconOnly: !!icon && !children,
+    });
+    const content = (React.createElement(React.Fragment, null,
+        icon,
+        children && React.createElement("span", null, children),
+        text && children ? React.createElement(ChevronRightIcon, null) : null));
+    if (isLinkProps(restProps)) {
+        return (React.createElement(ButtonLinkBase, { ...restProps, className: computedClassName, ref: ref }, content));
+    }
+    return (React.createElement(ButtonBase, { ...restProps, className: computedClassName, ref: ref }, content));
+});
+Button.displayName = "Button";
+
+export { Button as default };
+//# sourceMappingURL=index.js.map

package/components/Buttons/Button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/Buttons/Button/index.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\"\nimport cx from \"classnames\"\nimport {\n  ButtonComponentProps,\n  ButtonLinkComponentProps,\n  ButtonProps,\n  isLinkProps,\n} from \"./type\"\nimport { ButtonLinkBase, ButtonBase } from \"./ButtonComponent\"\nimport { ChevronRightIcon } from \"../../Icon\"\n\nconst getComputedClassName = ({\n  className,\n  variant,\n  size,\n  destructive,\n  primary,\n  text,\n  isIconOnly,\n  fullWidth,\n}: {\n  className?: ButtonProps[\"className\"]\n  variant?: ButtonProps[\"variant\"]\n  size?: ButtonProps[\"size\"]\n  destructive?: ButtonProps[\"destructive\"]\n  primary?: ButtonProps[\"primary\"]\n  text?: ButtonProps[\"text\"]\n  isIconOnly?: boolean\n  fullWidth?: ButtonProps[\"fullWidth\"]\n}) => {\n  return cx(className, \"cobalt-button\", {\n    \"cobalt-button--primary\": primary,\n    \"cobalt-button--destructive\": destructive,\n    \"cobalt-button--text\": text,\n    \"cobalt-button--icon-only\": isIconOnly,\n    \"cobalt-button--small\": size === \"small\",\n    \"cobalt-button--large\": size === \"large\",\n    \"cobalt-button--warning\": variant === \"warning\",\n    \"cobalt-button--secondary\": variant === \"secondary\",\n    \"cobalt-button--tertiary\": variant === \"tertiary\",\n    \"cobalt-button--business\": variant === \"business\",\n    \"cobalt-button--success\": variant === \"success\",\n    \"cobalt-button--neutral\": variant === \"neutral\",\n    \"c-w-full\": fullWidth,\n  })\n}\n\ninterface ButtonOverloads {\n  (\n    props: Exclude<ButtonProps, ButtonComponentProps> &\n      React.RefAttributes<HTMLAnchorElement>\n  ): React.ReactElement\n  (\n    props: Exclude<ButtonProps, ButtonLinkComponentProps> &\n      React.RefAttributes<HTMLButtonElement>\n  ): React.ReactElement\n  displayName?: string\n}\n\nconst Button = forwardRef<HTMLButtonElement | HTMLAnchorElement, ButtonProps>(\n  (props, ref) => {\n    const {\n      children,\n      className,\n      variant,\n      size,\n      destructive,\n      primary,\n      text,\n      icon,\n      fullWidth,\n      ...restProps\n    } = props\n\n    const computedClassName = getComputedClassName({\n      className,\n      variant,\n      size,\n      destructive,\n      primary,\n      text,\n      fullWidth,\n      isIconOnly: !!icon && !children,\n    })\n\n    const content = (\n      <>\n        {icon}\n        {children && <span>{children}</span>}\n        {text && children ? <ChevronRightIcon /> : null}\n      </>\n    )\n\n    if (isLinkProps(restProps)) {\n      return (\n        <ButtonLinkBase\n          {...(restProps as ButtonLinkComponentProps)}\n          className={computedClassName}\n          ref={ref as React.ForwardedRef<HTMLAnchorElement>}\n        >\n          {content}\n        </ButtonLinkBase>\n      )\n    }\n\n    return (\n      <ButtonBase\n        {...(restProps as ButtonComponentProps)}\n        className={computedClassName}\n        ref={ref as React.ForwardedRef<HTMLButtonElement>}\n      >\n        {content}\n      </ButtonBase>\n    )\n  }\n) as ButtonOverloads\n\nButton.displayName = \"Button\"\n\nexport default Button\n"],"names":[],"mappings":";;;;;;;AAWA,MAAM,oBAAoB,GAAG,CAAC,EAC5B,SAAS,EACT,OAAO,EACP,IAAI,EACJ,WAAW,EACX,OAAO,EACP,IAAI,EACJ,UAAU,EACV,SAAS,GAUV,KAAI;AACH,IAAA,OAAO,EAAE,CAAC,SAAS,EAAE,eAAe,EAAE;AACpC,QAAA,wBAAwB,EAAE,OAAO;AACjC,QAAA,4BAA4B,EAAE,WAAW;AACzC,QAAA,qBAAqB,EAAE,IAAI;AAC3B,QAAA,0BAA0B,EAAE,UAAU;QACtC,sBAAsB,EAAE,IAAI,KAAK,OAAO;QACxC,sBAAsB,EAAE,IAAI,KAAK,OAAO;QACxC,wBAAwB,EAAE,OAAO,KAAK,SAAS;QAC/C,0BAA0B,EAAE,OAAO,KAAK,WAAW;QACnD,yBAAyB,EAAE,OAAO,KAAK,UAAU;QACjD,yBAAyB,EAAE,OAAO,KAAK,UAAU;QACjD,wBAAwB,EAAE,OAAO,KAAK,SAAS;QAC/C,wBAAwB,EAAE,OAAO,KAAK,SAAS;AAC/C,QAAA,UAAU,EAAE,SAAS;AACtB,KAAA,CAAC,CAAA;AACJ,CAAC,CAAA;AAcK,MAAA,MAAM,GAAG,UAAU,CACvB,CAAC,KAAK,EAAE,GAAG,KAAI;IACb,MAAM,EACJ,QAAQ,EACR,SAAS,EACT,OAAO,EACP,IAAI,EACJ,WAAW,EACX,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,SAAS,EACT,GAAG,SAAS,EACb,GAAG,KAAK,CAAA;IAET,MAAM,iBAAiB,GAAG,oBAAoB,CAAC;QAC7C,SAAS;QACT,OAAO;QACP,IAAI;QACJ,WAAW;QACX,OAAO;QACP,IAAI;QACJ,SAAS;AACT,QAAA,UAAU,EAAE,CAAC,CAAC,IAAI,IAAI,CAAC,QAAQ;AAChC,KAAA,CAAC,CAAA;IAEF,MAAM,OAAO,IACX,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA;QACG,IAAI;QACJ,QAAQ,IAAI,KAAO,CAAA,aAAA,CAAA,MAAA,EAAA,IAAA,EAAA,QAAQ,CAAQ;AACnC,QAAA,IAAI,IAAI,QAAQ,GAAG,KAAC,CAAA,aAAA,CAAA,gBAAgB,EAAG,IAAA,CAAA,GAAG,IAAI,CAC9C,CACJ,CAAA;AAED,IAAA,IAAI,WAAW,CAAC,SAAS,CAAC,EAAE;AAC1B,QAAA,QACE,KAAC,CAAA,aAAA,CAAA,cAAc,EACR,EAAA,GAAA,SAAsC,EAC3C,SAAS,EAAE,iBAAiB,EAC5B,GAAG,EAAE,GAA4C,IAEhD,OAAO,CACO,EAClB;KACF;AAED,IAAA,QACE,KAAC,CAAA,aAAA,CAAA,UAAU,EACJ,EAAA,GAAA,SAAkC,EACvC,SAAS,EAAE,iBAAiB,EAC5B,GAAG,EAAE,GAA4C,IAEhD,OAAO,CACG,EACd;AACH,CAAC,EACiB;AAEpB,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}

package/components/Buttons/Button/type.js

@@ -0,0 +1,4 @@
+const isLinkProps = (props) => "href" in props && !!props.href;
+
+export { isLinkProps };
+//# sourceMappingURL=type.js.map

package/components/Buttons/Button/type.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"type.js","sources":["../../../../src/components/Buttons/Button/type.ts"],"sourcesContent":["type SharedButtonApiProps = {\n  loading?: boolean\n  disabled?: boolean\n  primary?: boolean\n  destructive?: boolean\n  icon?: React.ReactNode\n  text?: boolean\n  fullWidth?: boolean\n  // React.HTMLAttributes allows color to be passed in, but we don't want to allow it\n  color?: never\n}\n\ntype SharedConditionalTextProps =\n  | {\n      text: true\n      icon: React.ReactNode\n      children?: never | false | undefined | null\n      fullWidth?: never | false\n    }\n  | {\n      text: true\n      icon?: never\n      fullWidth?: never | false\n    }\n  | {\n      text?: false\n    }\n\ntype SharedConditionalVariantProps =\n  | {\n      size?: \"large\"\n      variant?: never\n    }\n  | {\n      size: \"small\"\n      destructive?: false\n      primary?: false\n      // Those variants are only available for small buttons\n      variant:\n        | \"warning\"\n        | \"secondary\"\n        | \"tertiary\"\n        | \"business\"\n        | \"success\"\n        | \"neutral\"\n    }\n  | {\n      size: \"small\"\n      variant?: never\n    }\n\n// Button props\nexport type ButtonComponentProps =\n  React.ButtonHTMLAttributes<HTMLButtonElement> & {\n    loading?: SharedButtonApiProps[\"loading\"]\n    disabled?: SharedButtonApiProps[\"disabled\"]\n    href?: never\n  }\n\n// Link props\nexport type ButtonLinkComponentProps =\n  React.AnchorHTMLAttributes<HTMLAnchorElement> & {\n    loading?: SharedButtonApiProps[\"loading\"]\n    disabled?: SharedButtonApiProps[\"disabled\"]\n    href?: string\n  }\n\nexport const isLinkProps = (\n  props: ButtonComponentProps | ButtonLinkComponentProps\n): props is ButtonLinkComponentProps => \"href\" in props && !!props.href\n\nexport type ButtonProps = (ButtonComponentProps | ButtonLinkComponentProps) &\n  SharedButtonApiProps &\n  SharedConditionalVariantProps &\n  SharedConditionalTextProps\n"],"names":[],"mappings":"AAmEa,MAAA,WAAW,GAAG,CACzB,KAAsD,KAChB,MAAM,IAAI,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC;;;;"}

package/components/Buttons/ButtonsGroup.js

@@ -3,6 +3,7 @@ import cx from 'classnames';
 import GhostButton from './GhostButton/index.js';
 import InversedButton from './InversedButton/index.js';
 import DefaultButton from './DefaultButton/index.js';
+import Button from './Button/index.js';
 
 const isButton = (component) => React.isValidElement(component) &&
     (component.type === GhostButton ||
@@ -10,7 +11,8 @@ const isButton = (component) => React.isValidElement(component) &&
         component.type === InversedButton ||
         component.type === InversedButton.Link ||
         component.type === DefaultButton ||
-        component.type === DefaultButton.Link);
+        component.type === DefaultButton.Link ||
+        component.type === Button);
 const ButtonsGroup = ({ className, children, align }) => (React.createElement("div", { className: cx(className, "cobalt-buttons-group", {
         "cobalt-buttons-group--right": align === "right",
         "cobalt-buttons-group--center": align === "center",

package/components/Buttons/ButtonsGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonsGroup.js","sources":["../../../src/components/Buttons/ButtonsGroup.tsx"],"sourcesContent":["import React, { Children } from \"react\"\nimport cx from \"classnames\"\n\nimport GhostButton from \"./GhostButton\"\nimport InversedButton from \"./InversedButton\"\nimport DefaultButton from \"./DefaultButton\"\nimport { AllButtonsPropsType } from \"./\"\n\nexport interface ButtonsGroupProps {\n  className?: string\n  children: React.ReactNode\n  align?: \"fullWidth\" | \"right\" | \"center\"\n}\n\nconst isButton = (\n  component: React.ReactNode\n): component is React.ReactElement<AllButtonsPropsType> =>\n  React.isValidElement(component) &&\n  (component.type === GhostButton ||\n    component.type === GhostButton.Link ||\n    component.type === InversedButton ||\n    component.type === InversedButton.Link ||\n    component.type === DefaultButton ||\n    component.type === DefaultButton.Link)\n\nconst ButtonsGroup = ({ className, children, align }: ButtonsGroupProps) => (\n  <div\n    className={cx(className, \"cobalt-buttons-group\", {\n      \"cobalt-buttons-group--right\": align === \"right\",\n      \"cobalt-buttons-group--center\": align === \"center\",\n    })}\n  >\n    {Children.toArray(children).map((child, index) =>\n      isButton(child)\n        ? React.cloneElement(child, {\n            key: index,\n            className: cx(\"cobalt-buttons-group__item\", {\n              \"cobalt-buttons-group__item--fullWidth\": align === \"fullWidth\",\n            }),\n            fullWidth: align === \"fullWidth\",\n          })\n        : child\n    )}\n  </div>\n)\n\nexport default ButtonsGroup\n"],"names":[],"mappings":";;;;;;AAcA,MAAM,QAAQ,GAAG,CACf,SAA0B,KAE1B,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC;AAC/B,KAAC,SAAS,CAAC,IAAI,KAAK,WAAW;AAC7B,QAAA,SAAS,CAAC,IAAI,KAAK,WAAW,CAAC,IAAI;QACnC,SAAS,CAAC,IAAI,KAAK,cAAc;AACjC,QAAA,SAAS,CAAC,IAAI,KAAK,cAAc,CAAC,IAAI;QACtC,SAAS,CAAC,IAAI,KAAK,aAAa;AAChC,QAAA,SAAS,CAAC,IAAI,KAAK,aAAa,CAAC,IAAI,CAAC,CAAA;AAEpC,MAAA,YAAY,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAqB,MACrE,6BACE,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE,sBAAsB,EAAE;QAC/C,6BAA6B,EAAE,KAAK,KAAK,OAAO;QAChD,8BAA8B,EAAE,KAAK,KAAK,QAAQ;KACnD,CAAC,EAAA,EAED,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,KAC3C,QAAQ,CAAC,KAAK,CAAC;AACb,MAAE,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE;AACxB,QAAA,GAAG,EAAE,KAAK;AACV,QAAA,SAAS,EAAE,EAAE,CAAC,4BAA4B,EAAE;YAC1C,uCAAuC,EAAE,KAAK,KAAK,WAAW;SAC/D,CAAC;QACF,SAAS,EAAE,KAAK,KAAK,WAAW;KACjC,CAAC;AACJ,MAAE,KAAK,CACV,CACG;;;;"}
+{"version":3,"file":"ButtonsGroup.js","sources":["../../../src/components/Buttons/ButtonsGroup.tsx"],"sourcesContent":["import React, { Children } from \"react\"\nimport cx from \"classnames\"\n\nimport GhostButton from \"./GhostButton\"\nimport InversedButton from \"./InversedButton\"\nimport DefaultButton from \"./DefaultButton\"\nimport { AllButtonsPropsType } from \"./\"\nimport Button from \"./Button\"\n\nexport interface ButtonsGroupProps {\n  className?: string\n  children: React.ReactNode\n  align?: \"fullWidth\" | \"right\" | \"center\"\n}\n\nconst isButton = (\n  component: React.ReactNode\n): component is React.ReactElement<AllButtonsPropsType> =>\n  React.isValidElement(component) &&\n  (component.type === GhostButton ||\n    component.type === GhostButton.Link ||\n    component.type === InversedButton ||\n    component.type === InversedButton.Link ||\n    component.type === DefaultButton ||\n    component.type === DefaultButton.Link ||\n    component.type === Button)\n\nconst ButtonsGroup = ({ className, children, align }: ButtonsGroupProps) => (\n  <div\n    className={cx(className, \"cobalt-buttons-group\", {\n      \"cobalt-buttons-group--right\": align === \"right\",\n      \"cobalt-buttons-group--center\": align === \"center\",\n    })}\n  >\n    {Children.toArray(children).map((child, index) =>\n      isButton(child)\n        ? React.cloneElement(child, {\n            key: index,\n            className: cx(\"cobalt-buttons-group__item\", {\n              \"cobalt-buttons-group__item--fullWidth\": align === \"fullWidth\",\n            }),\n            fullWidth: align === \"fullWidth\",\n          })\n        : child\n    )}\n  </div>\n)\n\nexport default ButtonsGroup\n"],"names":[],"mappings":";;;;;;;AAeA,MAAM,QAAQ,GAAG,CACf,SAA0B,KAE1B,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC;AAC/B,KAAC,SAAS,CAAC,IAAI,KAAK,WAAW;AAC7B,QAAA,SAAS,CAAC,IAAI,KAAK,WAAW,CAAC,IAAI;QACnC,SAAS,CAAC,IAAI,KAAK,cAAc;AACjC,QAAA,SAAS,CAAC,IAAI,KAAK,cAAc,CAAC,IAAI;QACtC,SAAS,CAAC,IAAI,KAAK,aAAa;AAChC,QAAA,SAAS,CAAC,IAAI,KAAK,aAAa,CAAC,IAAI;AACrC,QAAA,SAAS,CAAC,IAAI,KAAK,MAAM,CAAC,CAAA;AAExB,MAAA,YAAY,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAqB,MACrE,6BACE,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE,sBAAsB,EAAE;QAC/C,6BAA6B,EAAE,KAAK,KAAK,OAAO;QAChD,8BAA8B,EAAE,KAAK,KAAK,QAAQ;KACnD,CAAC,EAAA,EAED,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,KAC3C,QAAQ,CAAC,KAAK,CAAC;AACb,MAAE,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE;AACxB,QAAA,GAAG,EAAE,KAAK;AACV,QAAA,SAAS,EAAE,EAAE,CAAC,4BAA4B,EAAE;YAC1C,uCAAuC,EAAE,KAAK,KAAK,WAAW;SAC/D,CAAC;QACF,SAAS,EAAE,KAAK,KAAK,WAAW;KACjC,CAAC;AACJ,MAAE,KAAK,CACV,CACG;;;;"}

package/components/Icon/__generated__/SeatbeltIcon.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import camelize from '../../utils/camelize.js';
+import 'lodash.throttle';
+import cx from 'classnames';
+
+const iconSource = "seatbelt";
+const SeatbeltIcon = ({ color, size = 24, contained = false, className, }) => {
+    const computedClassName = cx(className, `cobalt-Icon cobalt-Icon--${iconSource}`, {
+        [`c-fill-${camelize(color || "")}`]: color,
+        "cobalt-Icon--size16": size === 16,
+        "cobalt-Icon--size20": size === 20,
+        "cobalt-Icon--size32": size === 32,
+        "cobalt-Icon--contained": contained,
+    });
+    const wrap = (content) => (React.createElement("span", { className: computedClassName }, content));
+    return wrap(React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" },
+        React.createElement("path", { d: "M12.5 10.462c-3.176 0-5.16-3.526-3.573-6.347a4.074 4.074 0 0 1 7.145 0c.362.644.552 1.373.552 2.116-.002 2.335-1.848 4.228-4.124 4.23m6.749 10H7.734l11.26-10.193a.77.77 0 0 0 .255-.603c-.02-.591-.656-.94-1.146-.627a1 1 0 0 0-.1.076l-2.3 2.082c-4.515-2.189-9.815.674-10.61 5.73a1 1 0 0 0-.008.107L5 21.214a.76.76 0 0 0 .75.786H19.25c.577 0 .938-.641.65-1.154a.75.75 0 0 0-.65-.384m-1.114-7.02a.74.74 0 0 0-.586.187l-5.85 5.294h7.55a.76.76 0 0 0 .75-.77 7.8 7.8 0 0 0-1.338-4.386.75.75 0 0 0-.526-.325" })));
+};
+
+export { SeatbeltIcon as default };
+//# sourceMappingURL=SeatbeltIcon.js.map

package/components/Icon/__generated__/SeatbeltIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SeatbeltIcon.js","sources":["../../../../src/components/Icon/__generated__/SeatbeltIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColorsType } from \"../\"\nimport { camelize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n  color?: IconColorsType\n  size?: 16 | 20 | 24 | 32\n  contained?: boolean\n  className?: string\n}\nconst iconSource = \"seatbelt\"\nconst SeatbeltIcon = ({\n  color,\n  size = 24,\n  contained = false,\n  className,\n}: IconProps) => {\n  const computedClassName = cx(\n    className,\n    `cobalt-Icon cobalt-Icon--${iconSource}`,\n    {\n      [`c-fill-${camelize(color || \"\")}`]: color,\n      \"cobalt-Icon--size16\": size === 16,\n      \"cobalt-Icon--size20\": size === 20,\n      \"cobalt-Icon--size32\": size === 32,\n      \"cobalt-Icon--contained\": contained,\n    }\n  )\n  const wrap = (content: React.ReactNode) => (\n    <span className={computedClassName}>{content}</span>\n  )\n  return wrap(\n    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n      <path d=\"M12.5 10.462c-3.176 0-5.16-3.526-3.573-6.347a4.074 4.074 0 0 1 7.145 0c.362.644.552 1.373.552 2.116-.002 2.335-1.848 4.228-4.124 4.23m6.749 10H7.734l11.26-10.193a.77.77 0 0 0 .255-.603c-.02-.591-.656-.94-1.146-.627a1 1 0 0 0-.1.076l-2.3 2.082c-4.515-2.189-9.815.674-10.61 5.73a1 1 0 0 0-.008.107L5 21.214a.76.76 0 0 0 .75.786H19.25c.577 0 .938-.641.65-1.154a.75.75 0 0 0-.65-.384m-1.114-7.02a.74.74 0 0 0-.586.187l-5.85 5.294h7.55a.76.76 0 0 0 .75-.77 7.8 7.8 0 0 0-1.338-4.386.75.75 0 0 0-.526-.325\" />\n    </svg>\n  )\n}\nexport default SeatbeltIcon\n"],"names":[],"mappings":";;;;;AAUA,MAAM,UAAU,GAAG,UAAU,CAAA;AAC7B,MAAM,YAAY,GAAG,CAAC,EACpB,KAAK,EACL,IAAI,GAAG,EAAE,EACT,SAAS,GAAG,KAAK,EACjB,SAAS,GACC,KAAI;IACd,MAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,CAAA,yBAAA,EAA4B,UAAU,CAAA,CAAE,EACxC;QACE,CAAC,CAAA,OAAA,EAAU,QAAQ,CAAC,KAAK,IAAI,EAAE,CAAC,CAAA,CAAE,GAAG,KAAK;QAC1C,qBAAqB,EAAE,IAAI,KAAK,EAAE;QAClC,qBAAqB,EAAE,IAAI,KAAK,EAAE;QAClC,qBAAqB,EAAE,IAAI,KAAK,EAAE;AAClC,QAAA,wBAAwB,EAAE,SAAS;AACpC,KAAA,CACF,CAAA;AACD,IAAA,MAAM,IAAI,GAAG,CAAC,OAAwB,MACpC,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,iBAAiB,EAAA,EAAG,OAAO,CAAQ,CACrD,CAAA;IACD,OAAO,IAAI,CACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,WAAW,EAAA;AACzD,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,CAAC,EAAC,qfAAqf,EAAG,CAAA,CAC5f,CACP,CAAA;AACH;;;;"}

package/icons/index.js

@@ -234,6 +234,7 @@ export { default as sealCheck } from './seal-check.js';
 export { default as searchCar } from './search-car.js';
 export { default as searchPeople } from './search-people.js';
 export { default as search } from './search.js';
+export { default as seatbelt } from './seatbelt.js';
 export { default as sedan } from './sedan.js';
 export { default as send } from './send.js';
 export { default as serviceBattery } from './service-battery.js';

package/icons/index.js.map

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

package/icons/seatbelt.js

@@ -0,0 +1,4 @@
+var seatbelt = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\"><path d=\"M12.5 10.462c-3.176 0-5.16-3.526-3.573-6.347a4.074 4.074 0 0 1 7.145 0c.362.644.552 1.373.552 2.116-.002 2.335-1.848 4.228-4.124 4.23m6.749 10H7.734l11.26-10.193a.77.77 0 0 0 .255-.603c-.02-.591-.656-.94-1.146-.627a1 1 0 0 0-.1.076l-2.3 2.082c-4.515-2.189-9.815.674-10.61 5.73a1 1 0 0 0-.008.107L5 21.214a.76.76 0 0 0 .75.786h13.5c.577 0 .938-.641.65-1.154a.75.75 0 0 0-.65-.384m-1.114-7.02a.74.74 0 0 0-.586.187l-5.85 5.294h7.55a.76.76 0 0 0 .75-.77 7.8 7.8 0 0 0-1.338-4.386.75.75 0 0 0-.526-.325\"/></svg>";
+
+export { seatbelt as default };
+//# sourceMappingURL=seatbelt.js.map

package/icons/seatbelt.js.map

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

package/icons/seatbelt.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12.5 10.462c-3.176 0-5.16-3.526-3.573-6.347a4.074 4.074 0 0 1 7.145 0c.362.644.552 1.373.552 2.116-.002 2.335-1.848 4.228-4.124 4.23m6.749 10H7.734l11.26-10.193a.77.77 0 0 0 .255-.603c-.02-.591-.656-.94-1.146-.627a1 1 0 0 0-.1.076l-2.3 2.082c-4.515-2.189-9.815.674-10.61 5.73a1 1 0 0 0-.008.107L5 21.214a.76.76 0 0 0 .75.786H19.25c.577 0 .938-.641.65-1.154a.75.75 0 0 0-.65-.384m-1.114-7.02a.74.74 0 0 0-.586.187l-5.85 5.294h7.55a.76.76 0 0 0 .75-.77 7.8 7.8 0 0 0-1.338-4.386.75.75 0 0 0-.526-.325"/></svg>

package/index.js

@@ -121,7 +121,6 @@ export { default as CheckCircleIcon } from './components/Icon/__generated__/Chec
 export { default as ChecklistIcon } from './components/Icon/__generated__/ChecklistIcon.js';
 export { default as ChevronDownIcon } from './components/Icon/__generated__/ChevronDownIcon.js';
 export { default as ChevronLeftIcon } from './components/Icon/__generated__/ChevronLeftIcon.js';
-export { default as ChevronRightIcon } from './components/Icon/__generated__/ChevronRightIcon.js';
 export { default as ChevronUpIcon } from './components/Icon/__generated__/ChevronUpIcon.js';
 export { default as CircledArrowLeftIcon } from './components/Icon/__generated__/CircledArrowLeftIcon.js';
 export { default as CircledArrowRightIcon } from './components/Icon/__generated__/CircledArrowRightIcon.js';
@@ -293,6 +292,7 @@ export { default as SealCheckIcon } from './components/Icon/__generated__/SealCh
 export { default as SearchCarIcon } from './components/Icon/__generated__/SearchCarIcon.js';
 export { default as SearchIcon } from './components/Icon/__generated__/SearchIcon.js';
 export { default as SearchPeopleIcon } from './components/Icon/__generated__/SearchPeopleIcon.js';
+export { default as SeatbeltIcon } from './components/Icon/__generated__/SeatbeltIcon.js';
 export { default as SedanIcon } from './components/Icon/__generated__/SedanIcon.js';
 export { default as SendIcon } from './components/Icon/__generated__/SendIcon.js';
 export { default as ServiceBatteryIcon } from './components/Icon/__generated__/ServiceBatteryIcon.js';
@@ -365,6 +365,7 @@ export { default as YingyangIcon } from './components/Icon/__generated__/Yingyan
 export { default as RatingLabel } from './components/Rating/RatingLabel.js';
 export { useAccordionItemContext } from '@ark-ui/react';
 export { default as CheckIcon } from './components/Icon/__generated__/CheckIcon.js';
+export { default as ChevronRightIcon } from './components/Icon/__generated__/ChevronRightIcon.js';
 export { default as LoadingIcon } from './components/Icon/__generated__/LoadingIcon.js';
 export { default as StarIcon } from './components/Icon/__generated__/StarIcon.js';
 export { RatingInput } from './components/Rating/RatingInput.js';

package/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": "@drivy/cobalt",
-  "version": "2.6.0",
+  "version": "2.8.0",
   "description": "Opinionated design system for Drivy's projects.",
   "main": "src/index.js",
   "types": "types/src/index.d.ts",
@@ -37,7 +37,7 @@
     "react-dom": "^18.3.1"
   },
   "devDependencies": {
-    "@getaround-eu/babel-preset-app": "1.4.5",
+    "@getaround-eu/babel-preset-app": "1.4.6",
     "@getaround-eu/eslint-config": "3.1.0",
     "@getaround-eu/prettier-config": "1.2.1",
     "@getaround-eu/stylelint-config": "3.0.1",
@@ -61,8 +61,8 @@
     "@types/node": "22.14.1",
     "@types/react": "18.3.24",
     "@types/react-dom": "18.3.7",
-    "autoprefixer": "10.4.21",
-    "core-js": "3.46.0",
+    "autoprefixer": "10.4.22",
+    "core-js": "3.47.0",
     "css-loader": "7.1.2",
     "eslint": "8.57.1",
     "eslint-plugin-storybook": "^0.12.0",
@@ -88,7 +88,7 @@
     "rollup-plugin-copy": "3.5.0",
     "rollup-plugin-svgo": "2.0.0",
     "rollup-plugin-typescript2": "0.36.0",
-    "sass": "1.93.2",
+    "sass": "1.95.0",
     "sass-loader": "13.3.3",
     "sharp-cli": "5.2.0",
     "storybook": "7.6.20",
@@ -96,8 +96,8 @@
     "stylelint": "15.11.0",
     "svg2vectordrawable": "2.9.1",
     "svgo": "3.3.2",
-    "ts-jest": "29.4.5",
-    "tsx": "4.20.6",
+    "ts-jest": "29.4.6",
+    "tsx": "4.21.0",
     "typescript": "5.4.5"
   },
   "keywords": [

package/styles/components/Buttons/Button/index.scss

@@ -0,0 +1,140 @@
+.cobalt-button {
+  @apply c-state-interactive c-transition c-px-[20px] c-border c-border-outline c-rounded-lg c-bg-surface c-text-primary c-text-body-md c-font-bold c-gap-2xs hover:c-drop-shadow-lg;
+  display: inline-flex;
+  box-sizing: border-box;
+  align-items: center;
+  justify-content: center;
+  min-width: 44px;
+  min-height: 44px;
+
+  text-align: center;
+  text-decoration: none;
+  vertical-align: middle;
+
+  cursor: pointer;
+
+  transform: scale(1);
+  user-select: none;
+  appearance: none;
+
+  &:active {
+    transform: scale(0.97);
+  }
+
+  .cobalt-Icon {
+    width: 24px;
+    height: 24px;
+
+    flex-shrink: 0;
+  }
+
+  &.cobalt-button--large {
+    @apply c-px-md;
+    min-height: 48px;
+    min-width: 48px;
+  }
+
+  &.cobalt-button--small {
+    @apply c-px-[12px] hover:c-drop-shadow-md;
+    min-width: 32px;
+    min-height: 32px;
+
+    font-size: 14px;
+
+    .cobalt-Icon {
+      width: 20px;
+      height: 20px;
+    }
+
+    &.cobalt-button--warning {
+      @apply c-bg-warning c-border-warning c-text-onWarning;
+    }
+
+    &.cobalt-button--tertiary {
+      @apply c-bg-tertiary c-border-tertiary c-text-onTertiary;
+    }
+
+    &.cobalt-button--secondary {
+      @apply c-bg-secondary c-border-secondary c-text-onSecondary;
+    }
+
+    &.cobalt-button--business {
+      @apply c-bg-businessContainer c-border-businessContainer c-text-onBusinessContainer;
+    }
+
+    &.cobalt-button--success {
+      @apply c-bg-success c-border-success c-text-onSuccess;
+    }
+
+    &.cobalt-button--neutral {
+      @apply c-bg-neutral c-border-neutral c-text-onNeutral;
+    }
+  }
+
+  &.cobalt-button--primary {
+    @apply c-bg-primary c-border-primary c-text-onPrimary;
+
+    &.cobalt-button--destructive {
+      @apply c-bg-error c-border-error c-text-onError;
+    }
+  }
+
+  &.cobalt-button--icon-only {
+    @apply c-p-none c-rounded-full;
+  }
+
+  &.cobalt-button--text {
+    @apply c-state-none c-transform-none hover:c-underline c-px-none c-bg-transparent c-border-transparent c-text-current c-drop-shadow-none c-gap-none;
+    transition: text-underline-offset 0.25s ease;
+
+    text-underline-offset: 2px;
+
+    &:active {
+      text-underline-offset: 1px;
+    }
+
+    &.cobalt-button--icon-only {
+      @apply c-state-interactive;
+    }
+  }
+
+  &.cobalt-button--destructive {
+    @apply c-text-error;
+  }
+
+  &[disabled][aria-disabled]:not([aria-disabled="false"]):not(
+      [aria-busy="true"]
+    ) {
+    @apply c-state-none c-text-onSurfaceDisabled c-drop-shadow-none hover:c-no-underline;
+    opacity: 1;
+    cursor: not-allowed;
+
+    &:not(.cobalt-button--text) {
+      @apply c-bg-disabled c-border-transparent;
+    }
+  }
+
+  &[aria-busy="true"] {
+    @apply c-state-none c-drop-shadow-none hover:c-no-underline;
+    --c-state-interactive-color: var(--c-press);
+    cursor: not-allowed;
+
+    &:focus,
+    &:hover,
+    &:active {
+      --c-state-interactive-color: var(--c-press);
+
+      transform: scale(1);
+    }
+  }
+
+  .cobalt-button__loading-icon {
+    position: absolute;
+
+    margin: auto;
+  }
+
+  &[aria-busy="true"] > *:not(.cobalt-button__loading-icon) {
+    color: transparent;
+  }
+}

package/styles/components/Buttons/index.scss

@@ -133,7 +133,7 @@
 }
 
 .cobalt-buttons-group {
-  @apply c--mt-sm;
+  @apply c--mt-xs c-gap-x-sm;
   display: flex;
   flex-wrap: wrap;
   align-items: center;
@@ -147,13 +147,7 @@
   }
 
   &__item {
-    @apply c-mt-sm;
-
-    &:not(.cobalt-buttons-group__item--fullWidth):not(
-        .cobalt-buttons-group__item--xs\:fullWidth
-      ) {
-      @apply c-mr-sm;
-    }
+    @apply c-mt-xs;
 
     &--fullWidth {
       flex: 1 1 auto;
@@ -168,6 +162,7 @@
   }
 }
 
+@import "./Button/index.scss";
 @import "./InversedButton/index.scss";
 @import "./GhostButton/index.scss";
 @import "./DefaultButton/index.scss";

package/tokens/icons.js

@@ -235,6 +235,7 @@ const icons = {
 	searchCar: "search-car.svg",
 	searchPeople: "search-people.svg",
 	search: "search.svg",
+	seatbelt: "seatbelt.svg",
 	sedan: "sedan.svg",
 	send: "send.svg",
 	serviceBattery: "service-battery.svg",

package/tokens/icons.js.map

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

package/types/src/components/Buttons/Button/ButtonComponent.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+export declare const ButtonBase: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & {
+    loading?: boolean | undefined;
+    disabled?: boolean | undefined;
+    href?: undefined;
+} & React.RefAttributes<HTMLButtonElement>>;
+export declare const ButtonLinkBase: React.ForwardRefExoticComponent<React.AnchorHTMLAttributes<HTMLAnchorElement> & {
+    loading?: boolean | undefined;
+    disabled?: boolean | undefined;
+    href?: string | undefined;
+} & React.RefAttributes<HTMLAnchorElement>>;

package/types/src/components/Buttons/Button/index.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { ButtonComponentProps, ButtonLinkComponentProps, ButtonProps } from "./type";
+interface ButtonOverloads {
+    (props: Exclude<ButtonProps, ButtonComponentProps> & React.RefAttributes<HTMLAnchorElement>): React.ReactElement;
+    (props: Exclude<ButtonProps, ButtonLinkComponentProps> & React.RefAttributes<HTMLButtonElement>): React.ReactElement;
+    displayName?: string;
+}
+declare const Button: ButtonOverloads;
+export default Button;

package/types/src/components/Buttons/Button/type.d.ts

@@ -0,0 +1,48 @@
+/// <reference types="react" />
+type SharedButtonApiProps = {
+    loading?: boolean;
+    disabled?: boolean;
+    primary?: boolean;
+    destructive?: boolean;
+    icon?: React.ReactNode;
+    text?: boolean;
+    fullWidth?: boolean;
+    color?: never;
+};
+type SharedConditionalTextProps = {
+    text: true;
+    icon: React.ReactNode;
+    children?: never | false | undefined | null;
+    fullWidth?: never | false;
+} | {
+    text: true;
+    icon?: never;
+    fullWidth?: never | false;
+} | {
+    text?: false;
+};
+type SharedConditionalVariantProps = {
+    size?: "large";
+    variant?: never;
+} | {
+    size: "small";
+    destructive?: false;
+    primary?: false;
+    variant: "warning" | "secondary" | "tertiary" | "business" | "success" | "neutral";
+} | {
+    size: "small";
+    variant?: never;
+};
+export type ButtonComponentProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {
+    loading?: SharedButtonApiProps["loading"];
+    disabled?: SharedButtonApiProps["disabled"];
+    href?: never;
+};
+export type ButtonLinkComponentProps = React.AnchorHTMLAttributes<HTMLAnchorElement> & {
+    loading?: SharedButtonApiProps["loading"];
+    disabled?: SharedButtonApiProps["disabled"];
+    href?: string;
+};
+export declare const isLinkProps: (props: ButtonComponentProps | ButtonLinkComponentProps) => props is ButtonLinkComponentProps;
+export type ButtonProps = (ButtonComponentProps | ButtonLinkComponentProps) & SharedButtonApiProps & SharedConditionalVariantProps & SharedConditionalTextProps;
+export {};

package/types/src/components/Form/Autocomplete/index.d.ts

@@ -34,7 +34,7 @@ declare const Autocomplete: React.ForwardRefExoticComponent<{
     label?: string | undefined;
     hint?: string | undefined;
     fullWidth?: boolean | undefined;
-    icon?: "accountDetails" | "addPicture" | "airConditioning" | "airport" | "android" | "antique" | "arrowLeftCircleFilled" | "arrowLeft" | "arrowRightCircleFilled" | "arrowRightCircle" | "arrowRight" | "audioInput" | "babySeat" | "bank" | "battery" | "bell" | "bikeRack" | "bin" | "bluetooth" | "briefcase" | "bulb" | "cable" | "cabriolet" | "calendarCheck" | "calendarClock" | "calendarEnd" | "calendarStart" | "calendar" | "cameraAdd" | "camera" | "campervan" | "capacity" | "carAdd" | "carCheck" | "carDamages" | "carDrivyOpen" | "carGroup" | "carLock" | "carPlay" | "carReturn" | "carSearch" | "carTypeAntique" | "carTypeCabriolet" | "carTypeCampervan" | "carTypeCity" | "carTypeConvertible" | "carTypeCoupe" | "carTypeFamily" | "carTypeFourFour" | "carTypeMinibus" | "carTypeSedan" | "carTypeUtility" | "car" | "card" | "cdPlayer" | "certificate" | "chains" | "checkCircleFilled" | "checkCircle" | "check" | "checklist" | "chevronDown" | "chevronLeft" | "chevronRight" | "chevronUp" | "circledArrowLeft" | "circledArrowRight" | "city" | "cleaning" | "clockAlert" | "clockBackwards" | "clockForwards" | "clock" | "closeCircleFilled" | "close" | "collapse" | "connectCar" | "contactMail" | "contactPhone" | "contextualPaperclip" | "contextualQuestion" | "contextualWarningCircleFilled" | "contextualWarningCircle" | "contract" | "convertible" | "copy" | "coupe" | "creditCardAdd" | "creditCardError" | "creditCard" | "cruiseControl" | "dashcam" | "directions" | "document" | "dotHorizontal" | "dotVertical" | "dotsHorizontal" | "dotsVertical" | "download" | "earning" | "earth" | "edit" | "electric" | "evBattery" | "evCable" | "evCharger" | "expand" | "externalLink" | "eyeClosed" | "eyeOpened" | "eye" | "faceRecognition" | "facebook" | "family" | "fileFilled" | "filepdf" | "filexls" | "filter" | "filters" | "flag" | "fourByFour" | "fourWheelDrive" | "fuelTank" | "geolocation" | "gift" | "gps" | "graphUp" | "healing" | "heart" | "hitch" | "home" | "idCard" | "incident" | "infoCircleFilled" | "infoCircle" | "infoFilled" | "info" | "instant" | "invoice" | "keyConnect" | "key" | "licenceCheck" | "licencePaper" | "licence" | "lifeBuoy" | "linkedin" | "loading" | "locality" | "locationMap" | "locationParking" | "locationPin" | "location" | "lockCheck" | "locked" | "login" | "logout" | "mailCheck" | "mail" | "mapAlt" | "map" | "meetDriver" | "meetOwner" | "menuList" | "messages" | "mileage" | "minibus" | "minusCircleFilled" | "minus" | "miscGift" | "moon" | "nearbyDevice" | "notification" | "number1Circle" | "number2Circle" | "number3Circle" | "number4Circle" | "number5Circle" | "okHand" | "optionAirConditioning" | "optionAndroidAuto" | "optionAppleCarplay" | "optionAudioInput" | "optionBabySeat" | "optionBikeRack" | "optionBluetoothAudio" | "optionCdPlayer" | "optionChains" | "optionCruiseControl" | "optionDashcam" | "optionGps" | "optionHasTrailer" | "optionHitch" | "optionRoofBox" | "optionSkiRack" | "optionSnowTire" | "optionWheelchairAccessible" | "paperclip" | "parking" | "passport" | "payments" | "pencil" | "peopleUser" | "percentage" | "performance" | "phoneLink" | "phone" | "photos" | "pickupTruck" | "pig" | "pin" | "plug" | "plusCircleFilled" | "plus" | "position" | "pricingFlat" | "pricingVariable" | "profilePicture" | "questionCircleFilled" | "questionCircle" | "question" | "raceFlag" | "recenter" | "refresh" | "reorder" | "replacementCar" | "reply" | "reset" | "ride" | "road" | "roadsideAssistance" | "roofBox" | "rotate" | "sealCheck" | "searchCar" | "searchPeople" | "search" | "sedan" | "send" | "serviceBattery" | "serviceCleaning" | "serviceFuel" | "serviceHealing" | "serviceLocked" | "serviceTolls" | "serviceUnlocked" | "settings" | "shareAndroid" | "shareIos" | "share" | "shieldCheck" | "shield" | "shop" | "skiRack" | "slider" | "smartphone" | "smilingFace" | "snowTire" | "socialFacebook" | "socialLinkedin" | "socialTwitter" | "socialWhatsapp" | "starHalf" | "star" | "stars" | "subway" | "suitcase" | "support" | "suv" | "synch" | "tag" | "timeAlert" | "timeBackwards" | "timeCalendar" | "timeForward" | "tolls" | "trailer" | "train" | "transmission" | "triangleDown" | "triangleRight" | "triangleUp" | "twitter" | "twoPeople" | "uber" | "unfold" | "unlocked" | "userCheck" | "userQuestion" | "userShield" | "userSwitch" | "user" | "utilityVanLarge" | "utilityVanMedium" | "utilityVanSmall" | "verifiedSeal" | "video" | "walk" | "wallet" | "warningCircleFilled" | "warningCircle" | "warning" | "whatsapp" | "wheel" | "wheelchair" | "wrench" | "yingyang" | undefined;
+    icon?: "accountDetails" | "addPicture" | "airConditioning" | "airport" | "android" | "antique" | "arrowLeftCircleFilled" | "arrowLeft" | "arrowRightCircleFilled" | "arrowRightCircle" | "arrowRight" | "audioInput" | "babySeat" | "bank" | "battery" | "bell" | "bikeRack" | "bin" | "bluetooth" | "briefcase" | "bulb" | "cable" | "cabriolet" | "calendarCheck" | "calendarClock" | "calendarEnd" | "calendarStart" | "calendar" | "cameraAdd" | "camera" | "campervan" | "capacity" | "carAdd" | "carCheck" | "carDamages" | "carDrivyOpen" | "carGroup" | "carLock" | "carPlay" | "carReturn" | "carSearch" | "carTypeAntique" | "carTypeCabriolet" | "carTypeCampervan" | "carTypeCity" | "carTypeConvertible" | "carTypeCoupe" | "carTypeFamily" | "carTypeFourFour" | "carTypeMinibus" | "carTypeSedan" | "carTypeUtility" | "car" | "card" | "cdPlayer" | "certificate" | "chains" | "checkCircleFilled" | "checkCircle" | "check" | "checklist" | "chevronDown" | "chevronLeft" | "chevronRight" | "chevronUp" | "circledArrowLeft" | "circledArrowRight" | "city" | "cleaning" | "clockAlert" | "clockBackwards" | "clockForwards" | "clock" | "closeCircleFilled" | "close" | "collapse" | "connectCar" | "contactMail" | "contactPhone" | "contextualPaperclip" | "contextualQuestion" | "contextualWarningCircleFilled" | "contextualWarningCircle" | "contract" | "convertible" | "copy" | "coupe" | "creditCardAdd" | "creditCardError" | "creditCard" | "cruiseControl" | "dashcam" | "directions" | "document" | "dotHorizontal" | "dotVertical" | "dotsHorizontal" | "dotsVertical" | "download" | "earning" | "earth" | "edit" | "electric" | "evBattery" | "evCable" | "evCharger" | "expand" | "externalLink" | "eyeClosed" | "eyeOpened" | "eye" | "faceRecognition" | "facebook" | "family" | "fileFilled" | "filepdf" | "filexls" | "filter" | "filters" | "flag" | "fourByFour" | "fourWheelDrive" | "fuelTank" | "geolocation" | "gift" | "gps" | "graphUp" | "healing" | "heart" | "hitch" | "home" | "idCard" | "incident" | "infoCircleFilled" | "infoCircle" | "infoFilled" | "info" | "instant" | "invoice" | "keyConnect" | "key" | "licenceCheck" | "licencePaper" | "licence" | "lifeBuoy" | "linkedin" | "loading" | "locality" | "locationMap" | "locationParking" | "locationPin" | "location" | "lockCheck" | "locked" | "login" | "logout" | "mailCheck" | "mail" | "mapAlt" | "map" | "meetDriver" | "meetOwner" | "menuList" | "messages" | "mileage" | "minibus" | "minusCircleFilled" | "minus" | "miscGift" | "moon" | "nearbyDevice" | "notification" | "number1Circle" | "number2Circle" | "number3Circle" | "number4Circle" | "number5Circle" | "okHand" | "optionAirConditioning" | "optionAndroidAuto" | "optionAppleCarplay" | "optionAudioInput" | "optionBabySeat" | "optionBikeRack" | "optionBluetoothAudio" | "optionCdPlayer" | "optionChains" | "optionCruiseControl" | "optionDashcam" | "optionGps" | "optionHasTrailer" | "optionHitch" | "optionRoofBox" | "optionSkiRack" | "optionSnowTire" | "optionWheelchairAccessible" | "paperclip" | "parking" | "passport" | "payments" | "pencil" | "peopleUser" | "percentage" | "performance" | "phoneLink" | "phone" | "photos" | "pickupTruck" | "pig" | "pin" | "plug" | "plusCircleFilled" | "plus" | "position" | "pricingFlat" | "pricingVariable" | "profilePicture" | "questionCircleFilled" | "questionCircle" | "question" | "raceFlag" | "recenter" | "refresh" | "reorder" | "replacementCar" | "reply" | "reset" | "ride" | "road" | "roadsideAssistance" | "roofBox" | "rotate" | "sealCheck" | "searchCar" | "searchPeople" | "search" | "seatbelt" | "sedan" | "send" | "serviceBattery" | "serviceCleaning" | "serviceFuel" | "serviceHealing" | "serviceLocked" | "serviceTolls" | "serviceUnlocked" | "settings" | "shareAndroid" | "shareIos" | "share" | "shieldCheck" | "shield" | "shop" | "skiRack" | "slider" | "smartphone" | "smilingFace" | "snowTire" | "socialFacebook" | "socialLinkedin" | "socialTwitter" | "socialWhatsapp" | "starHalf" | "star" | "stars" | "subway" | "suitcase" | "support" | "suv" | "synch" | "tag" | "timeAlert" | "timeBackwards" | "timeCalendar" | "timeForward" | "tolls" | "trailer" | "train" | "transmission" | "triangleDown" | "triangleRight" | "triangleUp" | "twitter" | "twoPeople" | "uber" | "unfold" | "unlocked" | "userCheck" | "userQuestion" | "userShield" | "userSwitch" | "user" | "utilityVanLarge" | "utilityVanMedium" | "utilityVanSmall" | "verifiedSeal" | "video" | "walk" | "wallet" | "warningCircleFilled" | "warningCircle" | "warning" | "whatsapp" | "wheel" | "wheelchair" | "wrench" | "yingyang" | undefined;
     items: AutocompleteItemInput[];
     popoverClassName?: string | undefined;
     minQueryLength?: number | undefined;

package/types/src/components/Form/TagsInput.d.ts

@@ -18,7 +18,7 @@ export declare const TagsInputWrapper: ({ status, render, }: {
     render: (className: string) => React.ReactNode;
 }) => React.JSX.Element;
 declare const wrappedComponent: React.ComponentClass<{
-    icon?: "accountDetails" | "addPicture" | "airConditioning" | "airport" | "android" | "antique" | "arrowLeftCircleFilled" | "arrowLeft" | "arrowRightCircleFilled" | "arrowRightCircle" | "arrowRight" | "audioInput" | "babySeat" | "bank" | "battery" | "bell" | "bikeRack" | "bin" | "bluetooth" | "briefcase" | "bulb" | "cable" | "cabriolet" | "calendarCheck" | "calendarClock" | "calendarEnd" | "calendarStart" | "calendar" | "cameraAdd" | "camera" | "campervan" | "capacity" | "carAdd" | "carCheck" | "carDamages" | "carDrivyOpen" | "carGroup" | "carLock" | "carPlay" | "carReturn" | "carSearch" | "carTypeAntique" | "carTypeCabriolet" | "carTypeCampervan" | "carTypeCity" | "carTypeConvertible" | "carTypeCoupe" | "carTypeFamily" | "carTypeFourFour" | "carTypeMinibus" | "carTypeSedan" | "carTypeUtility" | "car" | "card" | "cdPlayer" | "certificate" | "chains" | "checkCircleFilled" | "checkCircle" | "check" | "checklist" | "chevronDown" | "chevronLeft" | "chevronRight" | "chevronUp" | "circledArrowLeft" | "circledArrowRight" | "city" | "cleaning" | "clockAlert" | "clockBackwards" | "clockForwards" | "clock" | "closeCircleFilled" | "close" | "collapse" | "connectCar" | "contactMail" | "contactPhone" | "contextualPaperclip" | "contextualQuestion" | "contextualWarningCircleFilled" | "contextualWarningCircle" | "contract" | "convertible" | "copy" | "coupe" | "creditCardAdd" | "creditCardError" | "creditCard" | "cruiseControl" | "dashcam" | "directions" | "document" | "dotHorizontal" | "dotVertical" | "dotsHorizontal" | "dotsVertical" | "download" | "earning" | "earth" | "edit" | "electric" | "evBattery" | "evCable" | "evCharger" | "expand" | "externalLink" | "eyeClosed" | "eyeOpened" | "eye" | "faceRecognition" | "facebook" | "family" | "fileFilled" | "filepdf" | "filexls" | "filter" | "filters" | "flag" | "fourByFour" | "fourWheelDrive" | "fuelTank" | "geolocation" | "gift" | "gps" | "graphUp" | "healing" | "heart" | "hitch" | "home" | "idCard" | "incident" | "infoCircleFilled" | "infoCircle" | "infoFilled" | "info" | "instant" | "invoice" | "keyConnect" | "key" | "licenceCheck" | "licencePaper" | "licence" | "lifeBuoy" | "linkedin" | "loading" | "locality" | "locationMap" | "locationParking" | "locationPin" | "location" | "lockCheck" | "locked" | "login" | "logout" | "mailCheck" | "mail" | "mapAlt" | "map" | "meetDriver" | "meetOwner" | "menuList" | "messages" | "mileage" | "minibus" | "minusCircleFilled" | "minus" | "miscGift" | "moon" | "nearbyDevice" | "notification" | "number1Circle" | "number2Circle" | "number3Circle" | "number4Circle" | "number5Circle" | "okHand" | "optionAirConditioning" | "optionAndroidAuto" | "optionAppleCarplay" | "optionAudioInput" | "optionBabySeat" | "optionBikeRack" | "optionBluetoothAudio" | "optionCdPlayer" | "optionChains" | "optionCruiseControl" | "optionDashcam" | "optionGps" | "optionHasTrailer" | "optionHitch" | "optionRoofBox" | "optionSkiRack" | "optionSnowTire" | "optionWheelchairAccessible" | "paperclip" | "parking" | "passport" | "payments" | "pencil" | "peopleUser" | "percentage" | "performance" | "phoneLink" | "phone" | "photos" | "pickupTruck" | "pig" | "pin" | "plug" | "plusCircleFilled" | "plus" | "position" | "pricingFlat" | "pricingVariable" | "profilePicture" | "questionCircleFilled" | "questionCircle" | "question" | "raceFlag" | "recenter" | "refresh" | "reorder" | "replacementCar" | "reply" | "reset" | "ride" | "road" | "roadsideAssistance" | "roofBox" | "rotate" | "sealCheck" | "searchCar" | "searchPeople" | "search" | "sedan" | "send" | "serviceBattery" | "serviceCleaning" | "serviceFuel" | "serviceHealing" | "serviceLocked" | "serviceTolls" | "serviceUnlocked" | "settings" | "shareAndroid" | "shareIos" | "share" | "shieldCheck" | "shield" | "shop" | "skiRack" | "slider" | "smartphone" | "smilingFace" | "snowTire" | "socialFacebook" | "socialLinkedin" | "socialTwitter" | "socialWhatsapp" | "starHalf" | "star" | "stars" | "subway" | "suitcase" | "support" | "suv" | "synch" | "tag" | "timeAlert" | "timeBackwards" | "timeCalendar" | "timeForward" | "tolls" | "trailer" | "train" | "transmission" | "triangleDown" | "triangleRight" | "triangleUp" | "twitter" | "twoPeople" | "uber" | "unfold" | "unlocked" | "userCheck" | "userQuestion" | "userShield" | "userSwitch" | "user" | "utilityVanLarge" | "utilityVanMedium" | "utilityVanSmall" | "verifiedSeal" | "video" | "walk" | "wallet" | "warningCircleFilled" | "warningCircle" | "warning" | "whatsapp" | "wheel" | "wheelchair" | "wrench" | "yingyang" | undefined;
+    icon?: "accountDetails" | "addPicture" | "airConditioning" | "airport" | "android" | "antique" | "arrowLeftCircleFilled" | "arrowLeft" | "arrowRightCircleFilled" | "arrowRightCircle" | "arrowRight" | "audioInput" | "babySeat" | "bank" | "battery" | "bell" | "bikeRack" | "bin" | "bluetooth" | "briefcase" | "bulb" | "cable" | "cabriolet" | "calendarCheck" | "calendarClock" | "calendarEnd" | "calendarStart" | "calendar" | "cameraAdd" | "camera" | "campervan" | "capacity" | "carAdd" | "carCheck" | "carDamages" | "carDrivyOpen" | "carGroup" | "carLock" | "carPlay" | "carReturn" | "carSearch" | "carTypeAntique" | "carTypeCabriolet" | "carTypeCampervan" | "carTypeCity" | "carTypeConvertible" | "carTypeCoupe" | "carTypeFamily" | "carTypeFourFour" | "carTypeMinibus" | "carTypeSedan" | "carTypeUtility" | "car" | "card" | "cdPlayer" | "certificate" | "chains" | "checkCircleFilled" | "checkCircle" | "check" | "checklist" | "chevronDown" | "chevronLeft" | "chevronRight" | "chevronUp" | "circledArrowLeft" | "circledArrowRight" | "city" | "cleaning" | "clockAlert" | "clockBackwards" | "clockForwards" | "clock" | "closeCircleFilled" | "close" | "collapse" | "connectCar" | "contactMail" | "contactPhone" | "contextualPaperclip" | "contextualQuestion" | "contextualWarningCircleFilled" | "contextualWarningCircle" | "contract" | "convertible" | "copy" | "coupe" | "creditCardAdd" | "creditCardError" | "creditCard" | "cruiseControl" | "dashcam" | "directions" | "document" | "dotHorizontal" | "dotVertical" | "dotsHorizontal" | "dotsVertical" | "download" | "earning" | "earth" | "edit" | "electric" | "evBattery" | "evCable" | "evCharger" | "expand" | "externalLink" | "eyeClosed" | "eyeOpened" | "eye" | "faceRecognition" | "facebook" | "family" | "fileFilled" | "filepdf" | "filexls" | "filter" | "filters" | "flag" | "fourByFour" | "fourWheelDrive" | "fuelTank" | "geolocation" | "gift" | "gps" | "graphUp" | "healing" | "heart" | "hitch" | "home" | "idCard" | "incident" | "infoCircleFilled" | "infoCircle" | "infoFilled" | "info" | "instant" | "invoice" | "keyConnect" | "key" | "licenceCheck" | "licencePaper" | "licence" | "lifeBuoy" | "linkedin" | "loading" | "locality" | "locationMap" | "locationParking" | "locationPin" | "location" | "lockCheck" | "locked" | "login" | "logout" | "mailCheck" | "mail" | "mapAlt" | "map" | "meetDriver" | "meetOwner" | "menuList" | "messages" | "mileage" | "minibus" | "minusCircleFilled" | "minus" | "miscGift" | "moon" | "nearbyDevice" | "notification" | "number1Circle" | "number2Circle" | "number3Circle" | "number4Circle" | "number5Circle" | "okHand" | "optionAirConditioning" | "optionAndroidAuto" | "optionAppleCarplay" | "optionAudioInput" | "optionBabySeat" | "optionBikeRack" | "optionBluetoothAudio" | "optionCdPlayer" | "optionChains" | "optionCruiseControl" | "optionDashcam" | "optionGps" | "optionHasTrailer" | "optionHitch" | "optionRoofBox" | "optionSkiRack" | "optionSnowTire" | "optionWheelchairAccessible" | "paperclip" | "parking" | "passport" | "payments" | "pencil" | "peopleUser" | "percentage" | "performance" | "phoneLink" | "phone" | "photos" | "pickupTruck" | "pig" | "pin" | "plug" | "plusCircleFilled" | "plus" | "position" | "pricingFlat" | "pricingVariable" | "profilePicture" | "questionCircleFilled" | "questionCircle" | "question" | "raceFlag" | "recenter" | "refresh" | "reorder" | "replacementCar" | "reply" | "reset" | "ride" | "road" | "roadsideAssistance" | "roofBox" | "rotate" | "sealCheck" | "searchCar" | "searchPeople" | "search" | "seatbelt" | "sedan" | "send" | "serviceBattery" | "serviceCleaning" | "serviceFuel" | "serviceHealing" | "serviceLocked" | "serviceTolls" | "serviceUnlocked" | "settings" | "shareAndroid" | "shareIos" | "share" | "shieldCheck" | "shield" | "shop" | "skiRack" | "slider" | "smartphone" | "smilingFace" | "snowTire" | "socialFacebook" | "socialLinkedin" | "socialTwitter" | "socialWhatsapp" | "starHalf" | "star" | "stars" | "subway" | "suitcase" | "support" | "suv" | "synch" | "tag" | "timeAlert" | "timeBackwards" | "timeCalendar" | "timeForward" | "tolls" | "trailer" | "train" | "transmission" | "triangleDown" | "triangleRight" | "triangleUp" | "twitter" | "twoPeople" | "uber" | "unfold" | "unlocked" | "userCheck" | "userQuestion" | "userShield" | "userSwitch" | "user" | "utilityVanLarge" | "utilityVanMedium" | "utilityVanSmall" | "verifiedSeal" | "video" | "walk" | "wallet" | "warningCircleFilled" | "warningCircle" | "warning" | "whatsapp" | "wheel" | "wheelchair" | "wrench" | "yingyang" | undefined;
     forwardedRef?: React.Ref<HTMLInputElement> | undefined;
     value?: string | undefined;
     onValueChange?: ((value: string) => void) | undefined;

package/types/src/components/Form/TextInput.d.ts

@@ -14,7 +14,7 @@ export declare const TextInputWrapper: ({ icon, status, render, }: {
 }) => React.JSX.Element;
 declare const wrappedComponent: React.ComponentClass<{
     type?: TextInputType | undefined;
-    icon?: "search" | "accountDetails" | "addPicture" | "airConditioning" | "airport" | "android" | "antique" | "arrowLeftCircleFilled" | "arrowLeft" | "arrowRightCircleFilled" | "arrowRightCircle" | "arrowRight" | "audioInput" | "babySeat" | "bank" | "battery" | "bell" | "bikeRack" | "bin" | "bluetooth" | "briefcase" | "bulb" | "cable" | "cabriolet" | "calendarCheck" | "calendarClock" | "calendarEnd" | "calendarStart" | "calendar" | "cameraAdd" | "camera" | "campervan" | "capacity" | "carAdd" | "carCheck" | "carDamages" | "carDrivyOpen" | "carGroup" | "carLock" | "carPlay" | "carReturn" | "carSearch" | "carTypeAntique" | "carTypeCabriolet" | "carTypeCampervan" | "carTypeCity" | "carTypeConvertible" | "carTypeCoupe" | "carTypeFamily" | "carTypeFourFour" | "carTypeMinibus" | "carTypeSedan" | "carTypeUtility" | "car" | "card" | "cdPlayer" | "certificate" | "chains" | "checkCircleFilled" | "checkCircle" | "check" | "checklist" | "chevronDown" | "chevronLeft" | "chevronRight" | "chevronUp" | "circledArrowLeft" | "circledArrowRight" | "city" | "cleaning" | "clockAlert" | "clockBackwards" | "clockForwards" | "clock" | "closeCircleFilled" | "close" | "collapse" | "connectCar" | "contactMail" | "contactPhone" | "contextualPaperclip" | "contextualQuestion" | "contextualWarningCircleFilled" | "contextualWarningCircle" | "contract" | "convertible" | "copy" | "coupe" | "creditCardAdd" | "creditCardError" | "creditCard" | "cruiseControl" | "dashcam" | "directions" | "document" | "dotHorizontal" | "dotVertical" | "dotsHorizontal" | "dotsVertical" | "download" | "earning" | "earth" | "edit" | "electric" | "evBattery" | "evCable" | "evCharger" | "expand" | "externalLink" | "eyeClosed" | "eyeOpened" | "eye" | "faceRecognition" | "facebook" | "family" | "fileFilled" | "filepdf" | "filexls" | "filter" | "filters" | "flag" | "fourByFour" | "fourWheelDrive" | "fuelTank" | "geolocation" | "gift" | "gps" | "graphUp" | "healing" | "heart" | "hitch" | "home" | "idCard" | "incident" | "infoCircleFilled" | "infoCircle" | "infoFilled" | "info" | "instant" | "invoice" | "keyConnect" | "key" | "licenceCheck" | "licencePaper" | "licence" | "lifeBuoy" | "linkedin" | "loading" | "locality" | "locationMap" | "locationParking" | "locationPin" | "location" | "lockCheck" | "locked" | "login" | "logout" | "mailCheck" | "mail" | "mapAlt" | "map" | "meetDriver" | "meetOwner" | "menuList" | "messages" | "mileage" | "minibus" | "minusCircleFilled" | "minus" | "miscGift" | "moon" | "nearbyDevice" | "notification" | "number1Circle" | "number2Circle" | "number3Circle" | "number4Circle" | "number5Circle" | "okHand" | "optionAirConditioning" | "optionAndroidAuto" | "optionAppleCarplay" | "optionAudioInput" | "optionBabySeat" | "optionBikeRack" | "optionBluetoothAudio" | "optionCdPlayer" | "optionChains" | "optionCruiseControl" | "optionDashcam" | "optionGps" | "optionHasTrailer" | "optionHitch" | "optionRoofBox" | "optionSkiRack" | "optionSnowTire" | "optionWheelchairAccessible" | "paperclip" | "parking" | "passport" | "payments" | "pencil" | "peopleUser" | "percentage" | "performance" | "phoneLink" | "phone" | "photos" | "pickupTruck" | "pig" | "pin" | "plug" | "plusCircleFilled" | "plus" | "position" | "pricingFlat" | "pricingVariable" | "profilePicture" | "questionCircleFilled" | "questionCircle" | "question" | "raceFlag" | "recenter" | "refresh" | "reorder" | "replacementCar" | "reply" | "reset" | "ride" | "road" | "roadsideAssistance" | "roofBox" | "rotate" | "sealCheck" | "searchCar" | "searchPeople" | "sedan" | "send" | "serviceBattery" | "serviceCleaning" | "serviceFuel" | "serviceHealing" | "serviceLocked" | "serviceTolls" | "serviceUnlocked" | "settings" | "shareAndroid" | "shareIos" | "share" | "shieldCheck" | "shield" | "shop" | "skiRack" | "slider" | "smartphone" | "smilingFace" | "snowTire" | "socialFacebook" | "socialLinkedin" | "socialTwitter" | "socialWhatsapp" | "starHalf" | "star" | "stars" | "subway" | "suitcase" | "support" | "suv" | "synch" | "tag" | "timeAlert" | "timeBackwards" | "timeCalendar" | "timeForward" | "tolls" | "trailer" | "train" | "transmission" | "triangleDown" | "triangleRight" | "triangleUp" | "twitter" | "twoPeople" | "uber" | "unfold" | "unlocked" | "userCheck" | "userQuestion" | "userShield" | "userSwitch" | "user" | "utilityVanLarge" | "utilityVanMedium" | "utilityVanSmall" | "verifiedSeal" | "video" | "walk" | "wallet" | "warningCircleFilled" | "warningCircle" | "warning" | "whatsapp" | "wheel" | "wheelchair" | "wrench" | "yingyang" | undefined;
+    icon?: "search" | "accountDetails" | "addPicture" | "airConditioning" | "airport" | "android" | "antique" | "arrowLeftCircleFilled" | "arrowLeft" | "arrowRightCircleFilled" | "arrowRightCircle" | "arrowRight" | "audioInput" | "babySeat" | "bank" | "battery" | "bell" | "bikeRack" | "bin" | "bluetooth" | "briefcase" | "bulb" | "cable" | "cabriolet" | "calendarCheck" | "calendarClock" | "calendarEnd" | "calendarStart" | "calendar" | "cameraAdd" | "camera" | "campervan" | "capacity" | "carAdd" | "carCheck" | "carDamages" | "carDrivyOpen" | "carGroup" | "carLock" | "carPlay" | "carReturn" | "carSearch" | "carTypeAntique" | "carTypeCabriolet" | "carTypeCampervan" | "carTypeCity" | "carTypeConvertible" | "carTypeCoupe" | "carTypeFamily" | "carTypeFourFour" | "carTypeMinibus" | "carTypeSedan" | "carTypeUtility" | "car" | "card" | "cdPlayer" | "certificate" | "chains" | "checkCircleFilled" | "checkCircle" | "check" | "checklist" | "chevronDown" | "chevronLeft" | "chevronRight" | "chevronUp" | "circledArrowLeft" | "circledArrowRight" | "city" | "cleaning" | "clockAlert" | "clockBackwards" | "clockForwards" | "clock" | "closeCircleFilled" | "close" | "collapse" | "connectCar" | "contactMail" | "contactPhone" | "contextualPaperclip" | "contextualQuestion" | "contextualWarningCircleFilled" | "contextualWarningCircle" | "contract" | "convertible" | "copy" | "coupe" | "creditCardAdd" | "creditCardError" | "creditCard" | "cruiseControl" | "dashcam" | "directions" | "document" | "dotHorizontal" | "dotVertical" | "dotsHorizontal" | "dotsVertical" | "download" | "earning" | "earth" | "edit" | "electric" | "evBattery" | "evCable" | "evCharger" | "expand" | "externalLink" | "eyeClosed" | "eyeOpened" | "eye" | "faceRecognition" | "facebook" | "family" | "fileFilled" | "filepdf" | "filexls" | "filter" | "filters" | "flag" | "fourByFour" | "fourWheelDrive" | "fuelTank" | "geolocation" | "gift" | "gps" | "graphUp" | "healing" | "heart" | "hitch" | "home" | "idCard" | "incident" | "infoCircleFilled" | "infoCircle" | "infoFilled" | "info" | "instant" | "invoice" | "keyConnect" | "key" | "licenceCheck" | "licencePaper" | "licence" | "lifeBuoy" | "linkedin" | "loading" | "locality" | "locationMap" | "locationParking" | "locationPin" | "location" | "lockCheck" | "locked" | "login" | "logout" | "mailCheck" | "mail" | "mapAlt" | "map" | "meetDriver" | "meetOwner" | "menuList" | "messages" | "mileage" | "minibus" | "minusCircleFilled" | "minus" | "miscGift" | "moon" | "nearbyDevice" | "notification" | "number1Circle" | "number2Circle" | "number3Circle" | "number4Circle" | "number5Circle" | "okHand" | "optionAirConditioning" | "optionAndroidAuto" | "optionAppleCarplay" | "optionAudioInput" | "optionBabySeat" | "optionBikeRack" | "optionBluetoothAudio" | "optionCdPlayer" | "optionChains" | "optionCruiseControl" | "optionDashcam" | "optionGps" | "optionHasTrailer" | "optionHitch" | "optionRoofBox" | "optionSkiRack" | "optionSnowTire" | "optionWheelchairAccessible" | "paperclip" | "parking" | "passport" | "payments" | "pencil" | "peopleUser" | "percentage" | "performance" | "phoneLink" | "phone" | "photos" | "pickupTruck" | "pig" | "pin" | "plug" | "plusCircleFilled" | "plus" | "position" | "pricingFlat" | "pricingVariable" | "profilePicture" | "questionCircleFilled" | "questionCircle" | "question" | "raceFlag" | "recenter" | "refresh" | "reorder" | "replacementCar" | "reply" | "reset" | "ride" | "road" | "roadsideAssistance" | "roofBox" | "rotate" | "sealCheck" | "searchCar" | "searchPeople" | "seatbelt" | "sedan" | "send" | "serviceBattery" | "serviceCleaning" | "serviceFuel" | "serviceHealing" | "serviceLocked" | "serviceTolls" | "serviceUnlocked" | "settings" | "shareAndroid" | "shareIos" | "share" | "shieldCheck" | "shield" | "shop" | "skiRack" | "slider" | "smartphone" | "smilingFace" | "snowTire" | "socialFacebook" | "socialLinkedin" | "socialTwitter" | "socialWhatsapp" | "starHalf" | "star" | "stars" | "subway" | "suitcase" | "support" | "suv" | "synch" | "tag" | "timeAlert" | "timeBackwards" | "timeCalendar" | "timeForward" | "tolls" | "trailer" | "train" | "transmission" | "triangleDown" | "triangleRight" | "triangleUp" | "twitter" | "twoPeople" | "uber" | "unfold" | "unlocked" | "userCheck" | "userQuestion" | "userShield" | "userSwitch" | "user" | "utilityVanLarge" | "utilityVanMedium" | "utilityVanSmall" | "verifiedSeal" | "video" | "walk" | "wallet" | "warningCircleFilled" | "warningCircle" | "warning" | "whatsapp" | "wheel" | "wheelchair" | "wrench" | "yingyang" | undefined;
     forwardedRef?: React.Ref<HTMLInputElement> | undefined;
 } & FormElement & React.InputHTMLAttributes<HTMLInputElement> & {
     id?: string | undefined;

package/types/src/components/Icon/__generated__/SeatbeltIcon.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import { IconColorsType } from "../";
+export type IconProps = {
+    color?: IconColorsType;
+    size?: 16 | 20 | 24 | 32;
+    contained?: boolean;
+    className?: string;
+};
+declare const SeatbeltIcon: ({ color, size, contained, className, }: IconProps) => React.JSX.Element;
+export default SeatbeltIcon;

package/types/src/components/Icon/__generated__/index.d.ts

@@ -234,6 +234,7 @@ export { default as SealCheckIcon } from "./SealCheckIcon";
 export { default as SearchCarIcon } from "./SearchCarIcon";
 export { default as SearchIcon } from "./SearchIcon";
 export { default as SearchPeopleIcon } from "./SearchPeopleIcon";
+export { default as SeatbeltIcon } from "./SeatbeltIcon";
 export { default as SedanIcon } from "./SedanIcon";
 export { default as SendIcon } from "./SendIcon";
 export { default as ServiceBatteryIcon } from "./ServiceBatteryIcon";

package/types/src/components/Icon/index.d.ts

@@ -22,7 +22,7 @@ export interface IconProps {
     contained?: boolean;
     className?: string;
 }
-export declare const isIconSource: (source: string) => source is "warning" | "accountDetails" | "addPicture" | "airConditioning" | "airport" | "android" | "antique" | "arrowLeftCircleFilled" | "arrowLeft" | "arrowRightCircleFilled" | "arrowRightCircle" | "arrowRight" | "audioInput" | "babySeat" | "bank" | "battery" | "bell" | "bikeRack" | "bin" | "bluetooth" | "briefcase" | "bulb" | "cable" | "cabriolet" | "calendarCheck" | "calendarClock" | "calendarEnd" | "calendarStart" | "calendar" | "cameraAdd" | "camera" | "campervan" | "capacity" | "carAdd" | "carCheck" | "carDamages" | "carDrivyOpen" | "carGroup" | "carLock" | "carPlay" | "carReturn" | "carSearch" | "carTypeAntique" | "carTypeCabriolet" | "carTypeCampervan" | "carTypeCity" | "carTypeConvertible" | "carTypeCoupe" | "carTypeFamily" | "carTypeFourFour" | "carTypeMinibus" | "carTypeSedan" | "carTypeUtility" | "car" | "card" | "cdPlayer" | "certificate" | "chains" | "checkCircleFilled" | "checkCircle" | "check" | "checklist" | "chevronDown" | "chevronLeft" | "chevronRight" | "chevronUp" | "circledArrowLeft" | "circledArrowRight" | "city" | "cleaning" | "clockAlert" | "clockBackwards" | "clockForwards" | "clock" | "closeCircleFilled" | "close" | "collapse" | "connectCar" | "contactMail" | "contactPhone" | "contextualPaperclip" | "contextualQuestion" | "contextualWarningCircleFilled" | "contextualWarningCircle" | "contract" | "convertible" | "copy" | "coupe" | "creditCardAdd" | "creditCardError" | "creditCard" | "cruiseControl" | "dashcam" | "directions" | "document" | "dotHorizontal" | "dotVertical" | "dotsHorizontal" | "dotsVertical" | "download" | "earning" | "earth" | "edit" | "electric" | "evBattery" | "evCable" | "evCharger" | "expand" | "externalLink" | "eyeClosed" | "eyeOpened" | "eye" | "faceRecognition" | "facebook" | "family" | "fileFilled" | "filepdf" | "filexls" | "filter" | "filters" | "flag" | "fourByFour" | "fourWheelDrive" | "fuelTank" | "geolocation" | "gift" | "gps" | "graphUp" | "healing" | "heart" | "hitch" | "home" | "idCard" | "incident" | "infoCircleFilled" | "infoCircle" | "infoFilled" | "info" | "instant" | "invoice" | "keyConnect" | "key" | "licenceCheck" | "licencePaper" | "licence" | "lifeBuoy" | "linkedin" | "loading" | "locality" | "locationMap" | "locationParking" | "locationPin" | "location" | "lockCheck" | "locked" | "login" | "logout" | "mailCheck" | "mail" | "mapAlt" | "map" | "meetDriver" | "meetOwner" | "menuList" | "messages" | "mileage" | "minibus" | "minusCircleFilled" | "minus" | "miscGift" | "moon" | "nearbyDevice" | "notification" | "number1Circle" | "number2Circle" | "number3Circle" | "number4Circle" | "number5Circle" | "okHand" | "optionAirConditioning" | "optionAndroidAuto" | "optionAppleCarplay" | "optionAudioInput" | "optionBabySeat" | "optionBikeRack" | "optionBluetoothAudio" | "optionCdPlayer" | "optionChains" | "optionCruiseControl" | "optionDashcam" | "optionGps" | "optionHasTrailer" | "optionHitch" | "optionRoofBox" | "optionSkiRack" | "optionSnowTire" | "optionWheelchairAccessible" | "paperclip" | "parking" | "passport" | "payments" | "pencil" | "peopleUser" | "percentage" | "performance" | "phoneLink" | "phone" | "photos" | "pickupTruck" | "pig" | "pin" | "plug" | "plusCircleFilled" | "plus" | "position" | "pricingFlat" | "pricingVariable" | "profilePicture" | "questionCircleFilled" | "questionCircle" | "question" | "raceFlag" | "recenter" | "refresh" | "reorder" | "replacementCar" | "reply" | "reset" | "ride" | "road" | "roadsideAssistance" | "roofBox" | "rotate" | "sealCheck" | "searchCar" | "searchPeople" | "search" | "sedan" | "send" | "serviceBattery" | "serviceCleaning" | "serviceFuel" | "serviceHealing" | "serviceLocked" | "serviceTolls" | "serviceUnlocked" | "settings" | "shareAndroid" | "shareIos" | "share" | "shieldCheck" | "shield" | "shop" | "skiRack" | "slider" | "smartphone" | "smilingFace" | "snowTire" | "socialFacebook" | "socialLinkedin" | "socialTwitter" | "socialWhatsapp" | "starHalf" | "star" | "stars" | "subway" | "suitcase" | "support" | "suv" | "synch" | "tag" | "timeAlert" | "timeBackwards" | "timeCalendar" | "timeForward" | "tolls" | "trailer" | "train" | "transmission" | "triangleDown" | "triangleRight" | "triangleUp" | "twitter" | "twoPeople" | "uber" | "unfold" | "unlocked" | "userCheck" | "userQuestion" | "userShield" | "userSwitch" | "user" | "utilityVanLarge" | "utilityVanMedium" | "utilityVanSmall" | "verifiedSeal" | "video" | "walk" | "wallet" | "warningCircleFilled" | "warningCircle" | "whatsapp" | "wheel" | "wheelchair" | "wrench" | "yingyang";
+export declare const isIconSource: (source: string) => source is "warning" | "accountDetails" | "addPicture" | "airConditioning" | "airport" | "android" | "antique" | "arrowLeftCircleFilled" | "arrowLeft" | "arrowRightCircleFilled" | "arrowRightCircle" | "arrowRight" | "audioInput" | "babySeat" | "bank" | "battery" | "bell" | "bikeRack" | "bin" | "bluetooth" | "briefcase" | "bulb" | "cable" | "cabriolet" | "calendarCheck" | "calendarClock" | "calendarEnd" | "calendarStart" | "calendar" | "cameraAdd" | "camera" | "campervan" | "capacity" | "carAdd" | "carCheck" | "carDamages" | "carDrivyOpen" | "carGroup" | "carLock" | "carPlay" | "carReturn" | "carSearch" | "carTypeAntique" | "carTypeCabriolet" | "carTypeCampervan" | "carTypeCity" | "carTypeConvertible" | "carTypeCoupe" | "carTypeFamily" | "carTypeFourFour" | "carTypeMinibus" | "carTypeSedan" | "carTypeUtility" | "car" | "card" | "cdPlayer" | "certificate" | "chains" | "checkCircleFilled" | "checkCircle" | "check" | "checklist" | "chevronDown" | "chevronLeft" | "chevronRight" | "chevronUp" | "circledArrowLeft" | "circledArrowRight" | "city" | "cleaning" | "clockAlert" | "clockBackwards" | "clockForwards" | "clock" | "closeCircleFilled" | "close" | "collapse" | "connectCar" | "contactMail" | "contactPhone" | "contextualPaperclip" | "contextualQuestion" | "contextualWarningCircleFilled" | "contextualWarningCircle" | "contract" | "convertible" | "copy" | "coupe" | "creditCardAdd" | "creditCardError" | "creditCard" | "cruiseControl" | "dashcam" | "directions" | "document" | "dotHorizontal" | "dotVertical" | "dotsHorizontal" | "dotsVertical" | "download" | "earning" | "earth" | "edit" | "electric" | "evBattery" | "evCable" | "evCharger" | "expand" | "externalLink" | "eyeClosed" | "eyeOpened" | "eye" | "faceRecognition" | "facebook" | "family" | "fileFilled" | "filepdf" | "filexls" | "filter" | "filters" | "flag" | "fourByFour" | "fourWheelDrive" | "fuelTank" | "geolocation" | "gift" | "gps" | "graphUp" | "healing" | "heart" | "hitch" | "home" | "idCard" | "incident" | "infoCircleFilled" | "infoCircle" | "infoFilled" | "info" | "instant" | "invoice" | "keyConnect" | "key" | "licenceCheck" | "licencePaper" | "licence" | "lifeBuoy" | "linkedin" | "loading" | "locality" | "locationMap" | "locationParking" | "locationPin" | "location" | "lockCheck" | "locked" | "login" | "logout" | "mailCheck" | "mail" | "mapAlt" | "map" | "meetDriver" | "meetOwner" | "menuList" | "messages" | "mileage" | "minibus" | "minusCircleFilled" | "minus" | "miscGift" | "moon" | "nearbyDevice" | "notification" | "number1Circle" | "number2Circle" | "number3Circle" | "number4Circle" | "number5Circle" | "okHand" | "optionAirConditioning" | "optionAndroidAuto" | "optionAppleCarplay" | "optionAudioInput" | "optionBabySeat" | "optionBikeRack" | "optionBluetoothAudio" | "optionCdPlayer" | "optionChains" | "optionCruiseControl" | "optionDashcam" | "optionGps" | "optionHasTrailer" | "optionHitch" | "optionRoofBox" | "optionSkiRack" | "optionSnowTire" | "optionWheelchairAccessible" | "paperclip" | "parking" | "passport" | "payments" | "pencil" | "peopleUser" | "percentage" | "performance" | "phoneLink" | "phone" | "photos" | "pickupTruck" | "pig" | "pin" | "plug" | "plusCircleFilled" | "plus" | "position" | "pricingFlat" | "pricingVariable" | "profilePicture" | "questionCircleFilled" | "questionCircle" | "question" | "raceFlag" | "recenter" | "refresh" | "reorder" | "replacementCar" | "reply" | "reset" | "ride" | "road" | "roadsideAssistance" | "roofBox" | "rotate" | "sealCheck" | "searchCar" | "searchPeople" | "search" | "seatbelt" | "sedan" | "send" | "serviceBattery" | "serviceCleaning" | "serviceFuel" | "serviceHealing" | "serviceLocked" | "serviceTolls" | "serviceUnlocked" | "settings" | "shareAndroid" | "shareIos" | "share" | "shieldCheck" | "shield" | "shop" | "skiRack" | "slider" | "smartphone" | "smilingFace" | "snowTire" | "socialFacebook" | "socialLinkedin" | "socialTwitter" | "socialWhatsapp" | "starHalf" | "star" | "stars" | "subway" | "suitcase" | "support" | "suv" | "synch" | "tag" | "timeAlert" | "timeBackwards" | "timeCalendar" | "timeForward" | "tolls" | "trailer" | "train" | "transmission" | "triangleDown" | "triangleRight" | "triangleUp" | "twitter" | "twoPeople" | "uber" | "unfold" | "unlocked" | "userCheck" | "userQuestion" | "userShield" | "userSwitch" | "user" | "utilityVanLarge" | "utilityVanMedium" | "utilityVanSmall" | "verifiedSeal" | "video" | "walk" | "wallet" | "warningCircleFilled" | "warningCircle" | "whatsapp" | "wheel" | "wheelchair" | "wrench" | "yingyang";
 export declare const Icon: ({ source, color, size, contained, className, }: IconProps) => React.JSX.Element;
 export * from "./__generated__/index";
 export default Icon;

package/types/src/icons/index.d.ts

@@ -234,6 +234,7 @@ export { default as sealCheck } from "./seal-check.svg";
 export { default as searchCar } from "./search-car.svg";
 export { default as searchPeople } from "./search-people.svg";
 export { default as search } from "./search.svg";
+export { default as seatbelt } from "./seatbelt.svg";
 export { default as sedan } from "./sedan.svg";
 export { default as send } from "./send.svg";
 export { default as serviceBattery } from "./service-battery.svg";

package/types/src/tokens/index.d.ts

@@ -256,6 +256,7 @@ export declare const icons: {
         searchCar: string;
         searchPeople: string;
         search: string;
+        seatbelt: string;
         sedan: string;
         send: string;
         serviceBattery: string;