@hortiview/default-components 1.3.0 → 1.4.1

package/dist/index.es--yyG47az-DBKBm3yD.js

@@ -0,0 +1,825 @@
+import { c as s, I as f, j as e, m as A, p as w, y as b, q as z } from "./useTranslation-B_ODv8uN.js";
+import d, { forwardRef as p, useRef as u, useImperativeHandle as m, useEffect as R } from "react";
+const j = {
+  /**
+   * Children to be rendered. Expects multiple components of a similar type.
+   *
+   * Defaults to **null**.
+   */
+  children: e.node,
+  /**
+   * The grouping direction.
+   *
+   * Defaults to **'horizontal'**.
+   */
+  direction: e.oneOf(["horizontal", "vertical", "horizontal-reverse", "vertical-reverse"]),
+  /**
+   * Sets the Group width to be 100%.
+   *
+   * Defaults to **false**.
+   */
+  fullWidth: e.bool,
+  /**
+   * How much spacing between items. Dense is 8p, standard is 16px and airy is 24px.
+   *
+   * Defaults to **'standard'**.
+   */
+  gap: e.oneOf(["dense", "standard", "airy", "none"]),
+  /**
+   * @deprecated _Renamed for improved clarity. See `gap`._
+   *
+   * How much spacing between items. Dense is 8p, standard is 16px and airy is 24px.
+   *
+   * Defaults to **undefined**.
+   */
+  padding: A(e.oneOf(["dense", "standard", "airy", "none"]), "Group", "Renamed for improved clarity. See `gap`."),
+  /**
+   * Alignment along the primary axis. 'For `horizontal` grouping this means the x-axis positioning, for `vertical`, this means the y-axis positioning.Equivalent to flexbox 'justify-content.
+   *
+   * Defaults to **'start'**.
+   */
+  primaryAlign: e.oneOf(["start", "end", "center", "space-evenly", "space-between", "space-around"]),
+  /**
+   * Alignment along the secondary axis. For horizontal grouping this means the y-axis positioning, for vertical, this means the x-axis positioning.Equivalent to flexbox 'align-items.
+   *
+   * Defaults to **'baseline'**.
+   */
+  secondaryAlign: e.oneOf(["start", "end", "center", "stretch", "baseline"])
+}, Z = {
+  children: null,
+  direction: "horizontal",
+  fullWidth: !1,
+  gap: "standard",
+  padding: void 0,
+  primaryAlign: "start",
+  secondaryAlign: "baseline"
+}, G = (i) => {
+  switch (i) {
+    case "end":
+      return "flex-end";
+    case "start":
+      return "flex-start";
+    case "center":
+      return "center";
+    case "stretch":
+      return "stretch";
+    case "baseline":
+    default:
+      return "baseline";
+  }
+}, W = (i) => {
+  switch (i) {
+    case "end":
+      return "flex-end";
+    case "center":
+      return "center";
+    case "space-evenly":
+      return "space-evenly";
+    case "space-between":
+      return "space-between";
+    case "space-around":
+      return "space-around";
+    case "start":
+    default:
+      return "flex-start";
+  }
+}, _ = (i) => {
+  switch (i) {
+    case "dense":
+      return "8px";
+    case "airy":
+      return "24px";
+    case "standard":
+      return "16px";
+    case "none":
+    default:
+      return "0px";
+  }
+}, q = (i) => {
+  switch (i) {
+    case "horizontal":
+      return "row";
+    case "vertical":
+      return "column";
+    case "horizontal-reverse":
+      return "row-reverse";
+    case "vertical-reverse":
+      return "column-reverse";
+    default:
+      return "row";
+  }
+}, E = /* @__PURE__ */ p((i, l) => {
+  const {
+    children: g,
+    className: n,
+    direction: c,
+    fullWidth: o,
+    gap: r,
+    padding: a,
+    primaryAlign: t,
+    secondaryAlign: h,
+    style: y,
+    variant: k,
+    ...T
+  } = i;
+  let N = {
+    display: "flex",
+    flexDirection: q(c),
+    justifyContent: W(t),
+    alignItems: G(h),
+    gap: _(a || r)
+  };
+  o && (N = {
+    ...N,
+    width: "100%"
+  }), N = {
+    ...N,
+    ...y
+  };
+  const I = u();
+  return m(l, () => I.current, []), /* @__PURE__ */ d.createElement("div", s({
+    ref: I,
+    className: f(
+      "lmnt",
+      "lmnt-group",
+      // variant === 'dense' && 'lmnt-button-group--dense',
+      // variant === 'standard' && 'lmnt-button-group--standard',
+      // variant === 'airy' && 'lmnt-button-group--airy',
+      n
+    ),
+    style: N
+  }, T), g);
+});
+E.displayName = "Group";
+E.propTypes = j;
+E.defaultProps = Z;
+function F(i) {
+  return i.toLowerCase();
+}
+var J = [/([a-z0-9])([A-Z])/g, /([A-Z])([A-Z][a-z])/g], K = /[^A-Z0-9]+/gi;
+function M(i, l) {
+  l === void 0 && (l = {});
+  for (var g = l.splitRegexp, n = g === void 0 ? J : g, c = l.stripRegexp, o = c === void 0 ? K : c, r = l.transform, a = r === void 0 ? F : r, t = l.delimiter, h = t === void 0 ? " " : t, y = S(S(i, n, "$1\0$2"), o, "\0"), k = 0, T = y.length; y.charAt(k) === "\0"; )
+    k++;
+  for (; y.charAt(T - 1) === "\0"; )
+    T--;
+  return y.slice(k, T).split("\0").map(a).join(h);
+}
+function S(i, l, g) {
+  return l instanceof RegExp ? i.replace(l, g) : l.reduce(function(n, c) {
+    return n.replace(c, g);
+  }, i);
+}
+function Q(i, l) {
+  return l === void 0 && (l = {}), M(i, w({ delimiter: "." }, l));
+}
+function v(i, l) {
+  return l === void 0 && (l = {}), Q(i, w({ delimiter: "-" }, l));
+}
+const U = {
+  /**
+   * If true the typography will be bold. Applies to 1body, body2, caption, subtitle1, subtitle2
+   *
+   * Defaults to **false**.
+   */
+  bold: e.bool,
+  /**
+   * Expects a string, accepts any valid markup.
+   *
+   * Defaults to **null**.
+   */
+  children: e.node,
+  /**
+   * The css class name to be passed through to the component markup.
+   *
+   * Defaults to **undefined**.
+   */
+  className: e.string,
+  /**
+   * The DOM element to display the typography.
+   *
+   * Defaults to **'span'**.
+   */
+  tag: e.oneOfType([e.string, e.elementType, e.instanceOf(d.Component)]),
+  /**
+   * Sets theme color for the typography. Does not apply to Link.
+   *
+   * Defaults to **undefined**.
+   */
+  themeColor: b(e.oneOf(["primary", "secondary", "error", "text-primary-on-background", "text-secondary-on-background", "text-hint-on-background", "text-disabled-on-background", "text-icon-on-background", "text-primary-on-light", "text-secondary-on-light", "text-hint-on-light", "text-disabled-on-light", "text-icon-on-light"]), ["textPrimaryOnBackground", "textSecondaryOnBackground", "textHintOnBackground", "textDisabledOnBackground", "textIconOnBackground", "textPrimaryOnLight", "textSecondaryOnLight", "textHintOnLight", "textDisabledOnLight", "textIconOnLight"], "Typography", "Please use one of 'primary','secondary','error','text-primary-on-background','text-secondary-on-background','text-hint-on-background','text-disabled-on-background','text-icon-on-background','text-primary-on-light','text-secondary-on-light','text-hint-on-light','text-disabled-on-light','text-icon-on-light'."),
+  /**
+   * Sets typography class for the element.
+   *
+   * Defaults to **'body1'**.
+   */
+  type: b(e.oneOf(["body1", "body1-bold", "body2", "body2-bold", "button", "caption", "caption-bold", "display1", "display2", "display3", "display4", "display5", "display6", "link", "overline", "subtitle1", "subtitle1-bold", "subtitle2", "subtitle2-bold"]), ["headline1", "headline2", "headline3", "headline4", "headline5", "headline6"], "Typography", "Please use one of 'body1','body1-bold','body2','body2-bold','button','caption','caption-bold','display1','display2','display3','display4','display5','display6','link','overline','subtitle1','subtitle1-bold','subtitle2','subtitle2-bold'.")
+}, V = {
+  bold: !1,
+  children: null,
+  className: void 0,
+  tag: "span",
+  themeColor: void 0,
+  type: "body1"
+}, X = {
+  /**
+   * If true the typography will be bold.
+   *
+   * Defaults to **false**.
+   */
+  bold: e.bool,
+  /**
+   * Expects a string, accepts any valid markup.
+   *
+   * Defaults to **null**.
+   */
+  children: e.node,
+  /**
+   * The css class name to be passed through to the component markup.
+   *
+   * Defaults to **undefined**.
+   */
+  className: e.string,
+  /**
+   * Sets font properties for body. Acceptable values range from 1 - 2. Higher levels produce smaller type.
+   *
+   * Defaults to **1**.
+   */
+  level: e.oneOf([1, 2]),
+  /**
+   * The DOM element to display the typography.
+   *
+   * Defaults to **'span'**.
+   */
+  tag: e.oneOfType([e.string, e.elementType, e.instanceOf(d.Component)]),
+  /**
+   * Sets theme color for the typography.
+   *
+   * Defaults to **undefined**.
+   */
+  themeColor: b(e.oneOf(["primary", "secondary", "error", "text-primary-on-background", "text-secondary-on-background", "text-hint-on-background", "text-disabled-on-background", "text-icon-on-background", "text-primary-on-light", "text-secondary-on-light", "text-hint-on-light", "text-disabled-on-light", "text-icon-on-light"]), ["textPrimaryOnBackground", "textSecondaryOnBackground", "textHintOnBackground", "textDisabledOnBackground", "textIconOnBackground", "textPrimaryOnLight", "textSecondaryOnLight", "textHintOnLight", "textDisabledOnLight", "textIconOnLight"], "TypoBody", "Please use one of 'primary','secondary','error','text-primary-on-background','text-secondary-on-background','text-hint-on-background','text-disabled-on-background','text-icon-on-background','text-primary-on-light','text-secondary-on-light','text-hint-on-light','text-disabled-on-light','text-icon-on-light'.")
+}, Y = {
+  bold: !1,
+  children: null,
+  className: void 0,
+  level: 1,
+  tag: "span",
+  themeColor: void 0
+}, ee = {
+  /**
+   * Expects a string, accepts any valid markup.
+   *
+   * Defaults to **null**.
+   */
+  children: e.node,
+  /**
+   * The css class name to be passed through to the component markup.
+   *
+   * Defaults to **undefined**.
+   */
+  className: e.string,
+  /**
+   * The DOM element to display the typography.
+   *
+   * Defaults to **'span'**.
+   */
+  tag: e.oneOfType([e.string, e.elementType, e.instanceOf(d.Component)]),
+  /**
+   * Sets theme color for the typography.
+   *
+   * Defaults to **undefined**.
+   */
+  themeColor: b(e.oneOf(["primary", "secondary", "error", "text-primary-on-background", "text-secondary-on-background", "text-hint-on-background", "text-disabled-on-background", "text-icon-on-background", "text-primary-on-light", "text-secondary-on-light", "text-hint-on-light", "text-disabled-on-light", "text-icon-on-light"]), ["textPrimaryOnBackground", "textSecondaryOnBackground", "textHintOnBackground", "textDisabledOnBackground", "textIconOnBackground", "textPrimaryOnLight", "textSecondaryOnLight", "textHintOnLight", "textDisabledOnLight", "textIconOnLight"], "TypoButton", "Please use one of 'primary','secondary','error','text-primary-on-background','text-secondary-on-background','text-hint-on-background','text-disabled-on-background','text-icon-on-background','text-primary-on-light','text-secondary-on-light','text-hint-on-light','text-disabled-on-light','text-icon-on-light'.")
+}, te = {
+  children: null,
+  className: void 0,
+  tag: "span",
+  themeColor: void 0
+}, ne = {
+  /**
+   * If true the typography will be bold.
+   *
+   * Defaults to **false**.
+   */
+  bold: e.bool,
+  /**
+   * Expects a string, accepts any valid markup.
+   *
+   * Defaults to **null**.
+   */
+  children: e.node,
+  /**
+   * The css class name to be passed through to the component markup.
+   *
+   * Defaults to **undefined**.
+   */
+  className: e.string,
+  /**
+   * The DOM element to display the typography.
+   *
+   * Defaults to **'span'**.
+   */
+  tag: e.oneOfType([e.string, e.elementType, e.instanceOf(d.Component)]),
+  /**
+   * Sets theme color for the typography.
+   *
+   * Defaults to **undefined**.
+   */
+  themeColor: b(e.oneOf(["primary", "secondary", "error", "text-primary-on-background", "text-secondary-on-background", "text-hint-on-background", "text-disabled-on-background", "text-icon-on-background", "text-primary-on-light", "text-secondary-on-light", "text-hint-on-light", "text-disabled-on-light", "text-icon-on-light"]), ["textPrimaryOnBackground", "textSecondaryOnBackground", "textHintOnBackground", "textDisabledOnBackground", "textIconOnBackground", "textPrimaryOnLight", "textSecondaryOnLight", "textHintOnLight", "textDisabledOnLight", "textIconOnLight"], "TypoCaption", "Please use one of 'primary','secondary','error','text-primary-on-background','text-secondary-on-background','text-hint-on-background','text-disabled-on-background','text-icon-on-background','text-primary-on-light','text-secondary-on-light','text-hint-on-light','text-disabled-on-light','text-icon-on-light'.")
+}, oe = {
+  bold: !1,
+  children: null,
+  className: void 0,
+  tag: "span",
+  themeColor: void 0
+}, re = {
+  /**
+   * Expects a string, accepts any valid markup.
+   *
+   * Defaults to **null**.
+   */
+  children: e.node,
+  /**
+   * The css class name to be passed through to the component markup.
+   *
+   * Defaults to **undefined**.
+   */
+  className: e.string,
+  /**
+   * Sets font properties for body. Acceptable values range from 1 to 6. Higher levels produce smaller type.
+   *
+   * Defaults to **1**.
+   */
+  level: e.oneOfType([e.oneOf([1, 2, 3, 4, 5, 6, "1", "2", "3", "4", "5", "6"]), e.oneOf([1, 2, 3, 4, 5, 6, "1", "2", "3", "4", "5", "6"])]),
+  /**
+   * The DOM element to display the typography.
+   *
+   * Defaults to **'span'**.
+   */
+  tag: e.oneOfType([e.string, e.elementType, e.instanceOf(d.Component)]),
+  /**
+   * Sets theme color for the typography.
+   *
+   * Defaults to **undefined**.
+   */
+  themeColor: b(e.oneOf(["primary", "secondary", "error", "text-primary-on-background", "text-secondary-on-background", "text-hint-on-background", "text-disabled-on-background", "text-icon-on-background", "text-primary-on-light", "text-secondary-on-light", "text-hint-on-light", "text-disabled-on-light", "text-icon-on-light"]), ["textPrimaryOnBackground", "textSecondaryOnBackground", "textHintOnBackground", "textDisabledOnBackground", "textIconOnBackground", "textPrimaryOnLight", "textSecondaryOnLight", "textHintOnLight", "textDisabledOnLight", "textIconOnLight"], "TypoDisplay", "Please use one of 'primary','secondary','error','text-primary-on-background','text-secondary-on-background','text-hint-on-background','text-disabled-on-background','text-icon-on-background','text-primary-on-light','text-secondary-on-light','text-hint-on-light','text-disabled-on-light','text-icon-on-light'.")
+}, ae = {
+  children: null,
+  className: void 0,
+  level: 1,
+  tag: "span",
+  themeColor: void 0
+}, ie = {
+  /**
+   * Expects a string, accepts any valid markup.
+   *
+   * Defaults to **null**.
+   */
+  children: e.node,
+  /**
+   * The css class name to be passed through to the component markup.
+   *
+   * Defaults to **undefined**.
+   */
+  className: e.string,
+  /**
+   * Sets font properties for body. Acceptable values range from 1 to 6. Higher levels produce smaller type.
+   *
+   * Defaults to **1**.
+   */
+  level: e.oneOfType([e.oneOf([1, 2, 3, 4, 5, 6, "1", "2", "3", "4", "5", "6"]), e.oneOf([1, 2, 3, 4, 5, 6, "1", "2", "3", "4", "5", "6"])]),
+  /**
+   * The DOM element to display the typography.
+   *
+   * Defaults to **'span'**.
+   */
+  tag: e.oneOfType([e.string, e.elementType, e.instanceOf(d.Component)]),
+  /**
+   * Sets theme color for the typography.
+   *
+   * Defaults to **undefined**.
+   */
+  themeColor: b(e.oneOf(["primary", "secondary", "error", "text-primary-on-background", "text-secondary-on-background", "text-hint-on-background", "text-disabled-on-background", "text-icon-on-background", "text-primary-on-light", "text-secondary-on-light", "text-hint-on-light", "text-disabled-on-light", "text-icon-on-light"]), ["textPrimaryOnBackground", "textSecondaryOnBackground", "textHintOnBackground", "textDisabledOnBackground", "textIconOnBackground", "textPrimaryOnLight", "textSecondaryOnLight", "textHintOnLight", "textDisabledOnLight", "textIconOnLight"], "TypoHeadline", "Please use one of 'primary','secondary','error','text-primary-on-background','text-secondary-on-background','text-hint-on-background','text-disabled-on-background','text-icon-on-background','text-primary-on-light','text-secondary-on-light','text-hint-on-light','text-disabled-on-light','text-icon-on-light'.")
+}, le = {
+  children: null,
+  className: void 0,
+  level: 1,
+  tag: "span",
+  themeColor: void 0
+}, de = {
+  /**
+   * Expects a string, accepts any valid markup.
+   *
+   * Defaults to **null**.
+   */
+  children: e.node,
+  /**
+   * The css class name to be passed through to the component markup.
+   *
+   * Defaults to **undefined**.
+   */
+  className: e.string,
+  /**
+   * The DOM element to display the typography.
+   *
+   * Defaults to **'a'**.
+   */
+  tag: e.oneOfType([e.string, e.elementType, e.instanceOf(d.Component)])
+}, ce = {
+  children: null,
+  className: void 0,
+  tag: "a"
+}, se = {
+  /**
+   * Expects a string, accepts any valid markup.
+   *
+   * Defaults to **null**.
+   */
+  children: e.node,
+  /**
+   * The css class name to be passed through to the component markup.
+   *
+   * Defaults to **undefined**.
+   */
+  className: e.string,
+  /**
+   * The DOM element to display the typography.
+   *
+   * Defaults to **'span'**.
+   */
+  tag: e.oneOfType([e.string, e.elementType, e.instanceOf(d.Component)]),
+  /**
+   * Sets theme color for the typography.
+   *
+   * Defaults to **undefined**.
+   */
+  themeColor: b(e.oneOf(["primary", "secondary", "error", "text-primary-on-background", "text-secondary-on-background", "text-hint-on-background", "text-disabled-on-background", "text-icon-on-background", "text-primary-on-light", "text-secondary-on-light", "text-hint-on-light", "text-disabled-on-light", "text-icon-on-light"]), ["textPrimaryOnBackground", "textSecondaryOnBackground", "textHintOnBackground", "textDisabledOnBackground", "textIconOnBackground", "textPrimaryOnLight", "textSecondaryOnLight", "textHintOnLight", "textDisabledOnLight", "textIconOnLight"], "TypoOverline", "Please use one of 'primary','secondary','error','text-primary-on-background','text-secondary-on-background','text-hint-on-background','text-disabled-on-background','text-icon-on-background','text-primary-on-light','text-secondary-on-light','text-hint-on-light','text-disabled-on-light','text-icon-on-light'.")
+}, ge = {
+  children: null,
+  className: void 0,
+  tag: "span",
+  themeColor: void 0
+}, he = {
+  /**
+   * If true the typography will be bold.
+   *
+   * Defaults to **false**.
+   */
+  bold: e.bool,
+  /**
+   * Expects a string, accepts any valid markup.
+   *
+   * Defaults to **null**.
+   */
+  children: e.node,
+  /**
+   * The css class name to be passed through to the component markup.
+   *
+   * Defaults to **undefined**.
+   */
+  className: e.string,
+  /**
+   * Sets font properties for body.
+   *
+   * Defaults to **1**.
+   */
+  level: e.oneOf([1, 2]),
+  /**
+   * The DOM element to display the typography.
+   *
+   * Defaults to **'span'**.
+   */
+  tag: e.oneOfType([e.string, e.elementType, e.instanceOf(d.Component)]),
+  /**
+   * Sets theme color for the typography.
+   *
+   * Defaults to **undefined**.
+   */
+  themeColor: b(e.oneOf(["primary", "secondary", "error", "text-primary-on-background", "text-secondary-on-background", "text-hint-on-background", "text-disabled-on-background", "text-icon-on-background", "text-primary-on-light", "text-secondary-on-light", "text-hint-on-light", "text-disabled-on-light", "text-icon-on-light"]), ["textPrimaryOnBackground", "textSecondaryOnBackground", "textHintOnBackground", "textDisabledOnBackground", "textIconOnBackground", "textPrimaryOnLight", "textSecondaryOnLight", "textHintOnLight", "textDisabledOnLight", "textIconOnLight"], "TypoSubtitle", "Please use one of 'primary','secondary','error','text-primary-on-background','text-secondary-on-background','text-hint-on-background','text-disabled-on-background','text-icon-on-background','text-primary-on-light','text-secondary-on-light','text-hint-on-light','text-disabled-on-light','text-icon-on-light'.")
+}, ye = {
+  bold: !1,
+  children: null,
+  className: void 0,
+  level: 1,
+  tag: "span",
+  themeColor: void 0
+}, O = /* @__PURE__ */ p((i, l) => {
+  const {
+    className: g,
+    children: n,
+    themeColor: c,
+    level: o,
+    bold: r,
+    tag: a,
+    ...t
+  } = i, h = u();
+  m(l, () => h.current, []);
+  const y = f("mdc-typography", `lmnt mdc-typography--body${o}`, r && `mdc-typography--body${o}-bold`, c && `mdc-theme--${v(c)}`, g), k = a;
+  return /* @__PURE__ */ d.createElement(k, s({
+    className: y
+  }, t, {
+    ref: h
+  }), n);
+});
+O.displayName = "TypoBody";
+O.propTypes = X;
+O.defaultProps = Y;
+const L = /* @__PURE__ */ p((i, l) => {
+  const {
+    className: g,
+    children: n,
+    themeColor: c,
+    tag: o,
+    ...r
+  } = i, a = f("mdc-typography", "lmnt mdc-typography--button", c && `mdc-theme--${v(c)}`, g), t = u();
+  m(l, () => t.current, []);
+  const h = o;
+  return /* @__PURE__ */ d.createElement(h, s({
+    ref: t,
+    className: a
+  }, r), n);
+});
+L.displayName = "TypoButton";
+L.propTypes = ee;
+L.defaultProps = te;
+const B = /* @__PURE__ */ p((i, l) => {
+  const {
+    className: g,
+    children: n,
+    themeColor: c,
+    tag: o,
+    bold: r,
+    ...a
+  } = i, t = f("mdc-typography", "lmnt mdc-typography--caption", r && "mdc-typography--caption-bold", c && `mdc-theme--${v(c)}`, g), h = u();
+  m(l, () => h.current, []);
+  const y = o;
+  return /* @__PURE__ */ d.createElement(y, s({
+    ref: h,
+    className: t
+  }, a), n);
+});
+B.displayName = "TypoCaption";
+B.propTypes = ne;
+B.defaultProps = oe;
+const x = /* @__PURE__ */ p((i, l) => {
+  const {
+    className: g,
+    children: n,
+    themeColor: c,
+    level: o,
+    tag: r,
+    ...a
+  } = i, t = f("mdc-typography", `lmnt mdc-typography--headline${o}`, c && `mdc-theme--${v(c)}`, g), h = u();
+  m(l, () => h.current, []);
+  const y = r;
+  return /* @__PURE__ */ d.createElement(y, s({
+    ref: h,
+    className: t
+  }, a), n);
+});
+x.displayName = "TypoDisplay";
+x.propTypes = re;
+x.defaultProps = ae;
+const D = /* @__PURE__ */ p((i, l) => {
+  const {
+    className: g,
+    children: n,
+    themeColor: c,
+    level: o,
+    tag: r,
+    ...a
+  } = i;
+  R(() => z("TypoHeadline", "This component is being replaced with TypoDisplay and will be removed in a future version.  Please use TypoDisplay instead."), []);
+  const t = f("mdc-typography", `lmnt mdc-typography--headline${o}`, c && `mdc-theme--${v(c)}`, g), h = u();
+  m(l, () => h.current, []);
+  const y = r;
+  return /* @__PURE__ */ d.createElement(y, s({
+    ref: h,
+    className: t
+  }, a), n);
+});
+D.displayName = "TypoHeadline";
+D.propTypes = ie;
+D.defaultProps = le;
+const H = /* @__PURE__ */ p((i, l) => {
+  const {
+    className: g,
+    children: n,
+    themeColor: c,
+    tag: o,
+    ...r
+  } = i, a = f("mdc-typography lmnt-theme-link", c && `mdc-theme--${v(c)}`, g), t = u();
+  m(l, () => t.current, []);
+  const h = o;
+  return /* @__PURE__ */ d.createElement(h, s({
+    ref: t,
+    className: a
+  }, r), n);
+});
+H.displayName = "TypoLink";
+H.propTypes = de;
+H.defaultProps = ce;
+const P = /* @__PURE__ */ p((i, l) => {
+  const {
+    className: g,
+    children: n,
+    themeColor: c,
+    tag: o,
+    ...r
+  } = i, a = f("mdc-typography", "lmnt mdc-typography--overline", c && `mdc-theme--${v(c)}`, g), t = u();
+  m(l, () => t.current, []);
+  const h = o;
+  return /* @__PURE__ */ d.createElement(h, s({
+    ref: t,
+    className: a
+  }, r), n);
+});
+P.displayName = "TypoOverline";
+P.propTypes = se;
+P.defaultProps = ge;
+const C = /* @__PURE__ */ p((i, l) => {
+  const {
+    className: g,
+    children: n,
+    themeColor: c,
+    level: o,
+    tag: r,
+    bold: a,
+    ...t
+  } = i, h = f("mdc-typography", `lmnt mdc-typography--subtitle${o || ""}`, a && `mdc-typography--subtitle${o}-bold`, c && `mdc-theme--${v(c)}`, g), y = u();
+  m(l, () => y.current, []);
+  const k = r;
+  return /* @__PURE__ */ d.createElement(k, s({
+    ref: y,
+    className: h
+  }, t), n);
+});
+C.displayName = "TypoSubtitle";
+C.propTypes = he;
+C.defaultProps = ye;
+const $ = /* @__PURE__ */ p((i, l) => {
+  const {
+    bold: g,
+    children: n,
+    type: c,
+    themeColor: o,
+    tag: r,
+    ...a
+  } = i, t = u();
+  switch (m(l, () => t.current, []), c) {
+    case "body1":
+      return /* @__PURE__ */ d.createElement(O, s({
+        level: 1,
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a), n);
+    case "body1-bold":
+      return /* @__PURE__ */ d.createElement(O, s({
+        bold: !0,
+        level: 1,
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a), n);
+    case "body2-bold":
+      return /* @__PURE__ */ d.createElement(O, s({
+        bold: !0,
+        level: 2,
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a), n);
+    case "body2":
+      return /* @__PURE__ */ d.createElement(O, s({
+        level: 2,
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a), n);
+    case "button":
+      return /* @__PURE__ */ d.createElement(L, s({
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a), n);
+    case "caption":
+      return /* @__PURE__ */ d.createElement(B, s({
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a), n);
+    case "caption-bold":
+      return /* @__PURE__ */ d.createElement(B, s({
+        bold: !0,
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a), n);
+    case "display1":
+    case "headline1":
+      return /* @__PURE__ */ d.createElement(x, s({
+        level: 1,
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a), n);
+    case "display2":
+    case "headline2":
+      return /* @__PURE__ */ d.createElement(x, s({
+        level: 2,
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a), n);
+    case "display3":
+    case "headline3":
+      return /* @__PURE__ */ d.createElement(x, s({
+        level: 3,
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a), n);
+    case "display4":
+    case "headline4":
+      return /* @__PURE__ */ d.createElement(x, s({
+        level: 4,
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a), n);
+    case "display5":
+    case "headline5":
+      return /* @__PURE__ */ d.createElement(x, s({
+        level: 5,
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a), n);
+    case "display6":
+    case "headline6":
+      return /* @__PURE__ */ d.createElement(x, s({
+        level: 6,
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a), n);
+    case "overline":
+      return /* @__PURE__ */ d.createElement(P, s({
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a), n);
+    case "subtitle1":
+      return /* @__PURE__ */ d.createElement(C, s({
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a, {
+        level: 1
+      }), n);
+    case "subtitle1-bold":
+      return /* @__PURE__ */ d.createElement(C, s({
+        bold: !0,
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a, {
+        level: 1
+      }), n);
+    case "subtitle2-bold":
+      return /* @__PURE__ */ d.createElement(C, s({
+        bold: !0,
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a, {
+        level: 2
+      }), n);
+    case "subtitle2":
+      return /* @__PURE__ */ d.createElement(C, s({
+        level: 2,
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a), n);
+    default:
+      return /* @__PURE__ */ d.createElement(O, s({
+        tag: r,
+        ref: t,
+        themeColor: o
+      }, a, {
+        level: 1
+      }), n);
+  }
+});
+$.displayName = "Typography";
+$.propTypes = U;
+$.defaultProps = V;
+export {
+  C,
+  $ as D,
+  B as P,
+  O as f,
+  x as h,
+  E as n
+};