@hashicorp/mds-react 0.9.5 → 0.9.7

package/components/accordion/index.d.ts

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import type { HTMLAttributes } from 'react';
 interface AccordionProps extends HTMLAttributes<HTMLDivElement> {
     /**
      * optional class name to add to the accordion

package/components/accordion/item/index.d.ts

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import type { HTMLAttributes } from 'react';
 interface AccordionItemProps extends HTMLAttributes<HTMLDivElement> {
     ariaLabel?: string;
     isOpen?: boolean;

package/components/card/index.d.ts

@@ -1,4 +1,4 @@
-import { CardContentProps, CardProps } from './types';
-declare const Card: import('react').ForwardRefExoticComponent<CardProps & import('react').RefAttributes<HTMLDivElement>>;
+import type { CardContentProps, CardProps } from './types';
+declare const Card: import("react").ForwardRefExoticComponent<CardProps & import("react").RefAttributes<HTMLDivElement>>;
 export declare const CardContent: ({ badges, description, eyebrow, heading, thumbnail, subheading, cta, children, showArrow, }: CardContentProps) => import("react/jsx-runtime").JSX.Element;
 export { Card };

package/components/code-block/code-block.module.scss

@@ -381,9 +381,9 @@
 
 // CopyButton
 .copy-button {
-	--copy-button-token-idle: var(--code-block-color-foreground-primary);
-	--copy-button-token-success: var(--code-block-color-foreground-success);
-	--copy-button-token-error: var(--code-block-color-foreground-success);
+	--copy-button-token-idle: var(--code-block-color-foreground-primary) !important;
+	--copy-button-token-success: var(--code-block-color-foreground-success) !important;
+	--copy-button-token-error: var(--code-block-color-foreground-critical) !important;
 
 	position: absolute !important;
 	top: 11px; // 12px -1px accounting for border

package/components/code-block/index.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import { type ReactNode } from 'react';
 /**
  * ALERT: This component is a combination of logic from the official HashiCorp
  * Design System CodeBlock component and the CodeBlock component written by the

package/components/form/indicator/index.js

@@ -1,11 +1,10 @@
 import { jsx as o } from "react/jsx-runtime";
 import { Badge as a } from "../../badge/index.js";
 import { localize as i } from "../../../utils/i18n/index.js";
-import "../../../utils/i18n/helpers/locale-provider.js";
-import { useLocale as n } from "../../../utils/i18n/helpers/use-locale.js";
-import m from "./form-indicator.module.css.js";
+import n from "./form-indicator.module.css.js";
+import { useLocale as m } from "../../../utils/i18n/helpers/use-locale.js";
 const s = ({ isOptional: r, isRequired: l }) => {
-  const e = n(), t = r ? m.optional : null;
+  const e = m(), t = r ? n.optional : null;
   return r ? /* @__PURE__ */ o("span", { "aria-hidden": "true", className: t, children: `(${i("optional", e, "title")})` }) : l ? /* @__PURE__ */ o(
     a,
     {

package/components/form/indicator/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/form/indicator/index.tsx"],"sourcesContent":["import { Badge } from '../../badge'\nimport { localize } from '../../../utils/i18n'\nimport { useLocale } from '@web/utils/i18n/helpers'\nimport s from './form-indicator.module.css'\n\ninterface IndicatorProps {\n\tisOptional?: boolean\n\tisRequired?: boolean\n}\n\nconst Indicator = ({ isOptional, isRequired }: IndicatorProps) => {\n\tconst locale = useLocale()\n\n\tconst className = isOptional ? s.optional : null\n\n\tif (isOptional) {\n\t\treturn (\n\t\t\t<span aria-hidden=\"true\" className={className}>\n\t\t\t\t{`(${localize('optional', locale, 'title')})`}\n\t\t\t</span>\n\t\t)\n\t} else if (isRequired) {\n\t\treturn (\n\t\t\t<Badge\n\t\t\t\taria-hidden=\"true\"\n\t\t\t\tclassName={className}\n\t\t\t\tsize=\"small\"\n\t\t\t\ttext={localize('required', locale, 'title')}\n\t\t\t/>\n\t\t)\n\t}\n\n\treturn null\n}\n\nIndicator.displayName = 'Indicator'\n\nexport { Indicator }\n"],"names":["Indicator","isOptional","isRequired","locale","useLocale","className","s","jsx","localize","Badge"],"mappings":";;;;;;AAUA,MAAMA,IAAY,CAAC,EAAE,YAAAC,GAAY,YAAAC,QAAiC;AACjE,QAAMC,IAASC,EAAA,GAETC,IAAYJ,IAAaK,EAAE,WAAW;AAE5C,SAAIL,IAEF,gBAAAM,EAAC,QAAA,EAAK,eAAY,QAAO,WAAAF,GACvB,UAAA,IAAIG,EAAS,YAAYL,GAAQ,OAAO,CAAC,KAC3C,IAESD,IAET,gBAAAK;AAAA,IAACE;AAAA,IAAA;AAAA,MACA,eAAY;AAAA,MACZ,WAAAJ;AAAA,MACA,MAAK;AAAA,MACL,MAAMG,EAAS,YAAYL,GAAQ,OAAO;AAAA,IAAA;AAAA,EAAA,IAKtC;AACR;AAEAH,EAAU,cAAc;"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/form/indicator/index.tsx"],"sourcesContent":["import { Badge } from '../../badge'\nimport { localize } from '../../../utils/i18n'\nimport { useLocale } from '../../../utils/i18n/helpers'\nimport s from './form-indicator.module.css'\n\ninterface IndicatorProps {\n\tisOptional?: boolean\n\tisRequired?: boolean\n}\n\nconst Indicator = ({ isOptional, isRequired }: IndicatorProps) => {\n\tconst locale = useLocale()\n\n\tconst className = isOptional ? s.optional : null\n\n\tif (isOptional) {\n\t\treturn (\n\t\t\t<span aria-hidden=\"true\" className={className}>\n\t\t\t\t{`(${localize('optional', locale, 'title')})`}\n\t\t\t</span>\n\t\t)\n\t} else if (isRequired) {\n\t\treturn (\n\t\t\t<Badge\n\t\t\t\taria-hidden=\"true\"\n\t\t\t\tclassName={className}\n\t\t\t\tsize=\"small\"\n\t\t\t\ttext={localize('required', locale, 'title')}\n\t\t\t/>\n\t\t)\n\t}\n\n\treturn null\n}\n\nIndicator.displayName = 'Indicator'\n\nexport { Indicator }\n"],"names":["Indicator","isOptional","isRequired","locale","useLocale","className","s","jsx","localize","Badge"],"mappings":";;;;;AAUA,MAAMA,IAAY,CAAC,EAAE,YAAAC,GAAY,YAAAC,QAAiC;AACjE,QAAMC,IAASC,EAAA,GAETC,IAAYJ,IAAaK,EAAE,WAAW;AAE5C,SAAIL,IAEF,gBAAAM,EAAC,QAAA,EAAK,eAAY,QAAO,WAAAF,GACvB,UAAA,IAAIG,EAAS,YAAYL,GAAQ,OAAO,CAAC,KAC3C,IAESD,IAET,gBAAAK;AAAA,IAACE;AAAA,IAAA;AAAA,MACA,eAAY;AAAA,MACZ,WAAAJ;AAAA,MACA,MAAK;AAAA,MACL,MAAMG,EAAS,YAAYL,GAAQ,OAAO;AAAA,IAAA;AAAA,EAAA,IAKtC;AACR;AAEAH,EAAU,cAAc;"}

package/components/form/radio-card/index.d.ts

@@ -1,6 +1,6 @@
 import { RadioCardGroup } from './group';
-import { HTMLProps, ReactNode } from 'react';
-import { BadgeProps } from '../../badge';
+import type { HTMLProps, ReactNode } from 'react';
+import type { BadgeProps } from '../../badge';
 export declare const DEFAULT_CONTROL_POSITION = "bottom";
 export declare const DEFAULT_ALIGNMENT = "left";
 export declare const CONTROL_POSITIONS: readonly ["bottom", "left"];

package/components/form/select/index.d.ts

@@ -13,6 +13,7 @@ interface SelectFieldProps {
     className?: string;
     size?: 'medium' | 'large';
     disabled?: boolean;
+    multiple?: boolean;
 }
 declare const SelectField: {
     ({ isInvalid, isLoading, isRequired, isOptional, id, label, helperText, error, field, children, className, size, ...rest }: SelectFieldProps): import("react/jsx-runtime").JSX.Element;

package/components/form/select/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/form/select/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport type { HTMLProps, ReactNode } from 'react'\nimport { useId } from 'react'\nimport { Field } from '../field'\nimport s from './form-select.module.css'\n\ninterface SelectBaseProps {\n\tisInvalid?: boolean\n\tisLoading?: boolean\n\trequired?: boolean\n\tclassName?: string\n\tid: string\n\tfield: HTMLProps<HTMLSelectElement>\n\tchildren: ReactNode\n\tsize: 'medium' | 'large'\n\terror?: ReactNode\n\tdisabled?: boolean\n}\n\nconst SelectBase = ({\n\tisInvalid,\n\tisLoading,\n\tclassName,\n\tid,\n\tfield,\n\tchildren,\n\tsize,\n\terror,\n\t...rest\n}: SelectBaseProps) => {\n\treturn (\n\t\t<select\n\t\t\tid={id}\n\t\t\tclassName={classNames(\n\t\t\t\ts.select,\n\t\t\t\ts[size],\n\t\t\t\t{\n\t\t\t\t\t[s.invalid]: isInvalid,\n\t\t\t\t},\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\taria-describedby={`${error ? 'error' : 'helper-text'}-${id}`}\n\t\t\t{...field}\n\t\t\t{...rest}\n\t\t>\n\t\t\t{children}\n\t\t</select>\n\t)\n}\n\ninterface SelectFieldProps {\n\tisInvalid?: boolean\n\tisLoading?: boolean\n\tisRequired?: boolean\n\tisOptional?: boolean\n\tid?: string\n\tlabel?: ReactNode\n\thelperText?: ReactNode\n\terror?: ReactNode\n\tfield: HTMLProps<HTMLSelectElement>\n\tchildren: ReactNode\n\tclassName?: string\n\tsize?: 'medium' | 'large'\n\tdisabled?: boolean\n}\n\nconst SelectField = ({\n\tisInvalid,\n\tisLoading,\n\tisRequired,\n\tisOptional,\n\tid,\n\tlabel,\n\thelperText,\n\terror,\n\tfield,\n\tchildren,\n\tclassName,\n\tsize = 'medium',\n\t...rest\n}: SelectFieldProps) => {\n\tconst generatedId = useId()\n\tconst inputId = id ?? generatedId\n\n\treturn (\n\t\t<Field\n\t\t\tlabel={label}\n\t\t\thelperText={helperText}\n\t\t\terror={error}\n\t\t\tisRequired={isRequired}\n\t\t\tisOptional={isOptional}\n\t\t\tid={inputId}\n\t\t\tlayout=\"vertical\"\n\t\t\tclassName={className}\n\t\t>\n\t\t\t<SelectBase\n\t\t\t\tid={inputId}\n\t\t\t\tisInvalid={isInvalid}\n\t\t\t\trequired={isRequired}\n\t\t\t\tfield={field}\n\t\t\t\tsize={size}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</SelectBase>\n\t\t</Field>\n\t)\n}\n\nSelectField.displayName = 'SelectField'\n\nexport { SelectField }\n"],"names":["SelectBase","isInvalid","isLoading","className","id","field","children","size","error","rest","jsx","classNames","s","SelectField","isRequired","isOptional","label","helperText","generatedId","useId","inputId","Field"],"mappings":";;;;;AAmBA,MAAMA,IAAa,CAAC;AAAA,EACnB,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,GAAGC;AACJ,MAEE,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACA,IAAAN;AAAA,IACA,WAAWO;AAAA,MACVC,EAAE;AAAA,MACFA,EAAEL,CAAI;AAAA,MACN;AAAA,QACC,CAACK,EAAE,OAAO,GAAGX;AAAA,MAAA;AAAA,MAEdE;AAAA,IAAA;AAAA,IAED,oBAAkB,GAAGK,IAAQ,UAAU,aAAa,IAAIJ,CAAE;AAAA,IACzD,GAAGC;AAAA,IACH,GAAGI;AAAA,IAEH,UAAAH;AAAA,EAAA;AAAA,GAqBEO,IAAc,CAAC;AAAA,EACpB,WAAAZ;AAAA,EACA,WAAAC;AAAA,EACA,YAAAY;AAAA,EACA,YAAAC;AAAA,EACA,IAAAX;AAAA,EACA,OAAAY;AAAA,EACA,YAAAC;AAAA,EACA,OAAAT;AAAA,EACA,OAAAH;AAAA,EACA,UAAAC;AAAA,EACA,WAAAH;AAAA,EACA,MAAAI,IAAO;AAAA,EACP,GAAGE;AACJ,MAAwB;AACvB,QAAMS,IAAcC,EAAA,GACdC,IAAUhB,KAAMc;AAEtB,SACC,gBAAAR;AAAA,IAACW;AAAA,IAAA;AAAA,MACA,OAAAL;AAAA,MACA,YAAAC;AAAA,MACA,OAAAT;AAAA,MACA,YAAAM;AAAA,MACA,YAAAC;AAAA,MACA,IAAIK;AAAA,MACJ,QAAO;AAAA,MACP,WAAAjB;AAAA,MAEA,UAAA,gBAAAO;AAAA,QAACV;AAAA,QAAA;AAAA,UACA,IAAIoB;AAAA,UACJ,WAAAnB;AAAA,UACA,UAAUa;AAAA,UACV,OAAAT;AAAA,UACA,MAAAE;AAAA,UACC,GAAGE;AAAA,UAEH,UAAAH;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAGH;AAEAO,EAAY,cAAc;"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/form/select/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport type { HTMLProps, ReactNode } from 'react'\nimport { useId } from 'react'\nimport { Field } from '../field'\nimport s from './form-select.module.css'\n\ninterface SelectBaseProps {\n\tisInvalid?: boolean\n\tisLoading?: boolean\n\trequired?: boolean\n\tclassName?: string\n\tid: string\n\tfield: HTMLProps<HTMLSelectElement>\n\tchildren: ReactNode\n\tsize: 'medium' | 'large'\n\terror?: ReactNode\n\tdisabled?: boolean\n}\n\nconst SelectBase = ({\n\tisInvalid,\n\tisLoading,\n\tclassName,\n\tid,\n\tfield,\n\tchildren,\n\tsize,\n\terror,\n\t...rest\n}: SelectBaseProps) => {\n\treturn (\n\t\t<select\n\t\t\tid={id}\n\t\t\tclassName={classNames(\n\t\t\t\ts.select,\n\t\t\t\ts[size],\n\t\t\t\t{\n\t\t\t\t\t[s.invalid]: isInvalid,\n\t\t\t\t},\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\taria-describedby={`${error ? 'error' : 'helper-text'}-${id}`}\n\t\t\t{...field}\n\t\t\t{...rest}\n\t\t>\n\t\t\t{children}\n\t\t</select>\n\t)\n}\n\ninterface SelectFieldProps {\n\tisInvalid?: boolean\n\tisLoading?: boolean\n\tisRequired?: boolean\n\tisOptional?: boolean\n\tid?: string\n\tlabel?: ReactNode\n\thelperText?: ReactNode\n\terror?: ReactNode\n\tfield: HTMLProps<HTMLSelectElement>\n\tchildren: ReactNode\n\tclassName?: string\n\tsize?: 'medium' | 'large'\n\tdisabled?: boolean\n\tmultiple?: boolean\n}\n\nconst SelectField = ({\n\tisInvalid,\n\tisLoading,\n\tisRequired,\n\tisOptional,\n\tid,\n\tlabel,\n\thelperText,\n\terror,\n\tfield,\n\tchildren,\n\tclassName,\n\tsize = 'medium',\n\t...rest\n}: SelectFieldProps) => {\n\tconst generatedId = useId()\n\tconst inputId = id ?? generatedId\n\n\treturn (\n\t\t<Field\n\t\t\tlabel={label}\n\t\t\thelperText={helperText}\n\t\t\terror={error}\n\t\t\tisRequired={isRequired}\n\t\t\tisOptional={isOptional}\n\t\t\tid={inputId}\n\t\t\tlayout=\"vertical\"\n\t\t\tclassName={className}\n\t\t>\n\t\t\t<SelectBase\n\t\t\t\tid={inputId}\n\t\t\t\tisInvalid={isInvalid}\n\t\t\t\trequired={isRequired}\n\t\t\t\tfield={field}\n\t\t\t\tsize={size}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</SelectBase>\n\t\t</Field>\n\t)\n}\n\nSelectField.displayName = 'SelectField'\n\nexport { SelectField }\n"],"names":["SelectBase","isInvalid","isLoading","className","id","field","children","size","error","rest","jsx","classNames","s","SelectField","isRequired","isOptional","label","helperText","generatedId","useId","inputId","Field"],"mappings":";;;;;AAmBA,MAAMA,IAAa,CAAC;AAAA,EACnB,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,GAAGC;AACJ,MAEE,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACA,IAAAN;AAAA,IACA,WAAWO;AAAA,MACVC,EAAE;AAAA,MACFA,EAAEL,CAAI;AAAA,MACN;AAAA,QACC,CAACK,EAAE,OAAO,GAAGX;AAAA,MAAA;AAAA,MAEdE;AAAA,IAAA;AAAA,IAED,oBAAkB,GAAGK,IAAQ,UAAU,aAAa,IAAIJ,CAAE;AAAA,IACzD,GAAGC;AAAA,IACH,GAAGI;AAAA,IAEH,UAAAH;AAAA,EAAA;AAAA,GAsBEO,IAAc,CAAC;AAAA,EACpB,WAAAZ;AAAA,EACA,WAAAC;AAAA,EACA,YAAAY;AAAA,EACA,YAAAC;AAAA,EACA,IAAAX;AAAA,EACA,OAAAY;AAAA,EACA,YAAAC;AAAA,EACA,OAAAT;AAAA,EACA,OAAAH;AAAA,EACA,UAAAC;AAAA,EACA,WAAAH;AAAA,EACA,MAAAI,IAAO;AAAA,EACP,GAAGE;AACJ,MAAwB;AACvB,QAAMS,IAAcC,EAAA,GACdC,IAAUhB,KAAMc;AAEtB,SACC,gBAAAR;AAAA,IAACW;AAAA,IAAA;AAAA,MACA,OAAAL;AAAA,MACA,YAAAC;AAAA,MACA,OAAAT;AAAA,MACA,YAAAM;AAAA,MACA,YAAAC;AAAA,MACA,IAAIK;AAAA,MACJ,QAAO;AAAA,MACP,WAAAjB;AAAA,MAEA,UAAA,gBAAAO;AAAA,QAACV;AAAA,QAAA;AAAA,UACA,IAAIoB;AAAA,UACJ,WAAAnB;AAAA,UACA,UAAUa;AAAA,UACV,OAAAT;AAAA,UACA,MAAAE;AAAA,UACC,GAAGE;AAAA,UAEH,UAAAH;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAGH;AAEAO,EAAY,cAAc;"}

package/components/text/index.d.ts

@@ -1,4 +1,4 @@
-import { ComponentPropsWithRef, ElementType } from 'react';
+import { type ComponentPropsWithRef, type ElementType } from 'react';
 declare const TEXT_COLORS: readonly ["primary", "strong", "faint", "disabled", "high-contrast", "action", "action-hover", "action-active", "highlight", "highlight-on-surface", "highlight-high-contrast", "success", "success-on-surface", "success-high-contrast", "warning", "warning-on-surface", "warning-high-contrast", "critical", "critical-on-surface", "critical-high-contrast"];
 declare const TEXT_GROUPS: readonly ["hds-body", "code", "body", "display-expressive", "label"];
 declare const TEXT_SIZES: readonly ["100", "200", "300", "400", "500", "600", "700", "800"];
@@ -10,7 +10,7 @@ type TextSize = (typeof TEXT_SIZES)[number];
 type HexColor = string & {
     hexish?: unknown;
 };
-interface BaseTextProps<T extends ElementType> {
+interface BaseTextProps<T extends ElementType> extends React.PropsWithChildren {
     tag?: T;
     size?: TextSize;
     weight?: TextWeight;
@@ -35,10 +35,10 @@ interface CodeProps<T extends ElementType> extends BaseTextProps<T> {
     size?: '100' | '200' | '300';
 }
 declare const Text: {
-    Body: <T extends ElementType<any, keyof import("react").JSX.IntrinsicElements>>({ size, ...rest }: BodyProps<T> & Omit<ComponentPropsWithRef<T>, keyof BodyProps<T>>) => import('react').FunctionComponentElement<TextImplProps<ElementType<any, keyof import("react").JSX.IntrinsicElements>> & Omit<any, keyof TextImplProps<T_1>>>;
-    DisplayExpressive: <T_2 extends ElementType<any, keyof import("react").JSX.IntrinsicElements>>({ size, ...rest }: DisplayExpressiveProps<T_2> & Omit<ComponentPropsWithRef<T_2>, keyof DisplayExpressiveProps<T_2>>) => import('react').FunctionComponentElement<TextImplProps<ElementType<any, keyof import("react").JSX.IntrinsicElements>> & Omit<any, keyof TextImplProps<T_1>>>;
-    Label: <T_3 extends ElementType<any, keyof import("react").JSX.IntrinsicElements>>(props: LabelProps<T_3> & Omit<ComponentPropsWithRef<T_3>, "className" | "color" | "tag" | "weight" | "align">) => import('react').FunctionComponentElement<TextImplProps<ElementType<any, keyof import("react").JSX.IntrinsicElements>> & Omit<any, keyof TextImplProps<T_1>>>;
-    HDSBody: <T_4 extends ElementType<any, keyof import("react").JSX.IntrinsicElements>>({ size, weight, ...rest }: HDSBodyProps<T_4> & Omit<ComponentPropsWithRef<T_4>, keyof HDSBodyProps<T_4>>) => import('react').FunctionComponentElement<TextImplProps<ElementType<any, keyof import("react").JSX.IntrinsicElements>> & Omit<any, keyof TextImplProps<T_1>>>;
-    Code: <T_5 extends ElementType<any, keyof import("react").JSX.IntrinsicElements>>({ size, weight, ...rest }: CodeProps<T_5> & Omit<ComponentPropsWithRef<T_5>, keyof CodeProps<T_5>>) => import('react').FunctionComponentElement<TextImplProps<ElementType<any, keyof import("react").JSX.IntrinsicElements>> & Omit<any, keyof TextImplProps<T_1>>>;
+    Body: <T extends ElementType>({ size, ...rest }: BodyProps<T> & Omit<ComponentPropsWithRef<T>, keyof BodyProps<T>>) => import("react").FunctionComponentElement<TextImplProps<ElementType> & Omit<any, keyof TextImplProps<T_1>>>;
+    DisplayExpressive: <T extends ElementType>({ size, ...rest }: DisplayExpressiveProps<T> & Omit<ComponentPropsWithRef<T>, keyof DisplayExpressiveProps<T>>) => import("react").FunctionComponentElement<TextImplProps<ElementType> & Omit<any, keyof TextImplProps<T_1>>>;
+    Label: <T extends ElementType>(props: LabelProps<T> & Omit<ComponentPropsWithRef<T>, keyof LabelProps<T>>) => import("react").FunctionComponentElement<TextImplProps<ElementType> & Omit<any, keyof TextImplProps<T_1>>>;
+    HDSBody: <T extends ElementType>({ size, weight, ...rest }: HDSBodyProps<T> & Omit<ComponentPropsWithRef<T>, keyof HDSBodyProps<T>>) => import("react").FunctionComponentElement<TextImplProps<ElementType> & Omit<any, keyof TextImplProps<T_1>>>;
+    Code: <T extends ElementType>({ size, weight, ...rest }: CodeProps<T> & Omit<ComponentPropsWithRef<T>, keyof CodeProps<T>>) => import("react").FunctionComponentElement<TextImplProps<ElementType> & Omit<any, keyof TextImplProps<T_1>>>;
 };
 export { Text, TEXT_COLORS, TEXT_WEIGHTS };

package/components/text/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/text/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport {\n\tcreateElement,\n\ttype ComponentPropsWithRef,\n\ttype ElementType,\n} from 'react'\nimport s from './style.module.scss'\n\nconst TEXT_COLORS = [\n\t'primary',\n\t'strong',\n\t'faint',\n\t'disabled',\n\t'high-contrast',\n\t'action',\n\t'action-hover',\n\t'action-active',\n\t'highlight',\n\t'highlight-on-surface',\n\t'highlight-high-contrast',\n\t'success',\n\t'success-on-surface',\n\t'success-high-contrast',\n\t'warning',\n\t'warning-on-surface',\n\t'warning-high-contrast',\n\t'critical',\n\t'critical-on-surface',\n\t'critical-high-contrast',\n] as const\n\nconst TEXT_GROUPS = [\n\t'hds-body',\n\t'code',\n\t'body',\n\t'display-expressive',\n\t'label',\n] as const\n\nconst TEXT_SIZES = [\n\t'100',\n\t'200',\n\t'300',\n\t'400',\n\t'500',\n\t'600',\n\t'700',\n\t'800',\n] as const\n\nconst TEXT_WEIGHTS = ['regular', 'medium', 'semibold', 'bold'] as const\n\ntype TextColor = (typeof TEXT_COLORS)[number]\ntype TextWeight = (typeof TEXT_WEIGHTS)[number]\ntype TextGroup = (typeof TEXT_GROUPS)[number]\ntype TextSize = (typeof TEXT_SIZES)[number]\n\n// small typescript hack to support autocomplete and arbitrary strings\ntype HexColor = string & { hexish?: unknown }\n\ninterface BaseTextProps<T extends ElementType> {\n\ttag?: T\n\tsize?: TextSize\n\tweight?: TextWeight\n\talign?: 'left' | 'center' | 'right'\n\tcolor?: TextColor | HexColor\n\tclassName?: string\n}\n\ninterface TextImplProps<T extends ElementType> extends BaseTextProps<T> {\n\tgroup: TextGroup\n}\n\nfunction getTypographyToken(group: TextGroup, size: TextSize): string {\n\tconst groupToTokenMap: Record<TextGroup, string> = {\n\t\t'hds-body': `mds-typography-legacy-body-${size}`,\n\t\tcode: `mds-typography-code-${size}`,\n\t\t'display-expressive': `mds-typography-display-expressive-${size}`,\n\t\tlabel: `mds-typography-label`,\n\t\tbody: `mds-typography-body-${size}`,\n\t}\n\n\treturn groupToTokenMap[group]\n}\n\nconst TextImpl = <T extends ElementType = 'span'>({\n\ttag,\n\tgroup,\n\tsize = '200',\n\tweight,\n\talign,\n\tcolor,\n\tchildren,\n\tclassName,\n\t...rest\n}: TextImplProps<T> &\n\tOmit<ComponentPropsWithRef<T>, keyof TextImplProps<T>>) => {\n\tconst Component = tag ?? 'span'\n\tconst variant = getTypographyToken(group, size)\n\n\tconst usesPredefinedColor = TEXT_COLORS.includes(color as TextColor)\n\n\treturn (\n\t\t<Component\n\t\t\tclassName={classNames(\n\t\t\t\tvariant,\n\t\t\t\t{\n\t\t\t\t\t[s[`align-${align}`]]: align,\n\t\t\t\t\t[`mds-typography-font-weight-${weight}`]: weight,\n\t\t\t\t\t[`mds-foreground-${color}`]: color && usesPredefinedColor,\n\t\t\t\t},\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\tstyle={color && !usesPredefinedColor ? { color } : {}}\n\t\t\t{...rest}\n\t\t>\n\t\t\t{children}\n\t\t</Component>\n\t)\n}\n\ninterface BodyProps<T extends ElementType> extends BaseTextProps<T> {\n\tsize?: '200' | '300' | '400'\n}\n\nconst Body = <T extends ElementType>({\n\tsize = '300',\n\t...rest\n}: BodyProps<T> & Omit<ComponentPropsWithRef<T>, keyof BodyProps<T>>) => {\n\treturn createElement(TextImpl, {\n\t\t...rest,\n\t\tsize,\n\t\tgroup: 'body',\n\t})\n}\n\ninterface DisplayExpressiveProps<T extends ElementType>\n\textends BaseTextProps<T> {\n\tsize?: '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800'\n}\n\nconst DisplayExpressive = <T extends ElementType>({\n\tsize = '200',\n\t...rest\n}: DisplayExpressiveProps<T> &\n\tOmit<ComponentPropsWithRef<T>, keyof DisplayExpressiveProps<T>>) => {\n\treturn createElement(TextImpl, {\n\t\t...rest,\n\t\tsize,\n\t\tgroup: 'display-expressive',\n\t})\n}\n\ntype LabelProps<T extends ElementType> = Omit<BaseTextProps<T>, 'size'>\n\nconst Label = <T extends ElementType>(\n\tprops: LabelProps<T> & Omit<ComponentPropsWithRef<T>, keyof LabelProps<T>>\n) => {\n\treturn createElement(TextImpl, {\n\t\t...props,\n\t\tgroup: 'label',\n\t})\n}\n\ninterface HDSBodyProps<T extends ElementType> extends BaseTextProps<T> {\n\tsize?: '100' | '200' | '300'\n}\n\nconst HDSBody = <T extends ElementType>({\n\tsize = '200',\n\tweight = 'regular',\n\t...rest\n}: HDSBodyProps<T> & Omit<ComponentPropsWithRef<T>, keyof HDSBodyProps<T>>) => {\n\treturn createElement(TextImpl, {\n\t\t...rest,\n\t\tsize,\n\t\tweight,\n\t\tgroup: 'hds-body',\n\t})\n}\n\ninterface CodeProps<T extends ElementType> extends BaseTextProps<T> {\n\tsize?: '100' | '200' | '300'\n}\n\nconst Code = <T extends ElementType>({\n\tsize = '200',\n\tweight = 'regular',\n\t...rest\n}: CodeProps<T> & Omit<ComponentPropsWithRef<T>, keyof CodeProps<T>>) => {\n\treturn createElement(TextImpl, {\n\t\t...rest,\n\t\tsize,\n\t\tweight,\n\t\tgroup: 'code',\n\t})\n}\n\nconst Text = {\n\tBody,\n\tDisplayExpressive,\n\tLabel,\n\tHDSBody,\n\tCode,\n}\n\nexport { Text, TEXT_COLORS, TEXT_WEIGHTS }\n"],"names":["TEXT_COLORS","TEXT_WEIGHTS","getTypographyToken","group","size","TextImpl","tag","weight","align","color","children","className","rest","Component","variant","usesPredefinedColor","jsx","classNames","s","Body","createElement","DisplayExpressive","Label","props","HDSBody","Code","Text"],"mappings":";;;;AAQA,MAAMA,IAAc;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAqBMC,IAAe,CAAC,WAAW,UAAU,YAAY,MAAM;AAuB7D,SAASC,EAAmBC,GAAkBC,GAAwB;AASrE,SARmD;AAAA,IAClD,YAAY,8BAA8BA,CAAI;AAAA,IAC9C,MAAM,uBAAuBA,CAAI;AAAA,IACjC,sBAAsB,qCAAqCA,CAAI;AAAA,IAC/D,OAAO;AAAA,IACP,MAAM,uBAAuBA,CAAI;AAAA,EAAA,EAGXD,CAAK;AAC7B;AAEA,MAAME,IAAW,CAAiC;AAAA,EACjD,KAAAC;AAAA,EACA,OAAAH;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,QAAAG;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACJ,MAC4D;AAC3D,QAAMC,IAAYP,KAAO,QACnBQ,IAAUZ,EAAmBC,GAAOC,CAAI,GAExCW,IAAsBf,EAAY,SAASS,CAAkB;AAEnE,SACC,gBAAAO;AAAA,IAACH;AAAA,IAAA;AAAA,MACA,WAAWI;AAAA,QACVH;AAAA,QACA;AAAA,UACC,CAACI,EAAE,SAASV,CAAK,EAAE,CAAC,GAAGA;AAAA,UACvB,CAAC,8BAA8BD,CAAM,EAAE,GAAGA;AAAA,UAC1C,CAAC,kBAAkBE,CAAK,EAAE,GAAGA,KAASM;AAAA,QAAA;AAAA,QAEvCJ;AAAA,MAAA;AAAA,MAED,OAAOF,KAAS,CAACM,IAAsB,EAAE,OAAAN,EAAA,IAAU,CAAA;AAAA,MAClD,GAAGG;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGJ,GAMMS,IAAO,CAAwB;AAAA,EACpC,MAAAf,IAAO;AAAA,EACP,GAAGQ;AACJ,MACQQ,EAAcf,GAAU;AAAA,EAC9B,GAAGO;AAAA,EACH,MAAAR;AAAA,EACA,OAAO;AAAA,CACP,GAQIiB,IAAoB,CAAwB;AAAA,EACjD,MAAAjB,IAAO;AAAA,EACP,GAAGQ;AACJ,MAEQQ,EAAcf,GAAU;AAAA,EAC9B,GAAGO;AAAA,EACH,MAAAR;AAAA,EACA,OAAO;AAAA,CACP,GAKIkB,IAAQ,CACbC,MAEOH,EAAcf,GAAU;AAAA,EAC9B,GAAGkB;AAAA,EACH,OAAO;AAAA,CACP,GAOIC,IAAU,CAAwB;AAAA,EACvC,MAAApB,IAAO;AAAA,EACP,QAAAG,IAAS;AAAA,EACT,GAAGK;AACJ,MACQQ,EAAcf,GAAU;AAAA,EAC9B,GAAGO;AAAA,EACH,MAAAR;AAAA,EACA,QAAAG;AAAA,EACA,OAAO;AAAA,CACP,GAOIkB,IAAO,CAAwB;AAAA,EACpC,MAAArB,IAAO;AAAA,EACP,QAAAG,IAAS;AAAA,EACT,GAAGK;AACJ,MACQQ,EAAcf,GAAU;AAAA,EAC9B,GAAGO;AAAA,EACH,MAAAR;AAAA,EACA,QAAAG;AAAA,EACA,OAAO;AAAA,CACP,GAGImB,IAAO;AAAA,EACZ,MAAAP;AAAA,EACA,mBAAAE;AAAA,EACA,OAAAC;AAAA,EACA,SAAAE;AAAA,EACA,MAAAC;AACD;"}
+{"version":3,"file":"index.js","sources":["../../../src/components/text/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport {\n\tcreateElement,\n\ttype ComponentPropsWithRef,\n\ttype ElementType,\n} from 'react'\nimport s from './style.module.scss'\n\nconst TEXT_COLORS = [\n\t'primary',\n\t'strong',\n\t'faint',\n\t'disabled',\n\t'high-contrast',\n\t'action',\n\t'action-hover',\n\t'action-active',\n\t'highlight',\n\t'highlight-on-surface',\n\t'highlight-high-contrast',\n\t'success',\n\t'success-on-surface',\n\t'success-high-contrast',\n\t'warning',\n\t'warning-on-surface',\n\t'warning-high-contrast',\n\t'critical',\n\t'critical-on-surface',\n\t'critical-high-contrast',\n] as const\n\nconst TEXT_GROUPS = [\n\t'hds-body',\n\t'code',\n\t'body',\n\t'display-expressive',\n\t'label',\n] as const\n\nconst TEXT_SIZES = [\n\t'100',\n\t'200',\n\t'300',\n\t'400',\n\t'500',\n\t'600',\n\t'700',\n\t'800',\n] as const\n\nconst TEXT_WEIGHTS = ['regular', 'medium', 'semibold', 'bold'] as const\n\ntype TextColor = (typeof TEXT_COLORS)[number]\ntype TextWeight = (typeof TEXT_WEIGHTS)[number]\ntype TextGroup = (typeof TEXT_GROUPS)[number]\ntype TextSize = (typeof TEXT_SIZES)[number]\n\n// small typescript hack to support autocomplete and arbitrary strings\ntype HexColor = string & { hexish?: unknown }\n\ninterface BaseTextProps<T extends ElementType> extends React.PropsWithChildren {\n\ttag?: T\n\tsize?: TextSize\n\tweight?: TextWeight\n\talign?: 'left' | 'center' | 'right'\n\tcolor?: TextColor | HexColor\n\tclassName?: string\n}\n\ninterface TextImplProps<T extends ElementType> extends BaseTextProps<T> {\n\tgroup: TextGroup\n}\n\nfunction getTypographyToken(group: TextGroup, size: TextSize): string {\n\tconst groupToTokenMap: Record<TextGroup, string> = {\n\t\t'hds-body': `mds-typography-legacy-body-${size}`,\n\t\tcode: `mds-typography-code-${size}`,\n\t\t'display-expressive': `mds-typography-display-expressive-${size}`,\n\t\tlabel: `mds-typography-label`,\n\t\tbody: `mds-typography-body-${size}`,\n\t}\n\n\treturn groupToTokenMap[group]\n}\n\nconst TextImpl = <T extends ElementType = 'span'>({\n\ttag,\n\tgroup,\n\tsize = '200',\n\tweight,\n\talign,\n\tcolor,\n\tchildren,\n\tclassName,\n\t...rest\n}: TextImplProps<T> &\n\tOmit<ComponentPropsWithRef<T>, keyof TextImplProps<T>>) => {\n\tconst Component = tag ?? 'span'\n\tconst variant = getTypographyToken(group, size)\n\n\tconst usesPredefinedColor = TEXT_COLORS.includes(color as TextColor)\n\n\treturn (\n\t\t<Component\n\t\t\tclassName={classNames(\n\t\t\t\tvariant,\n\t\t\t\t{\n\t\t\t\t\t[s[`align-${align}`]]: align,\n\t\t\t\t\t[`mds-typography-font-weight-${weight}`]: weight,\n\t\t\t\t\t[`mds-foreground-${color}`]: color && usesPredefinedColor,\n\t\t\t\t},\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\tstyle={color && !usesPredefinedColor ? { color } : {}}\n\t\t\t{...rest}\n\t\t>\n\t\t\t{children}\n\t\t</Component>\n\t)\n}\n\ninterface BodyProps<T extends ElementType> extends BaseTextProps<T> {\n\tsize?: '200' | '300' | '400'\n}\n\nconst Body = <T extends ElementType>({\n\tsize = '300',\n\t...rest\n}: BodyProps<T> & Omit<ComponentPropsWithRef<T>, keyof BodyProps<T>>) => {\n\treturn createElement(TextImpl, {\n\t\t...rest,\n\t\tsize,\n\t\tgroup: 'body',\n\t})\n}\n\ninterface DisplayExpressiveProps<T extends ElementType>\n\textends BaseTextProps<T> {\n\tsize?: '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800'\n}\n\nconst DisplayExpressive = <T extends ElementType>({\n\tsize = '200',\n\t...rest\n}: DisplayExpressiveProps<T> &\n\tOmit<ComponentPropsWithRef<T>, keyof DisplayExpressiveProps<T>>) => {\n\treturn createElement(TextImpl, {\n\t\t...rest,\n\t\tsize,\n\t\tgroup: 'display-expressive',\n\t})\n}\n\ntype LabelProps<T extends ElementType> = Omit<BaseTextProps<T>, 'size'>\n\nconst Label = <T extends ElementType>(\n\tprops: LabelProps<T> & Omit<ComponentPropsWithRef<T>, keyof LabelProps<T>>\n) => {\n\treturn createElement(TextImpl, {\n\t\t...props,\n\t\tgroup: 'label',\n\t})\n}\n\ninterface HDSBodyProps<T extends ElementType> extends BaseTextProps<T> {\n\tsize?: '100' | '200' | '300'\n}\n\nconst HDSBody = <T extends ElementType>({\n\tsize = '200',\n\tweight = 'regular',\n\t...rest\n}: HDSBodyProps<T> & Omit<ComponentPropsWithRef<T>, keyof HDSBodyProps<T>>) => {\n\treturn createElement(TextImpl, {\n\t\t...rest,\n\t\tsize,\n\t\tweight,\n\t\tgroup: 'hds-body',\n\t})\n}\n\ninterface CodeProps<T extends ElementType> extends BaseTextProps<T> {\n\tsize?: '100' | '200' | '300'\n}\n\nconst Code = <T extends ElementType>({\n\tsize = '200',\n\tweight = 'regular',\n\t...rest\n}: CodeProps<T> & Omit<ComponentPropsWithRef<T>, keyof CodeProps<T>>) => {\n\treturn createElement(TextImpl, {\n\t\t...rest,\n\t\tsize,\n\t\tweight,\n\t\tgroup: 'code',\n\t})\n}\n\nconst Text = {\n\tBody,\n\tDisplayExpressive,\n\tLabel,\n\tHDSBody,\n\tCode,\n}\n\nexport { Text, TEXT_COLORS, TEXT_WEIGHTS }\n"],"names":["TEXT_COLORS","TEXT_WEIGHTS","getTypographyToken","group","size","TextImpl","tag","weight","align","color","children","className","rest","Component","variant","usesPredefinedColor","jsx","classNames","s","Body","createElement","DisplayExpressive","Label","props","HDSBody","Code","Text"],"mappings":";;;;AAQA,MAAMA,IAAc;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAqBMC,IAAe,CAAC,WAAW,UAAU,YAAY,MAAM;AAuB7D,SAASC,EAAmBC,GAAkBC,GAAwB;AASrE,SARmD;AAAA,IAClD,YAAY,8BAA8BA,CAAI;AAAA,IAC9C,MAAM,uBAAuBA,CAAI;AAAA,IACjC,sBAAsB,qCAAqCA,CAAI;AAAA,IAC/D,OAAO;AAAA,IACP,MAAM,uBAAuBA,CAAI;AAAA,EAAA,EAGXD,CAAK;AAC7B;AAEA,MAAME,IAAW,CAAiC;AAAA,EACjD,KAAAC;AAAA,EACA,OAAAH;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,QAAAG;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACJ,MAC4D;AAC3D,QAAMC,IAAYP,KAAO,QACnBQ,IAAUZ,EAAmBC,GAAOC,CAAI,GAExCW,IAAsBf,EAAY,SAASS,CAAkB;AAEnE,SACC,gBAAAO;AAAA,IAACH;AAAA,IAAA;AAAA,MACA,WAAWI;AAAA,QACVH;AAAA,QACA;AAAA,UACC,CAACI,EAAE,SAASV,CAAK,EAAE,CAAC,GAAGA;AAAA,UACvB,CAAC,8BAA8BD,CAAM,EAAE,GAAGA;AAAA,UAC1C,CAAC,kBAAkBE,CAAK,EAAE,GAAGA,KAASM;AAAA,QAAA;AAAA,QAEvCJ;AAAA,MAAA;AAAA,MAED,OAAOF,KAAS,CAACM,IAAsB,EAAE,OAAAN,EAAA,IAAU,CAAA;AAAA,MAClD,GAAGG;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGJ,GAMMS,IAAO,CAAwB;AAAA,EACpC,MAAAf,IAAO;AAAA,EACP,GAAGQ;AACJ,MACQQ,EAAcf,GAAU;AAAA,EAC9B,GAAGO;AAAA,EACH,MAAAR;AAAA,EACA,OAAO;AAAA,CACP,GAQIiB,IAAoB,CAAwB;AAAA,EACjD,MAAAjB,IAAO;AAAA,EACP,GAAGQ;AACJ,MAEQQ,EAAcf,GAAU;AAAA,EAC9B,GAAGO;AAAA,EACH,MAAAR;AAAA,EACA,OAAO;AAAA,CACP,GAKIkB,IAAQ,CACbC,MAEOH,EAAcf,GAAU;AAAA,EAC9B,GAAGkB;AAAA,EACH,OAAO;AAAA,CACP,GAOIC,IAAU,CAAwB;AAAA,EACvC,MAAApB,IAAO;AAAA,EACP,QAAAG,IAAS;AAAA,EACT,GAAGK;AACJ,MACQQ,EAAcf,GAAU;AAAA,EAC9B,GAAGO;AAAA,EACH,MAAAR;AAAA,EACA,QAAAG;AAAA,EACA,OAAO;AAAA,CACP,GAOIkB,IAAO,CAAwB;AAAA,EACpC,MAAArB,IAAO;AAAA,EACP,QAAAG,IAAS;AAAA,EACT,GAAGK;AACJ,MACQQ,EAAcf,GAAU;AAAA,EAC9B,GAAGO;AAAA,EACH,MAAAR;AAAA,EACA,QAAAG;AAAA,EACA,OAAO;AAAA,CACP,GAGImB,IAAO;AAAA,EACZ,MAAAP;AAAA,EACA,mBAAAE;AAAA,EACA,OAAAC;AAAA,EACA,SAAAE;AAAA,EACA,MAAAC;AACD;"}

package/components/visualizations/bar-chart/horizontal-chart/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface Dataset {
     label: string;
     values: Array<{

package/components/visualizations/bar-chart/index.d.ts

@@ -1,4 +1,4 @@
-import { default as HorizontalBarChart, HorizontalBarChartProps } from './horizontal-chart';
+import HorizontalBarChart, { type HorizontalBarChartProps } from './horizontal-chart';
 interface HorizontalBarChart extends HorizontalBarChartProps {
     name: string;
     caption: string;

package/index.js

@@ -3,14 +3,14 @@ import { BADGE_COLORS as p, BADGE_SIZES as m, BADGE_TYPES as x, Badge as f } fro
 import { BadgeCount as i } from "./components/badge-count/index.js";
 import { Alert as n, AlertActions as l, AlertButton as T, AlertStandaloneLink as C } from "./components/alert/index.js";
 import { Breadcrumbs as S } from "./components/breadcrumbs/index.js";
-import { BUTTON_COLORS as A, BUTTON_ICON_POSITIONS as s, BUTTON_SIZES as L, Button as c } from "./components/button/index.js";
+import { BUTTON_COLORS as L, BUTTON_ICON_POSITIONS as c, BUTTON_SIZES as s, Button as A } from "./components/button/index.js";
 import { Card as _, CardContent as P } from "./components/card/index.js";
 import { CodeBlock as B } from "./components/code-block/index.js";
 import { DisclosurePrimitive as D } from "./components/disclosure-primitive/index.js";
 import { useDisclosurePrimitive as R } from "./components/disclosure-primitive/use-disclosure-primitive.js";
 import { Dropdown as F } from "./components/dropdown/index.js";
 import { FLIGHT_ICON_SIZES as b, FlightIcon as k } from "./components/flight-icon/index.js";
-import { CheckboxBase as M, CheckboxField as v, CheckboxGroup as Z } from "./components/form/checkbox/index.js";
+import { CheckboxBase as v, CheckboxField as M, CheckboxGroup as Z } from "./components/form/checkbox/index.js";
 import { Error as H } from "./components/form/error/index.js";
 import { Field as Y } from "./components/form/field/index.js";
 import { Fieldset as w } from "./components/form/fieldset/index.js";
@@ -24,14 +24,14 @@ import { RadioCard as ao } from "./components/form/radio-card/index.js";
 import { SelectField as no } from "./components/form/select/index.js";
 import { SuperSelectField as To } from "./components/form/super-select/index.js";
 import { TextInput as Oo, TextInputBase as So } from "./components/form/text-input/index.js";
-import { TextAreaField as Ao } from "./components/form/textarea/index.js";
-import { ToggleBase as Lo, ToggleField as co, ToggleGroup as Io } from "./components/form/toggle/index.js";
+import { TextAreaField as Lo } from "./components/form/textarea/index.js";
+import { ToggleBase as so, ToggleField as Ao, ToggleGroup as Io } from "./components/form/toggle/index.js";
 import { IconTile as Po } from "./components/icon-tile/index.js";
 import { InlineLink as Bo } from "./components/inline-link/index.js";
 import { MDSButton as Do } from "./components/legacy-button/index.js";
 import { ModalProvider as Ro } from "./components/modal/index.js";
 import { Separator as Fo } from "./components/separator/index.js";
-import { STANDALONE_LINK_COLORS as bo, STANDALONE_LINK_ICON_POSITIONS as ko, STANDALONE_LINK_SIZES as ho, StandaloneLink as Mo } from "./components/standalone-link/index.js";
+import { STANDALONE_LINK_COLORS as bo, STANDALONE_LINK_ICON_POSITIONS as ko, STANDALONE_LINK_SIZES as ho, StandaloneLink as vo } from "./components/standalone-link/index.js";
 import { Table as Zo } from "./components/table/index.js";
 import { getDensity as Ho, getHorizontalAlignment as Ko, getScope as Yo, getVerticalAlignment as zo } from "./components/table/utils.js";
 import { Tabs as Xo } from "./components/tabs/index.js";
@@ -44,18 +44,20 @@ import { CardPrimitives as xr } from "./patterns/card/primitives.js";
 import { CopyButton as ar } from "./patterns/copy-button/index.js";
 import { LAYOUT_APPEARANCES as dr, LAYOUT_BACKGROUNDS as nr, LAYOUT_PADDING as lr, Layout as Tr, normalizeLayoutProps as Cr } from "./patterns/layout/index.js";
 import { ProductBadge as Sr } from "./patterns/product-badge/index.js";
-import { PRODUCT_LOGO_COLORS as Ar, PRODUCT_LOGO_PRODUCTS as sr, PRODUCT_LOGO_SIZES as Lr, ProductLogo as cr, normalizeProductLogoProps as Ir } from "./patterns/product-logo/index.js";
+import { PRODUCT_LOGO_COLORS as Lr, PRODUCT_LOGO_PRODUCTS as cr, PRODUCT_LOGO_SIZES as sr, ProductLogo as Ar, normalizeProductLogoProps as Ir } from "./patterns/product-logo/index.js";
 import { RelatedContent as Pr } from "./patterns/related-content/index.js";
 import { useLarge as Br, useMedium as Nr, useMediumUp as Dr, useSmall as Er } from "./utils/hooks/use-screen-size.js";
 import { MDSProvider as Gr } from "./utils/mds-context/index.js";
 import { AccordionContent as Ur, AccordionItem as br, AccordionToggle as kr } from "./components/accordion/item/index.js";
-import { RadioCardGroup as Mr } from "./components/form/radio-card/group.js";
+import { RadioCardGroup as vr } from "./components/form/radio-card/group.js";
 import { useModal as Zr } from "./components/modal/use-modal.js";
 import { NewsroomCard as Hr } from "./patterns/card/newsroom-card/index.js";
 import { PersonCard as Yr } from "./patterns/card/person-card/index.js";
 import { PromoCard as wr } from "./patterns/card/promo-card/index.js";
 import { ResourceCard as Vr } from "./patterns/card/resource-card/index.js";
 import { UnifiedCard as jr } from "./patterns/card/unified-card/index.js";
+import { LocaleProvider as Jr } from "./utils/i18n/helpers/locale-provider.js";
+import { useLocale as $r } from "./utils/i18n/helpers/use-locale.js";
 export {
   e as Accordion,
   Ur as AccordionContent,
@@ -68,19 +70,19 @@ export {
   p as BADGE_COLORS,
   m as BADGE_SIZES,
   x as BADGE_TYPES,
-  A as BUTTON_COLORS,
-  s as BUTTON_ICON_POSITIONS,
-  L as BUTTON_SIZES,
+  L as BUTTON_COLORS,
+  c as BUTTON_ICON_POSITIONS,
+  s as BUTTON_SIZES,
   f as Badge,
   i as BadgeCount,
   or as BarChart,
   S as Breadcrumbs,
-  c as Button,
+  A as Button,
   _ as Card,
   P as CardContent,
   xr as CardPrimitives,
-  M as CheckboxBase,
-  v as CheckboxField,
+  v as CheckboxBase,
+  M as CheckboxField,
   Z as CheckboxGroup,
   B as CodeBlock,
   ar as CopyButton,
@@ -104,21 +106,22 @@ export {
   oo as Label,
   Tr as Layout,
   eo as Legend,
+  Jr as LocaleProvider,
   Do as MDSButton,
   Gr as MDSProvider,
   Ro as ModalProvider,
   Hr as NewsroomCard,
-  Ar as PRODUCT_LOGO_COLORS,
-  sr as PRODUCT_LOGO_PRODUCTS,
-  Lr as PRODUCT_LOGO_SIZES,
+  Lr as PRODUCT_LOGO_COLORS,
+  cr as PRODUCT_LOGO_PRODUCTS,
+  sr as PRODUCT_LOGO_SIZES,
   pr as PartnerCard,
   Yr as PersonCard,
   Sr as ProductBadge,
-  cr as ProductLogo,
+  Ar as ProductLogo,
   wr as PromoCard,
   po as RadioBase,
   ao as RadioCard,
-  Mr as RadioCardGroup,
+  vr as RadioCardGroup,
   mo as RadioField,
   xo as RadioGroup,
   Pr as RelatedContent,
@@ -128,18 +131,18 @@ export {
   ho as STANDALONE_LINK_SIZES,
   no as SelectField,
   Fo as Separator,
-  Mo as StandaloneLink,
+  vo as StandaloneLink,
   To as SuperSelectField,
   qo as TEXT_COLORS,
   Jo as TEXT_WEIGHTS,
   Zo as Table,
   Xo as Tabs,
   Qo as Text,
-  Ao as TextAreaField,
+  Lo as TextAreaField,
   Oo as TextInput,
   So as TextInputBase,
-  Lo as ToggleBase,
-  co as ToggleField,
+  so as ToggleBase,
+  Ao as ToggleField,
   Io as ToggleGroup,
   jr as UnifiedCard,
   Ho as getDensity,
@@ -150,6 +153,7 @@ export {
   Ir as normalizeProductLogoProps,
   R as useDisclosurePrimitive,
   Br as useLarge,
+  $r as useLocale,
   Nr as useMedium,
   Dr as useMediumUp,
   Zr as useModal,

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": "@hashicorp/mds-react",
-  "version": "0.9.5",
+  "version": "0.9.7",
   "description": "Materia Design System React components",
   "author": "HashiCorp",
   "license": "MPL-2.0",

package/patterns/card/newsroom-card/index.d.ts

@@ -1,4 +1,4 @@
-import { ThumbnailProps } from '../types';
+import type { ThumbnailProps } from '../types';
 interface NewsroomCardProps {
     heading: string;
     date: string;

package/patterns/card/partner-card/index.d.ts

@@ -1,5 +1,5 @@
-import { MDSImageProps } from '../../../utils/mds-context';
-import { CardPatternProps } from '../types';
+import type { MDSImageProps } from '../../../utils/mds-context';
+import type { CardPatternProps } from '../types';
 interface PartnerCardProps {
     heading: string;
     description: string;

package/patterns/card/person-card/index.d.ts

@@ -1,4 +1,4 @@
-import { ProductBadgesProps, ThumbnailProps } from '../types';
+import type { ProductBadgesProps, ThumbnailProps } from '../types';
 interface PersonCardProps {
     thumbnail: ThumbnailProps;
     link: string;

package/patterns/card/primitives.d.ts

@@ -1,16 +1,16 @@
-import { CardPrimitiveProps, MetaProps, ContentProps, HeadingProps, ProductBadgesProps, DescriptionProps } from './types';
+import type { CardPrimitiveProps, MetaProps, ContentProps, HeadingProps, ProductBadgesProps, DescriptionProps } from './types';
 declare const CardPrimitives: {
-    Root: import('react').ForwardRefExoticComponent<CardPrimitiveProps & import('react').RefAttributes<HTMLDivElement>>;
+    Root: import("react").ForwardRefExoticComponent<CardPrimitiveProps & import("react").RefAttributes<HTMLDivElement>>;
     Thumbnail: {
-        ({ src, alt }: import('./types').ThumbnailProps): import("react/jsx-runtime").JSX.Element;
+        ({ src, alt }: import("./types").ThumbnailProps): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
     PersonThumbnail: {
-        ({ src, alt }: import('./types').ThumbnailProps): import("react/jsx-runtime").JSX.Element;
+        ({ src, alt }: import("./types").ThumbnailProps): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
     LogoThumbnail: {
-        ({ src, alt }: import('./types').ThumbnailProps): import("react/jsx-runtime").JSX.Element;
+        ({ src, alt }: import("./types").ThumbnailProps): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
     Meta: {

package/patterns/card/promo-card/index.d.ts

@@ -1,4 +1,4 @@
-import { ThumbnailProps } from '../types';
+import type { ThumbnailProps } from '../types';
 interface PromoCardProps {
     heading: string;
     description?: string;

package/patterns/card/resource-card/index.d.ts

@@ -1,4 +1,4 @@
-import { CardPatternProps, ThumbnailProps } from '../types';
+import type { CardPatternProps, ThumbnailProps } from '../types';
 interface ResourceCardProps {
     heading: string;
     date?: string;

package/patterns/card/thumbnails/index.d.ts

@@ -1,4 +1,4 @@
-import { ThumbnailProps } from '../types';
+import type { ThumbnailProps } from '../types';
 export declare const Thumbnail: {
     ({ src, alt }: ThumbnailProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;

package/patterns/card/types.d.ts

@@ -1,9 +1,9 @@
-import { PropsWithChildren, ReactNode } from 'react';
-import { ProductBadgeProps } from '../../patterns/product-badge';
-import { NewsroomCardProps } from './newsroom-card';
-import { PersonCardProps } from './person-card';
-import { ResourceCardProps } from './resource-card';
-import { UnifiedCardProps } from './unified-card';
+import type { PropsWithChildren, ReactNode } from 'react';
+import type { ProductBadgeProps } from '../../patterns/product-badge';
+import type { NewsroomCardProps } from './newsroom-card';
+import type { PersonCardProps } from './person-card';
+import type { ResourceCardProps } from './resource-card';
+import type { UnifiedCardProps } from './unified-card';
 interface BaseCardProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'aria-label'> {
     withArrow?: boolean;
     link: string;

package/patterns/card/unified-card/index.d.ts

@@ -1,4 +1,4 @@
-import { CardPatternProps } from '../types';
+import type { CardPatternProps } from '../types';
 interface UnifiedCardProps extends CardPatternProps {
     badges?: (string | string[])[];
 }

package/patterns/product-logo/index.d.ts

@@ -9,32 +9,32 @@ export declare const normalizeProductLogoProps: ((input: {
     color?: unknown;
     product?: unknown;
 }, opts?: {
-    all?: Pick<import('../../utils/make-normalizer').NormalizerOpts<string>, "transform"> | undefined;
+    all?: Pick<import("../../utils/make-normalizer").NormalizerOpts<string>, "transform">;
     each?: {
-        size?: import('../../utils/make-normalizer').NormalizerOpts<"small"> | undefined;
-        color?: import('../../utils/make-normalizer').NormalizerOpts<"primary"> | undefined;
-        product?: import('../../utils/make-normalizer').NormalizerOpts<"hcp"> | undefined;
+        size?: import("../../utils/make-normalizer").NormalizerOpts<"medium" | "small" | "large"> | undefined;
+        color?: import("../../utils/make-normalizer").NormalizerOpts<"primary" | "strong"> | undefined;
+        product?: import("../../utils/make-normalizer").NormalizerOpts<"boundary" | "consul" | "nomad" | "packer" | "terraform" | "vagrant" | "vault" | "vault-radar" | "vault-secrets" | "waypoint" | "hashicorp" | "hcp" | "vault-dedicated" | "vault-enterprise"> | undefined;
     } | undefined;
 } | undefined) => {
-    size: "small";
-    color: "primary";
-    product: "hcp";
+    size: "medium" | "small" | "large";
+    color: "primary" | "strong";
+    product: "boundary" | "consul" | "nomad" | "packer" | "terraform" | "vagrant" | "vault" | "vault-radar" | "vault-secrets" | "waypoint" | "hashicorp" | "hcp" | "vault-dedicated" | "vault-enterprise";
 }) & {
-    with(all: Pick<import('../../utils/make-normalizer').NormalizerOpts<string>, "transform">): (input: {
+    with(all: Pick<import("../../utils/make-normalizer").NormalizerOpts<string>, "transform">): (input: {
         size?: unknown;
         color?: unknown;
         product?: unknown;
     }, opts?: {
-        all?: Pick<import('../../utils/make-normalizer').NormalizerOpts<string>, "transform"> | undefined;
+        all?: Pick<import("../../utils/make-normalizer").NormalizerOpts<string>, "transform">;
         each?: {
-            size?: import('../../utils/make-normalizer').NormalizerOpts<"small"> | undefined;
-            color?: import('../../utils/make-normalizer').NormalizerOpts<"primary"> | undefined;
-            product?: import('../../utils/make-normalizer').NormalizerOpts<"hcp"> | undefined;
+            size?: import("../../utils/make-normalizer").NormalizerOpts<"medium" | "small" | "large"> | undefined;
+            color?: import("../../utils/make-normalizer").NormalizerOpts<"primary" | "strong"> | undefined;
+            product?: import("../../utils/make-normalizer").NormalizerOpts<"boundary" | "consul" | "nomad" | "packer" | "terraform" | "vagrant" | "vault" | "vault-radar" | "vault-secrets" | "waypoint" | "hashicorp" | "hcp" | "vault-dedicated" | "vault-enterprise"> | undefined;
         } | undefined;
     } | undefined) => {
-        size: "small";
-        color: "primary";
-        product: "hcp";
+        size: "medium" | "small" | "large";
+        color: "primary" | "strong";
+        product: "boundary" | "consul" | "nomad" | "packer" | "terraform" | "vagrant" | "vault" | "vault-radar" | "vault-secrets" | "waypoint" | "hashicorp" | "hcp" | "vault-dedicated" | "vault-enterprise";
     };
 };
 export interface ProductLogoProps {

package/patterns/related-content/index.d.ts

@@ -1,4 +1,4 @@
-import { RelatedContentProps } from './types';
+import type { RelatedContentProps } from './types';
 declare const RelatedContent: {
     ({ appearance, headline, description, cards, cta, }: RelatedContentProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;

package/patterns/related-content/types.d.ts

@@ -1,4 +1,4 @@
-import { CardPatternProps } from '../card/types';
+import type { CardPatternProps } from '../card/types';
 interface RelatedContentCtaProps {
     href: string;
     text: string;