@hortiview/default-components 1.4.0 → 1.4.2

package/dist/{index.es--yyG47az-DBKBm3yD.js → index.es-BGordhUK-C36NK84Q.js}

@@ -1,30 +1,30 @@
-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 = {
+import { r as O, h as y, e as B, Z as V, c as de, p as q, f as le, v as ce, s as ee, X as se, a as K, b as ge, t, m as he, j as te, Y as T, ah as xe } from "./useTranslation-CVaIJbcK.js";
+import g, { forwardRef as k, useRef as P, useImperativeHandle as C, useEffect as ue } from "react";
+var ye = {
   /**
    * Children to be rendered. Expects multiple components of a similar type.
    *
    * Defaults to **null**.
    */
-  children: e.node,
+  children: t.node,
   /**
    * The grouping direction.
    *
    * Defaults to **'horizontal'**.
    */
-  direction: e.oneOf(["horizontal", "vertical", "horizontal-reverse", "vertical-reverse"]),
+  direction: t.oneOf(["horizontal", "vertical", "horizontal-reverse", "vertical-reverse"]),
   /**
    * Sets the Group width to be 100%.
    *
    * Defaults to **false**.
    */
-  fullWidth: e.bool,
+  fullWidth: t.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"]),
+  gap: t.oneOf(["dense", "standard", "airy", "none"]),
   /**
    * @deprecated _Renamed for improved clarity. See `gap`._
    *
@@ -32,29 +32,58 @@ const j = {
    *
    * Defaults to **undefined**.
    */
-  padding: A(e.oneOf(["dense", "standard", "airy", "none"]), "Group", "Renamed for improved clarity. See `gap`."),
+  padding: he(t.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"]),
+  primaryAlign: t.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 = {
+  secondaryAlign: t.oneOf(["start", "end", "center", "stretch", "baseline"]),
+  /**
+   * Styles for the grid.
+   *
+   * Defaults to **undefined**.
+   */
+  style: t.object
+}, pe = {
   children: null,
   direction: "horizontal",
   fullWidth: !1,
   gap: "standard",
   padding: void 0,
   primaryAlign: "start",
-  secondaryAlign: "baseline"
-}, G = (i) => {
-  switch (i) {
+  secondaryAlign: "baseline",
+  style: void 0
+}, me = ["children", "className", "direction", "fullWidth", "gap", "padding", "primaryAlign", "secondaryAlign", "style"];
+function M(e, r) {
+  var i = se(e);
+  if (K) {
+    var n = K(e);
+    r && (n = ge(n).call(n, function(d) {
+      return ee(e, d).enumerable;
+    })), i.push.apply(i, n);
+  }
+  return i;
+}
+function _(e) {
+  for (var r = 1; r < arguments.length; r++) {
+    var i, n, d = arguments[r] != null ? arguments[r] : {};
+    r % 2 ? V(i = M(Object(d), !0)).call(i, function(p) {
+      de(e, p, d[p]);
+    }) : q ? le(e, q(d)) : V(n = M(Object(d))).call(n, function(p) {
+      ce(e, p, ee(d, p));
+    });
+  }
+  return e;
+}
+var N = pe, fe = function(e) {
+  switch (e) {
     case "end":
       return "flex-end";
     case "start":
@@ -67,8 +96,8 @@ const j = {
     default:
       return "baseline";
   }
-}, W = (i) => {
-  switch (i) {
+}, be = function(e) {
+  switch (e) {
     case "end":
       return "flex-end";
     case "center":
@@ -83,8 +112,8 @@ const j = {
     default:
       return "flex-start";
   }
-}, _ = (i) => {
-  switch (i) {
+}, ve = function(e) {
+  switch (e) {
     case "dense":
       return "8px";
     case "airy":
@@ -95,8 +124,8 @@ const j = {
     default:
       return "0px";
   }
-}, q = (i) => {
-  switch (i) {
+}, Oe = function(e) {
+  switch (e) {
     case "horizontal":
       return "row";
     case "vertical":
@@ -108,718 +137,724 @@ const j = {
     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 = {
+}, ne = /* @__PURE__ */ k(function(e, r) {
+  var i = e.children, n = i === void 0 ? N.children : i, d = e.className, p = d === void 0 ? N.className : d, x = e.direction, o = x === void 0 ? N.direction : x, u = e.fullWidth, c = u === void 0 ? N.fullWidth : u, h = e.gap, l = h === void 0 ? N.gap : h, a = e.padding, s = a === void 0 ? N.padding : a, m = e.primaryAlign, f = m === void 0 ? N.primaryAlign : m, b = e.secondaryAlign, v = b === void 0 ? N.secondaryAlign : b, D = e.style, $ = D === void 0 ? N.style : D, ie = O(e, me), R = {
     display: "flex",
-    flexDirection: q(c),
-    justifyContent: W(t),
-    alignItems: G(h),
-    gap: _(a || r)
+    flexDirection: Oe(o),
+    justifyContent: be(f),
+    alignItems: fe(v),
+    gap: ve(s || l)
   };
-  o && (N = {
-    ...N,
+  c && (R = _(_({}, R), {}, {
     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);
+  })), R = _(_({}, R), $);
+  var U = P();
+  return C(r, function() {
+    return U.current;
+  }, []), /* @__PURE__ */ g.createElement("div", y({
+    ref: U,
+    className: B("lmnt", "lmnt-group", p),
+    style: R
+  }, ie), n);
 });
-E.displayName = "Group";
-E.propTypes = j;
-E.defaultProps = Z;
-function F(i) {
-  return i.toLowerCase();
+ne.displayName = "Group";
+ne.propTypes = ye;
+function ke(e) {
+  return e.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);
+var Pe = [/([a-z0-9])([A-Z])/g, /([A-Z])([A-Z][a-z])/g], Ce = /[^A-Z0-9]+/gi;
+function Ne(e, r) {
+  r === void 0 && (r = {});
+  for (var i = r.splitRegexp, n = i === void 0 ? Pe : i, d = r.stripRegexp, p = d === void 0 ? Ce : d, x = r.transform, o = x === void 0 ? ke : x, u = r.delimiter, c = u === void 0 ? " " : u, h = Q(Q(e, n, "$1\0$2"), p, "\0"), l = 0, a = h.length; h.charAt(l) === "\0"; )
+    l++;
+  for (; h.charAt(a - 1) === "\0"; )
+    a--;
+  return h.slice(l, a).split("\0").map(o).join(c);
 }
-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(e, r, i) {
+  return r instanceof RegExp ? e.replace(r, i) : r.reduce(function(n, d) {
+    return n.replace(d, i);
+  }, e);
 }
-function Q(i, l) {
-  return l === void 0 && (l = {}), M(i, w({ delimiter: "." }, l));
+function Te(e, r) {
+  return r === void 0 && (r = {}), Ne(e, te({ delimiter: "." }, r));
 }
-function v(i, l) {
-  return l === void 0 && (l = {}), Q(i, w({ delimiter: "-" }, l));
+function E(e, r) {
+  return r === void 0 && (r = {}), Te(e, te({ delimiter: "-" }, r));
 }
-const U = {
+var Be = {
   /**
    * If true the typography will be bold. Applies to 1body, body2, caption, subtitle1, subtitle2
    *
    * Defaults to **false**.
    */
-  bold: e.bool,
+  bold: t.bool,
   /**
    * Expects a string, accepts any valid markup.
    *
    * Defaults to **null**.
    */
-  children: e.node,
+  children: t.node,
   /**
    * The css class name to be passed through to the component markup.
    *
    * Defaults to **undefined**.
    */
-  className: e.string,
+  className: t.string,
+  /**
+   * Forces consistent padding when using different html tags.
+   *
+   * Defaults to **false**.
+   */
+  fixedPadding: t.bool,
   /**
    * The DOM element to display the typography.
    *
    * Defaults to **'span'**.
    */
-  tag: e.oneOfType([e.string, e.elementType, e.instanceOf(d.Component)]),
+  tag: t.oneOfType([t.string, t.elementType, t.instanceOf(g.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'."),
+  themeColor: T(t.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,
+  type: T(t.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'.")
+}, Le = {
   children: null,
-  className: void 0,
+  fixedPadding: !1,
   tag: "span",
   themeColor: void 0,
   type: "body1"
-}, X = {
+}, Ee = {
   /**
    * If true the typography will be bold.
    *
    * Defaults to **false**.
    */
-  bold: e.bool,
+  bold: t.bool,
   /**
    * Expects a string, accepts any valid markup.
    *
    * Defaults to **null**.
    */
-  children: e.node,
+  children: t.node,
   /**
    * The css class name to be passed through to the component markup.
    *
    * Defaults to **undefined**.
    */
-  className: e.string,
+  className: t.string,
+  /**
+   * Forces consistent padding when using different html tags.
+   *
+   * Defaults to **false**.
+   */
+  fixedPadding: t.bool,
   /**
    * Sets font properties for body. Acceptable values range from 1 - 2. Higher levels produce smaller type.
    *
    * Defaults to **1**.
    */
-  level: e.oneOf([1, 2]),
+  level: t.oneOf([1, 2]),
   /**
    * The DOM element to display the typography.
    *
    * Defaults to **'span'**.
    */
-  tag: e.oneOfType([e.string, e.elementType, e.instanceOf(d.Component)]),
+  tag: t.oneOfType([t.string, t.elementType, t.instanceOf(g.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 = {
+  themeColor: T(t.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'.")
+}, De = {
   bold: !1,
   children: null,
   className: void 0,
+  fixedPadding: !1,
   level: 1,
   tag: "span",
   themeColor: void 0
-}, ee = {
+}, He = {
   /**
    * Expects a string, accepts any valid markup.
    *
    * Defaults to **null**.
    */
-  children: e.node,
+  children: t.node,
   /**
    * The css class name to be passed through to the component markup.
    *
    * Defaults to **undefined**.
    */
-  className: e.string,
+  className: t.string,
+  /**
+   * Forces consistent padding when using different html tags.
+   *
+   * Defaults to **false**.
+   */
+  fixedPadding: t.bool,
   /**
    * The DOM element to display the typography.
    *
    * Defaults to **'span'**.
    */
-  tag: e.oneOfType([e.string, e.elementType, e.instanceOf(d.Component)]),
+  tag: t.oneOfType([t.string, t.elementType, t.instanceOf(g.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 = {
+  themeColor: T(t.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'.")
+}, Se = {
   children: null,
   className: void 0,
+  fixedPadding: !1,
   tag: "span",
   themeColor: void 0
-}, ne = {
+}, Ie = {
   /**
    * If true the typography will be bold.
    *
    * Defaults to **false**.
    */
-  bold: e.bool,
+  bold: t.bool,
   /**
    * Expects a string, accepts any valid markup.
    *
    * Defaults to **null**.
    */
-  children: e.node,
+  children: t.node,
   /**
    * The css class name to be passed through to the component markup.
    *
    * Defaults to **undefined**.
    */
-  className: e.string,
+  className: t.string,
+  /**
+   * Forces consistent padding when using different html tags.
+   *
+   * Defaults to **false**.
+   */
+  fixedPadding: t.bool,
   /**
    * The DOM element to display the typography.
    *
    * Defaults to **'span'**.
    */
-  tag: e.oneOfType([e.string, e.elementType, e.instanceOf(d.Component)]),
+  tag: t.oneOfType([t.string, t.elementType, t.instanceOf(g.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 = {
+  themeColor: T(t.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'.")
+}, we = {
   bold: !1,
   children: null,
   className: void 0,
+  fixedPadding: !1,
   tag: "span",
   themeColor: void 0
-}, re = {
+}, Ae = {
   /**
    * Expects a string, accepts any valid markup.
    *
    * Defaults to **null**.
    */
-  children: e.node,
+  children: t.node,
   /**
    * The css class name to be passed through to the component markup.
    *
    * Defaults to **undefined**.
    */
-  className: e.string,
+  className: t.string,
+  /**
+   * Forces consistent padding when using different html tags.
+   *
+   * Defaults to **false**.
+   */
+  fixedPadding: t.bool,
   /**
    * 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"])]),
+  level: t.oneOfType([t.oneOf([1, 2, 3, 4, 5, 6, "1", "2", "3", "4", "5", "6"]), t.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)]),
+  tag: t.oneOfType([t.string, t.elementType, t.instanceOf(g.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 = {
+  themeColor: T(t.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'.")
+}, je = {
   children: null,
   className: void 0,
+  fixedPadding: !1,
   level: 1,
   tag: "span",
   themeColor: void 0
-}, ie = {
+}, ze = {
   /**
    * Expects a string, accepts any valid markup.
    *
    * Defaults to **null**.
    */
-  children: e.node,
+  children: t.node,
   /**
    * The css class name to be passed through to the component markup.
    *
    * Defaults to **undefined**.
    */
-  className: e.string,
+  className: t.string,
+  /**
+   * Forces consistent padding when using different html tags.
+   *
+   * Defaults to **false**.
+   */
+  fixedPadding: t.bool,
   /**
    * 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"])]),
+  level: t.oneOfType([t.oneOf([1, 2, 3, 4, 5, 6, "1", "2", "3", "4", "5", "6"]), t.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)]),
+  tag: t.oneOfType([t.string, t.elementType, t.instanceOf(g.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 = {
+  themeColor: T(t.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'.")
+}, $e = {
   children: null,
   className: void 0,
+  fixedPadding: !1,
   level: 1,
   tag: "span",
   themeColor: void 0
-}, de = {
+}, Re = {
   /**
    * Expects a string, accepts any valid markup.
    *
    * Defaults to **null**.
    */
-  children: e.node,
+  children: t.node,
   /**
    * The css class name to be passed through to the component markup.
    *
    * Defaults to **undefined**.
    */
-  className: e.string,
+  className: t.string,
+  /**
+   * Forces consistent padding when using different html tags.
+   *
+   * Defaults to **false**.
+   */
+  fixedPadding: t.bool,
   /**
    * The DOM element to display the typography.
    *
    * Defaults to **'a'**.
    */
-  tag: e.oneOfType([e.string, e.elementType, e.instanceOf(d.Component)])
-}, ce = {
+  tag: t.oneOfType([t.string, t.elementType, t.instanceOf(g.Component)])
+}, Ze = {
   children: null,
   className: void 0,
+  fixedPadding: !1,
   tag: "a"
-}, se = {
+}, We = {
   /**
    * Expects a string, accepts any valid markup.
    *
    * Defaults to **null**.
    */
-  children: e.node,
+  children: t.node,
   /**
    * The css class name to be passed through to the component markup.
    *
    * Defaults to **undefined**.
    */
-  className: e.string,
+  className: t.string,
+  /**
+   * Forces consistent padding when using different html tags.
+   *
+   * Defaults to **false**.
+   */
+  fixedPadding: t.bool,
   /**
    * The DOM element to display the typography.
    *
    * Defaults to **'span'**.
    */
-  tag: e.oneOfType([e.string, e.elementType, e.instanceOf(d.Component)]),
+  tag: t.oneOfType([t.string, t.elementType, t.instanceOf(g.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 = {
+  themeColor: T(t.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'.")
+}, Xe = {
   children: null,
   className: void 0,
+  fixedPadding: !1,
   tag: "span",
   themeColor: void 0
-}, he = {
+}, Ge = {
   /**
    * If true the typography will be bold.
    *
    * Defaults to **false**.
    */
-  bold: e.bool,
+  bold: t.bool,
   /**
    * Expects a string, accepts any valid markup.
    *
    * Defaults to **null**.
    */
-  children: e.node,
+  children: t.node,
   /**
    * The css class name to be passed through to the component markup.
    *
    * Defaults to **undefined**.
    */
-  className: e.string,
+  className: t.string,
+  /**
+   * Forces consistent padding when using different html tags.
+   *
+   * Defaults to **false**.
+   */
+  fixedPadding: t.bool,
   /**
    * Sets font properties for body.
    *
    * Defaults to **1**.
    */
-  level: e.oneOf([1, 2]),
+  level: t.oneOf([1, 2]),
   /**
    * The DOM element to display the typography.
    *
    * Defaults to **'span'**.
    */
-  tag: e.oneOfType([e.string, e.elementType, e.instanceOf(d.Component)]),
+  tag: t.oneOfType([t.string, t.elementType, t.instanceOf(g.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 = {
+  themeColor: T(t.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'.")
+}, _e = {
   bold: !1,
   children: null,
   className: void 0,
+  fixedPadding: !1,
   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);
+}, Ye = ["className", "children", "themeColor", "level", "bold", "tag", "fixedPadding"], H = De, I = /* @__PURE__ */ k(function(e, r) {
+  var i = e.className, n = i === void 0 ? H.className : i, d = e.children, p = d === void 0 ? H.children : d, x = e.themeColor, o = x === void 0 ? H.themeColor : x, u = e.level, c = u === void 0 ? H.level : u, h = e.bold, l = h === void 0 ? H.bold : h, a = e.tag, s = a === void 0 ? H.tag : a, m = e.fixedPadding, f = m === void 0 ? H.fixedPadding : m, b = O(e, Ye), v = P();
+  C(r, function() {
+    return v.current;
+  }, []);
+  var D = s, $ = B("mdc-typography", "lmnt mdc-typography--body".concat(c), f && "typography--fixed-padding", l && "mdc-typography--body".concat(c, "-bold"), o && "mdc-theme--".concat(E(o)), n);
+  return /* @__PURE__ */ g.createElement(D, y({
+    className: $
+  }, b, {
+    ref: v
+  }), p);
 });
-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);
+I.displayName = "TypoBody";
+I.propTypes = Ee;
+var Fe = ["className", "children", "themeColor", "fixedPadding", "tag"], Z = Se, F = /* @__PURE__ */ k(function(e, r) {
+  var i = e.className, n = i === void 0 ? Z.className : i, d = e.children, p = d === void 0 ? Z.children : d, x = e.themeColor, o = x === void 0 ? Z.themeColor : x, u = e.fixedPadding, c = u === void 0 ? Z.fixedPadding : u, h = e.tag, l = h === void 0 ? Z.tag : h, a = O(e, Fe), s = B("mdc-typography", "lmnt mdc-typography--button", c && "typography--fixed-padding", o && "mdc-theme--".concat(E(o)), n), m = P();
+  C(r, function() {
+    return m.current;
+  }, []);
+  var f = l;
+  return /* @__PURE__ */ g.createElement(f, y({
+    ref: m,
+    className: s
+  }, a), p);
 });
-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);
+F.displayName = "TypoButton";
+F.propTypes = He;
+var Je = ["className", "children", "themeColor", "tag", "bold", "fixedPadding"], w = we, Y = /* @__PURE__ */ k(function(e, r) {
+  var i = e.className, n = i === void 0 ? w.className : i, d = e.children, p = d === void 0 ? w.children : d, x = e.themeColor, o = x === void 0 ? w.themeColor : x, u = e.tag, c = u === void 0 ? w.tag : u, h = e.bold, l = h === void 0 ? w.bold : h, a = e.fixedPadding, s = a === void 0 ? w.fixedPadding : a, m = O(e, Je), f = B("mdc-typography", "lmnt mdc-typography--caption", s && "typography--fixed-padding", l && "mdc-typography--caption-bold", o && "mdc-theme--".concat(E(o)), n), b = P();
+  C(r, function() {
+    return b.current;
+  }, []);
+  var v = c;
+  return /* @__PURE__ */ g.createElement(v, y({
+    ref: b,
+    className: f
+  }, m), p);
 });
-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);
+Y.displayName = "TypoCaption";
+Y.propTypes = Ie;
+var Ue = ["className", "children", "themeColor", "level", "tag", "fixedPadding"], A = je, L = /* @__PURE__ */ k(function(e, r) {
+  var i = e.className, n = i === void 0 ? A.className : i, d = e.children, p = d === void 0 ? A.children : d, x = e.themeColor, o = x === void 0 ? A.themeColor : x, u = e.level, c = u === void 0 ? A.level : u, h = e.tag, l = h === void 0 ? A.tag : h, a = e.fixedPadding, s = a === void 0 ? A.fixedPadding : a, m = O(e, Ue), f = P();
+  C(r, function() {
+    return f.current;
+  }, []);
+  var b = l, v = B("mdc-typography", "lmnt mdc-typography--headline".concat(c), s && "typography--fixed-padding", o && "mdc-theme--".concat(E(o)), s && "typography--fixed-padding", n);
+  return /* @__PURE__ */ g.createElement(b, y({
+    ref: f,
+    className: v
+  }, m), p);
 });
-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);
+L.displayName = "TypoDisplay";
+L.propTypes = Ae;
+var Ve = ["className", "children", "themeColor", "fixedPadding", "level", "tag"], j = $e, oe = /* @__PURE__ */ k(function(e, r) {
+  var i = e.className, n = i === void 0 ? j.className : i, d = e.children, p = d === void 0 ? j.children : d, x = e.themeColor, o = x === void 0 ? j.themeColor : x, u = e.fixedPadding, c = u === void 0 ? j.fixedPadding : u, h = e.level, l = h === void 0 ? j.level : h, a = e.tag, s = a === void 0 ? j.tag : a, m = O(e, Ve);
+  ue(function() {
+    return xe("TypoHeadline", "This component is being replaced with TypoDisplay and will be removed in a future version.  Please use TypoDisplay instead.");
+  }, []);
+  var f = B("mdc-typography", "lmnt mdc-typography--headline".concat(l), c && "typography--fixed-padding", o && "mdc-theme--".concat(E(o)), n), b = P();
+  C(r, function() {
+    return b.current;
+  }, []);
+  var v = s;
+  return /* @__PURE__ */ g.createElement(v, y({
+    ref: b,
+    className: f
+  }, m), p);
 });
-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);
+oe.displayName = "TypoHeadline";
+oe.propTypes = ze;
+var qe = ["className", "children", "themeColor", "fixedPadding", "tag"], W = Ze, ae = /* @__PURE__ */ k(function(e, r) {
+  var i = e.className, n = i === void 0 ? W.className : i, d = e.children, p = d === void 0 ? W.children : d, x = e.themeColor, o = x === void 0 ? W.themeColor : x, u = e.fixedPadding, c = u === void 0 ? W.fixedPadding : u, h = e.tag, l = h === void 0 ? W.tag : h, a = O(e, qe), s = B("mdc-typography lmnt-theme-link", c && "typography--fixed-padding", o && "mdc-theme--".concat(E(o)), n), m = P();
+  C(r, function() {
+    return m.current;
+  }, []);
+  var f = l;
+  return /* @__PURE__ */ g.createElement(f, y({
+    ref: m,
+    className: s
+  }, a), p);
 });
-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);
+ae.displayName = "TypoLink";
+ae.propTypes = Re;
+var Ke = ["className", "children", "themeColor", "fixedPadding", "tag"], X = Xe, J = /* @__PURE__ */ k(function(e, r) {
+  var i = e.className, n = i === void 0 ? X.className : i, d = e.children, p = d === void 0 ? X.children : d, x = e.themeColor, o = x === void 0 ? X.themeColor : x, u = e.fixedPadding, c = u === void 0 ? X.fixedPadding : u, h = e.tag, l = h === void 0 ? X.tag : h, a = O(e, Ke), s = B("mdc-typography", "lmnt mdc-typography--overline", c && "typography--fixed-padding", o && "mdc-theme--".concat(E(o)), n), m = P();
+  C(r, function() {
+    return m.current;
+  }, []);
+  var f = l;
+  return /* @__PURE__ */ g.createElement(f, y({
+    ref: m,
+    className: s
+  }, a), p);
 });
-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);
+J.displayName = "TypoOverline";
+J.propTypes = We;
+var Me = ["className", "children", "themeColor", "fixedPadding", "level", "tag", "bold"], S = _e, z = /* @__PURE__ */ k(function(e, r) {
+  var i = e.className, n = i === void 0 ? S.className : i, d = e.children, p = d === void 0 ? S.children : d, x = e.themeColor, o = x === void 0 ? S.themeColor : x, u = e.fixedPadding, c = u === void 0 ? S.fixedPadding : u, h = e.level, l = h === void 0 ? S.level : h, a = e.tag, s = a === void 0 ? S.tag : a, m = e.bold, f = m === void 0 ? S.bold : m, b = O(e, Me), v = B("mdc-typography", "lmnt mdc-typography--subtitle".concat(l || ""), c && "typography--fixed-padding", f && "mdc-typography--subtitle".concat(l || "", "-bold"), o && "mdc-theme--".concat(E(o)), n), D = P();
+  C(r, function() {
+    return D.current;
+  }, []);
+  var $ = s;
+  return /* @__PURE__ */ g.createElement($, y({
+    ref: D,
+    className: v
+  }, b), p);
 });
-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) {
+z.displayName = "TypoSubtitle";
+z.propTypes = Ge;
+var Qe = ["bold", "children", "type", "themeColor", "fixedPadding", "tag"], G = Le, re = /* @__PURE__ */ k(function(e, r) {
+  e.bold;
+  var i = e.children, n = i === void 0 ? G.children : i, d = e.type, p = d === void 0 ? G.type : d, x = e.themeColor, o = x === void 0 ? G.themeColor : x, u = e.fixedPadding, c = u === void 0 ? G.fixedPadding : u, h = e.tag, l = h === void 0 ? G.tag : h, a = O(e, Qe), s = P();
+  switch (C(r, function() {
+    return s.current;
+  }, []), p) {
     case "body1":
-      return /* @__PURE__ */ d.createElement(O, s({
+      return /* @__PURE__ */ g.createElement(I, y({
         level: 1,
-        tag: r,
-        ref: t,
+        tag: l,
+        ref: s,
         themeColor: o
       }, a), n);
     case "body1-bold":
-      return /* @__PURE__ */ d.createElement(O, s({
+      return /* @__PURE__ */ g.createElement(I, y({
         bold: !0,
         level: 1,
-        tag: r,
-        ref: t,
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a), n);
     case "body2-bold":
-      return /* @__PURE__ */ d.createElement(O, s({
+      return /* @__PURE__ */ g.createElement(I, y({
         bold: !0,
         level: 2,
-        tag: r,
-        ref: t,
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a), n);
     case "body2":
-      return /* @__PURE__ */ d.createElement(O, s({
+      return /* @__PURE__ */ g.createElement(I, y({
         level: 2,
-        tag: r,
-        ref: t,
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a), n);
     case "button":
-      return /* @__PURE__ */ d.createElement(L, s({
-        tag: r,
-        ref: t,
+      return /* @__PURE__ */ g.createElement(F, y({
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a), n);
     case "caption":
-      return /* @__PURE__ */ d.createElement(B, s({
-        tag: r,
-        ref: t,
+      return /* @__PURE__ */ g.createElement(Y, y({
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a), n);
     case "caption-bold":
-      return /* @__PURE__ */ d.createElement(B, s({
+      return /* @__PURE__ */ g.createElement(Y, y({
         bold: !0,
-        tag: r,
-        ref: t,
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a), n);
     case "display1":
     case "headline1":
-      return /* @__PURE__ */ d.createElement(x, s({
+      return /* @__PURE__ */ g.createElement(L, y({
         level: 1,
-        tag: r,
-        ref: t,
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a), n);
     case "display2":
     case "headline2":
-      return /* @__PURE__ */ d.createElement(x, s({
+      return /* @__PURE__ */ g.createElement(L, y({
         level: 2,
-        tag: r,
-        ref: t,
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a), n);
     case "display3":
     case "headline3":
-      return /* @__PURE__ */ d.createElement(x, s({
+      return /* @__PURE__ */ g.createElement(L, y({
         level: 3,
-        tag: r,
-        ref: t,
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a), n);
     case "display4":
     case "headline4":
-      return /* @__PURE__ */ d.createElement(x, s({
+      return /* @__PURE__ */ g.createElement(L, y({
         level: 4,
-        tag: r,
-        ref: t,
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a), n);
     case "display5":
     case "headline5":
-      return /* @__PURE__ */ d.createElement(x, s({
+      return /* @__PURE__ */ g.createElement(L, y({
         level: 5,
-        tag: r,
-        ref: t,
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a), n);
     case "display6":
     case "headline6":
-      return /* @__PURE__ */ d.createElement(x, s({
+      return /* @__PURE__ */ g.createElement(L, y({
         level: 6,
-        tag: r,
-        ref: t,
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a), n);
     case "overline":
-      return /* @__PURE__ */ d.createElement(P, s({
-        tag: r,
-        ref: t,
+      return /* @__PURE__ */ g.createElement(J, y({
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a), n);
     case "subtitle1":
-      return /* @__PURE__ */ d.createElement(C, s({
-        tag: r,
-        ref: t,
+      return /* @__PURE__ */ g.createElement(z, y({
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a, {
         level: 1
       }), n);
     case "subtitle1-bold":
-      return /* @__PURE__ */ d.createElement(C, s({
+      return /* @__PURE__ */ g.createElement(z, y({
         bold: !0,
-        tag: r,
-        ref: t,
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a, {
         level: 1
       }), n);
     case "subtitle2-bold":
-      return /* @__PURE__ */ d.createElement(C, s({
+      return /* @__PURE__ */ g.createElement(z, y({
         bold: !0,
-        tag: r,
-        ref: t,
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a, {
         level: 2
       }), n);
     case "subtitle2":
-      return /* @__PURE__ */ d.createElement(C, s({
+      return /* @__PURE__ */ g.createElement(z, y({
         level: 2,
-        tag: r,
-        ref: t,
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a), n);
     default:
-      return /* @__PURE__ */ d.createElement(O, s({
-        tag: r,
-        ref: t,
+      return /* @__PURE__ */ g.createElement(I, y({
+        tag: l,
+        ref: s,
+        fixedPadding: c,
         themeColor: o
       }, a, {
         level: 1
       }), n);
   }
 });
-$.displayName = "Typography";
-$.propTypes = U;
-$.defaultProps = V;
+re.displayName = "Typography";
+re.propTypes = Be;
 export {
-  C,
-  $ as D,
-  B as P,
-  O as f,
-  x as h,
-  E as n
+  I as D,
+  z as I,
+  re as K,
+  L as N,
+  ne as O,
+  Y as z
 };