@simplybusiness/mobius 4.3.2 → 4.3.4

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # Changelog
 
+## 4.3.4
+
+### Patch Changes
+
+- Updated dependencies [c310b67]
+  - @simplybusiness/icons@4.2.9
+
+## 4.3.3
+
+### Patch Changes
+
+- a572d54: Fix `<Icon>` server-side rendering
+
 ## 4.3.2
 
 ### Patch Changes

package/dist/cjs/components/Icon/Icon.js

@@ -10,7 +10,6 @@ Object.defineProperty(exports, "Icon", {
 });
 const _jsxruntime = require("react/jsx-runtime");
 const _dedupe = /*#__PURE__*/ _interop_require_default(require("classnames/dedupe"));
-const _IconStyle = require("./IconStyle");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -26,7 +25,6 @@ function Icon({ icon, className, size = "xs", color, fixedWidth, spin, spinRever
         [`${ICON_PREFIX}-spin`]: spin || spinReverse,
         [`${ICON_PREFIX}-spin-reverse`]: spinReverse
     });
-    (0, _IconStyle.applyStyles)();
     const { iconName, width, height, svgPathData } = icon;
     return /*#__PURE__*/ (0, _jsxruntime.jsx)("svg", {
         "aria-hidden": "true",

package/dist/cjs/components/Icon/Icon.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import classNames from \"classnames/dedupe\";\nimport { applyStyles } from \"./IconStyle\";\nimport { IconProps } from \"./types\";\n\nconst ICON_PREFIX = \"mobius-icon\";\n\nexport function Icon({\n  icon,\n  className,\n  size = \"xs\",\n  color,\n  fixedWidth,\n  spin,\n  spinReverse,\n  ...otherProps\n}: IconProps) {\n  if (!icon) {\n    throw new Error(\"Must specify icon object\");\n  }\n\n  const classes = classNames(\n    \"mobius\",\n    \"mobius/Icon\",\n    `svg-inline--${ICON_PREFIX}`,\n    `--size-${size}`,\n    className,\n    {\n      [`${ICON_PREFIX}-fw`]: fixedWidth,\n      [`${ICON_PREFIX}-spin`]: spin || spinReverse,\n      [`${ICON_PREFIX}-spin-reverse`]: spinReverse,\n    },\n  );\n\n  applyStyles();\n\n  const { iconName, width, height, svgPathData } = icon;\n\n  return (\n    <svg\n      aria-hidden=\"true\"\n      focusable=\"false\"\n      data-icon={iconName}\n      className={classes}\n      role=\"img\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox={`0 0 ${width} ${height}`}\n      style={{ color }}\n      {...otherProps}\n    >\n      <path fill=\"currentColor\" d={svgPathData} />\n    </svg>\n  );\n}\n"],"names":["Icon","ICON_PREFIX","icon","className","size","color","fixedWidth","spin","spinReverse","otherProps","Error","classes","classNames","applyStyles","iconName","width","height","svgPathData","svg","aria-hidden","focusable","data-icon","role","xmlns","viewBox","style","path","fill","d"],"mappings":";;;;+BAMgBA;;;eAAAA;;;;+DANO;2BACK;;;;;;AAG5B,MAAMC,cAAc;AAEb,SAASD,KAAK,EACnBE,IAAI,EACJC,SAAS,EACTC,OAAO,IAAI,EACXC,KAAK,EACLC,UAAU,EACVC,IAAI,EACJC,WAAW,EACX,GAAGC,YACO;IACV,IAAI,CAACP,MAAM;QACT,MAAM,IAAIQ,MAAM;IAClB;IAEA,MAAMC,UAAUC,IAAAA,eAAU,EACxB,UACA,eACA,CAAC,YAAY,EAAEX,YAAY,CAAC,EAC5B,CAAC,OAAO,EAAEG,KAAK,CAAC,EAChBD,WACA;QACE,CAAC,CAAC,EAAEF,YAAY,GAAG,CAAC,CAAC,EAAEK;QACvB,CAAC,CAAC,EAAEL,YAAY,KAAK,CAAC,CAAC,EAAEM,QAAQC;QACjC,CAAC,CAAC,EAAEP,YAAY,aAAa,CAAC,CAAC,EAAEO;IACnC;IAGFK,IAAAA,sBAAW;IAEX,MAAM,EAAEC,QAAQ,EAAEC,KAAK,EAAEC,MAAM,EAAEC,WAAW,EAAE,GAAGf;IAEjD,qBACE,qBAACgB;QACCC,eAAY;QACZC,WAAU;QACVC,aAAWP;QACXX,WAAWQ;QACXW,MAAK;QACLC,OAAM;QACNC,SAAS,CAAC,IAAI,EAAET,MAAM,CAAC,EAAEC,OAAO,CAAC;QACjCS,OAAO;YAAEpB;QAAM;QACd,GAAGI,UAAU;kBAEd,cAAA,qBAACiB;YAAKC,MAAK;YAAeC,GAAGX;;;AAGnC"}
+{"version":3,"sources":["../../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import classNames from \"classnames/dedupe\";\nimport { IconProps } from \"./types\";\n\nconst ICON_PREFIX = \"mobius-icon\";\n\nexport function Icon({\n  icon,\n  className,\n  size = \"xs\",\n  color,\n  fixedWidth,\n  spin,\n  spinReverse,\n  ...otherProps\n}: IconProps) {\n  if (!icon) {\n    throw new Error(\"Must specify icon object\");\n  }\n\n  const classes = classNames(\n    \"mobius\",\n    \"mobius/Icon\",\n    `svg-inline--${ICON_PREFIX}`,\n    `--size-${size}`,\n    className,\n    {\n      [`${ICON_PREFIX}-fw`]: fixedWidth,\n      [`${ICON_PREFIX}-spin`]: spin || spinReverse,\n      [`${ICON_PREFIX}-spin-reverse`]: spinReverse,\n    },\n  );\n\n  const { iconName, width, height, svgPathData } = icon;\n\n  return (\n    <svg\n      aria-hidden=\"true\"\n      focusable=\"false\"\n      data-icon={iconName}\n      className={classes}\n      role=\"img\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox={`0 0 ${width} ${height}`}\n      style={{ color }}\n      {...otherProps}\n    >\n      <path fill=\"currentColor\" d={svgPathData} />\n    </svg>\n  );\n}\n"],"names":["Icon","ICON_PREFIX","icon","className","size","color","fixedWidth","spin","spinReverse","otherProps","Error","classes","classNames","iconName","width","height","svgPathData","svg","aria-hidden","focusable","data-icon","role","xmlns","viewBox","style","path","fill","d"],"mappings":";;;;+BAKgBA;;;eAAAA;;;;+DALO;;;;;;AAGvB,MAAMC,cAAc;AAEb,SAASD,KAAK,EACnBE,IAAI,EACJC,SAAS,EACTC,OAAO,IAAI,EACXC,KAAK,EACLC,UAAU,EACVC,IAAI,EACJC,WAAW,EACX,GAAGC,YACO;IACV,IAAI,CAACP,MAAM;QACT,MAAM,IAAIQ,MAAM;IAClB;IAEA,MAAMC,UAAUC,IAAAA,eAAU,EACxB,UACA,eACA,CAAC,YAAY,EAAEX,YAAY,CAAC,EAC5B,CAAC,OAAO,EAAEG,KAAK,CAAC,EAChBD,WACA;QACE,CAAC,CAAC,EAAEF,YAAY,GAAG,CAAC,CAAC,EAAEK;QACvB,CAAC,CAAC,EAAEL,YAAY,KAAK,CAAC,CAAC,EAAEM,QAAQC;QACjC,CAAC,CAAC,EAAEP,YAAY,aAAa,CAAC,CAAC,EAAEO;IACnC;IAGF,MAAM,EAAEK,QAAQ,EAAEC,KAAK,EAAEC,MAAM,EAAEC,WAAW,EAAE,GAAGd;IAEjD,qBACE,qBAACe;QACCC,eAAY;QACZC,WAAU;QACVC,aAAWP;QACXV,WAAWQ;QACXU,MAAK;QACLC,OAAM;QACNC,SAAS,CAAC,IAAI,EAAET,MAAM,CAAC,EAAEC,OAAO,CAAC;QACjCS,OAAO;YAAEnB;QAAM;QACd,GAAGI,UAAU;kBAEd,cAAA,qBAACgB;YAAKC,MAAK;YAAeC,GAAGX;;;AAGnC"}

package/dist/esm/components/Icon/Icon.js

@@ -1,6 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import classNames from "classnames/dedupe";
-import { applyStyles } from "./IconStyle";
 const ICON_PREFIX = "mobius-icon";
 export function Icon({ icon, className, size = "xs", color, fixedWidth, spin, spinReverse, ...otherProps }) {
     if (!icon) {
@@ -11,7 +10,6 @@ export function Icon({ icon, className, size = "xs", color, fixedWidth, spin, sp
         [`${ICON_PREFIX}-spin`]: spin || spinReverse,
         [`${ICON_PREFIX}-spin-reverse`]: spinReverse
     });
-    applyStyles();
     const { iconName, width, height, svgPathData } = icon;
     return /*#__PURE__*/ _jsx("svg", {
         "aria-hidden": "true",

package/dist/esm/components/Icon/Icon.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import classNames from \"classnames/dedupe\";\nimport { applyStyles } from \"./IconStyle\";\nimport { IconProps } from \"./types\";\n\nconst ICON_PREFIX = \"mobius-icon\";\n\nexport function Icon({\n  icon,\n  className,\n  size = \"xs\",\n  color,\n  fixedWidth,\n  spin,\n  spinReverse,\n  ...otherProps\n}: IconProps) {\n  if (!icon) {\n    throw new Error(\"Must specify icon object\");\n  }\n\n  const classes = classNames(\n    \"mobius\",\n    \"mobius/Icon\",\n    `svg-inline--${ICON_PREFIX}`,\n    `--size-${size}`,\n    className,\n    {\n      [`${ICON_PREFIX}-fw`]: fixedWidth,\n      [`${ICON_PREFIX}-spin`]: spin || spinReverse,\n      [`${ICON_PREFIX}-spin-reverse`]: spinReverse,\n    },\n  );\n\n  applyStyles();\n\n  const { iconName, width, height, svgPathData } = icon;\n\n  return (\n    <svg\n      aria-hidden=\"true\"\n      focusable=\"false\"\n      data-icon={iconName}\n      className={classes}\n      role=\"img\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox={`0 0 ${width} ${height}`}\n      style={{ color }}\n      {...otherProps}\n    >\n      <path fill=\"currentColor\" d={svgPathData} />\n    </svg>\n  );\n}\n"],"names":["classNames","applyStyles","ICON_PREFIX","Icon","icon","className","size","color","fixedWidth","spin","spinReverse","otherProps","Error","classes","iconName","width","height","svgPathData","svg","aria-hidden","focusable","data-icon","role","xmlns","viewBox","style","path","fill","d"],"mappings":";AAAA,OAAOA,gBAAgB,oBAAoB;AAC3C,SAASC,WAAW,QAAQ,cAAc;AAG1C,MAAMC,cAAc;AAEpB,OAAO,SAASC,KAAK,EACnBC,IAAI,EACJC,SAAS,EACTC,OAAO,IAAI,EACXC,KAAK,EACLC,UAAU,EACVC,IAAI,EACJC,WAAW,EACX,GAAGC,YACO;IACV,IAAI,CAACP,MAAM;QACT,MAAM,IAAIQ,MAAM;IAClB;IAEA,MAAMC,UAAUb,WACd,UACA,eACA,CAAC,YAAY,EAAEE,YAAY,CAAC,EAC5B,CAAC,OAAO,EAAEI,KAAK,CAAC,EAChBD,WACA;QACE,CAAC,CAAC,EAAEH,YAAY,GAAG,CAAC,CAAC,EAAEM;QACvB,CAAC,CAAC,EAAEN,YAAY,KAAK,CAAC,CAAC,EAAEO,QAAQC;QACjC,CAAC,CAAC,EAAER,YAAY,aAAa,CAAC,CAAC,EAAEQ;IACnC;IAGFT;IAEA,MAAM,EAAEa,QAAQ,EAAEC,KAAK,EAAEC,MAAM,EAAEC,WAAW,EAAE,GAAGb;IAEjD,qBACE,KAACc;QACCC,eAAY;QACZC,WAAU;QACVC,aAAWP;QACXT,WAAWQ;QACXS,MAAK;QACLC,OAAM;QACNC,SAAS,CAAC,IAAI,EAAET,MAAM,CAAC,EAAEC,OAAO,CAAC;QACjCS,OAAO;YAAElB;QAAM;QACd,GAAGI,UAAU;kBAEd,cAAA,KAACe;YAAKC,MAAK;YAAeC,GAAGX;;;AAGnC"}
+{"version":3,"sources":["../../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import classNames from \"classnames/dedupe\";\nimport { IconProps } from \"./types\";\n\nconst ICON_PREFIX = \"mobius-icon\";\n\nexport function Icon({\n  icon,\n  className,\n  size = \"xs\",\n  color,\n  fixedWidth,\n  spin,\n  spinReverse,\n  ...otherProps\n}: IconProps) {\n  if (!icon) {\n    throw new Error(\"Must specify icon object\");\n  }\n\n  const classes = classNames(\n    \"mobius\",\n    \"mobius/Icon\",\n    `svg-inline--${ICON_PREFIX}`,\n    `--size-${size}`,\n    className,\n    {\n      [`${ICON_PREFIX}-fw`]: fixedWidth,\n      [`${ICON_PREFIX}-spin`]: spin || spinReverse,\n      [`${ICON_PREFIX}-spin-reverse`]: spinReverse,\n    },\n  );\n\n  const { iconName, width, height, svgPathData } = icon;\n\n  return (\n    <svg\n      aria-hidden=\"true\"\n      focusable=\"false\"\n      data-icon={iconName}\n      className={classes}\n      role=\"img\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox={`0 0 ${width} ${height}`}\n      style={{ color }}\n      {...otherProps}\n    >\n      <path fill=\"currentColor\" d={svgPathData} />\n    </svg>\n  );\n}\n"],"names":["classNames","ICON_PREFIX","Icon","icon","className","size","color","fixedWidth","spin","spinReverse","otherProps","Error","classes","iconName","width","height","svgPathData","svg","aria-hidden","focusable","data-icon","role","xmlns","viewBox","style","path","fill","d"],"mappings":";AAAA,OAAOA,gBAAgB,oBAAoB;AAG3C,MAAMC,cAAc;AAEpB,OAAO,SAASC,KAAK,EACnBC,IAAI,EACJC,SAAS,EACTC,OAAO,IAAI,EACXC,KAAK,EACLC,UAAU,EACVC,IAAI,EACJC,WAAW,EACX,GAAGC,YACO;IACV,IAAI,CAACP,MAAM;QACT,MAAM,IAAIQ,MAAM;IAClB;IAEA,MAAMC,UAAUZ,WACd,UACA,eACA,CAAC,YAAY,EAAEC,YAAY,CAAC,EAC5B,CAAC,OAAO,EAAEI,KAAK,CAAC,EAChBD,WACA;QACE,CAAC,CAAC,EAAEH,YAAY,GAAG,CAAC,CAAC,EAAEM;QACvB,CAAC,CAAC,EAAEN,YAAY,KAAK,CAAC,CAAC,EAAEO,QAAQC;QACjC,CAAC,CAAC,EAAER,YAAY,aAAa,CAAC,CAAC,EAAEQ;IACnC;IAGF,MAAM,EAAEI,QAAQ,EAAEC,KAAK,EAAEC,MAAM,EAAEC,WAAW,EAAE,GAAGb;IAEjD,qBACE,KAACc;QACCC,eAAY;QACZC,WAAU;QACVC,aAAWP;QACXT,WAAWQ;QACXS,MAAK;QACLC,OAAM;QACNC,SAAS,CAAC,IAAI,EAAET,MAAM,CAAC,EAAEC,OAAO,CAAC;QACjCS,OAAO;YAAElB;QAAM;QACd,GAAGI,UAAU;kBAEd,cAAA,KAACe;YAAKC,MAAK;YAAeC,GAAGX;;;AAGnC"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@simplybusiness/mobius",
   "license": "UNLICENSED",
-  "version": "4.3.2",
+  "version": "4.3.4",
   "description": "Core library of Mobius react components",
   "repository": {
     "type": "git",
@@ -79,7 +79,7 @@
   },
   "dependencies": {
     "@floating-ui/react": "^0.26.4",
-    "@simplybusiness/icons": "^4.2.8",
+    "@simplybusiness/icons": "^4.2.9",
     "@swc/cli": "^0.1.63",
     "classnames": "^2.5.1",
     "dialog-polyfill": "^0.5.6",

package/src/components/Icon/Icon.tsx

@@ -1,5 +1,4 @@
 import classNames from "classnames/dedupe";
-import { applyStyles } from "./IconStyle";
 import { IconProps } from "./types";
 
 const ICON_PREFIX = "mobius-icon";
@@ -31,8 +30,6 @@ export function Icon({
     },
   );
 
-  applyStyles();
-
   const { iconName, width, height, svgPathData } = icon;
 
   return (

package/dist/cjs/components/Icon/IconStyle.js

@@ -1,413 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "applyStyles", {
-    enumerable: true,
-    get: function() {
-        return applyStyles;
-    }
-});
-const styleText = `
-svg:not(:root).svg-inline--mobius-icon, svg:not(:host).svg-inline--mobius-icon {
-  overflow: visible;
-  box-sizing: content-box;
-}
-
-.svg-inline--mobius-icon {
-  display: var(--mobius-icon-display, inline-block);
-  height: 1em;
-  overflow: visible;
-  vertical-align: -0.125em;
-}
-.svg-inline--mobius-icon.mobius-icon-2xs {
-  vertical-align: 0.1em;
-}
-.svg-inline--mobius-icon.mobius-icon-xs {
-  vertical-align: 0em;
-}
-.svg-inline--mobius-icon.mobius-icon-sm {
-  vertical-align: -0.0714285705em;
-}
-.svg-inline--mobius-icon.mobius-icon-lg {
-  vertical-align: -0.2em;
-}
-.svg-inline--mobius-icon.mobius-icon-xl {
-  vertical-align: -0.25em;
-}
-.svg-inline--mobius-icon.mobius-icon-2xl {
-  vertical-align: -0.3125em;
-}
-.svg-inline--mobius-icon.mobius-icon-pull-left {
-  margin-right: var(--mobius-icon-pull-margin, 0.3em);
-  width: auto;
-}
-.svg-inline--mobius-icon.mobius-icon-pull-right {
-  margin-left: var(--mobius-icon-pull-margin, 0.3em);
-  width: auto;
-}
-.svg-inline--mobius-icon.mobius-icon-li {
-  width: var(--mobius-icon-li-width, 2em);
-  top: 0.25em;
-}
-.svg-inline--mobius-icon.mobius-icon-fw {
-  width: var(--mobius-icon-fw-width, 1.25em);
-}
-
-.mobius-icon-layers svg.svg-inline--mobius-icon {
-  bottom: 0;
-  left: 0;
-  margin: auto;
-  position: absolute;
-  right: 0;
-  top: 0;
-}
-
-.mobius-icon-layers-counter, .mobius-icon-layers-text {
-  display: inline-block;
-  position: absolute;
-  text-align: center;
-}
-
-.mobius-icon-layers {
-  display: inline-block;
-  height: 1em;
-  position: relative;
-  text-align: center;
-  vertical-align: -0.125em;
-  width: 1em;
-}
-.mobius-icon-layers svg.svg-inline--mobius-icon {
-  transform-origin: center center;
-}
-
-.mobius-icon-layers-text {
-  left: 50%;
-  top: 50%;
-  transform: translate(-50%, -50%);
-  transform-origin: center center;
-}
-
-.mobius-icon-layers-counter {
-  background-color: var(--mobius-icon-counter-background-color, #ff253a);
-  border-radius: var(--mobius-icon-counter-border-radius, 1em);
-  box-sizing: border-box;
-  color: var(--mobius-icon-inverse, #fff);
-  line-height: var(--mobius-icon-counter-line-height, 1);
-  max-width: var(--mobius-icon-counter-max-width, 5em);
-  min-width: var(--mobius-icon-counter-min-width, 1.5em);
-  overflow: hidden;
-  padding: var(--mobius-icon-counter-padding, 0.25em 0.5em);
-  right: var(--mobius-icon-right, 0);
-  text-overflow: ellipsis;
-  top: var(--mobius-icon-top, 0);
-  transform: scale(var(--mobius-icon-counter-scale, 0.25));
-  transform-origin: top right;
-}
-
-.mobius-icon-layers-bottom-right {
-  bottom: var(--mobius-icon-bottom, 0);
-  right: var(--mobius-icon-right, 0);
-  top: auto;
-  transform: scale(var(--mobius-icon-layers-scale, 0.25));
-  transform-origin: bottom right;
-}
-
-.mobius-icon-layers-bottom-left {
-  bottom: var(--mobius-icon-bottom, 0);
-  left: var(--mobius-icon-left, 0);
-  right: auto;
-  top: auto;
-  transform: scale(var(--mobius-icon-layers-scale, 0.25));
-  transform-origin: bottom left;
-}
-
-.mobius-icon-layers-top-right {
-  top: var(--mobius-icon-top, 0);
-  right: var(--mobius-icon-right, 0);
-  transform: scale(var(--mobius-icon-layers-scale, 0.25));
-  transform-origin: top right;
-}
-
-.mobius-icon-layers-top-left {
-  left: var(--mobius-icon-left, 0);
-  right: auto;
-  top: var(--mobius-icon-top, 0);
-  transform: scale(var(--mobius-icon-layers-scale, 0.25));
-  transform-origin: top left;
-}
-
-.mobius-icon-1x {
-  font-size: 1em;
-}
-
-.mobius-icon-2x {
-  font-size: 2em;
-}
-
-.mobius-icon-3x {
-  font-size: 3em;
-}
-
-.mobius-icon-4x {
-  font-size: 4em;
-}
-
-.mobius-icon-5x {
-  font-size: 5em;
-}
-
-.mobius-icon-6x {
-  font-size: 6em;
-}
-
-.mobius-icon-7x {
-  font-size: 7em;
-}
-
-.mobius-icon-8x {
-  font-size: 8em;
-}
-
-.mobius-icon-9x {
-  font-size: 9em;
-}
-
-.mobius-icon-10x {
-  font-size: 10em;
-}
-
-.mobius-icon-2xs {
-  font-size: 0.625em;
-  line-height: 0.1em;
-  vertical-align: 0.225em;
-}
-
-.mobius-icon-xs {
-  font-size: 0.75em;
-  line-height: 0.0833333337em;
-  vertical-align: 0.125em;
-}
-
-.mobius-icon-sm {
-  font-size: 0.875em;
-  line-height: 0.0714285718em;
-  vertical-align: 0.0535714295em;
-}
-
-.mobius-icon-lg {
-  font-size: 1.25em;
-  line-height: 0.05em;
-  vertical-align: -0.075em;
-}
-
-.mobius-icon-xl {
-  font-size: 1.5em;
-  line-height: 0.0416666682em;
-  vertical-align: -0.125em;
-}
-
-.mobius-icon-2xl {
-  font-size: 2em;
-  line-height: 0.03125em;
-  vertical-align: -0.1875em;
-}
-
-.mobius-icon-fw {
-  text-align: center;
-  width: 1.25em;
-}
-
-.mobius-icon-ul {
-  list-style-type: none;
-  margin-left: var(--mobius-icon-li-margin, 2.5em);
-  padding-left: 0;
-}
-.mobius-icon-ul > li {
-  position: relative;
-}
-
-.mobius-icon-li {
-  left: calc(var(--mobius-icon-li-width, 2em) * -1);
-  position: absolute;
-  text-align: center;
-  width: var(--mobius-icon-li-width, 2em);
-  line-height: inherit;
-}
-
-.mobius-icon-border {
-  border-color: var(--mobius-icon-border-color, #eee);
-  border-radius: var(--mobius-icon-border-radius, 0.1em);
-  border-style: var(--mobius-icon-border-style, solid);
-  border-width: var(--mobius-icon-border-width, 0.08em);
-  padding: var(--mobius-icon-border-padding, 0.2em 0.25em 0.15em);
-}
-
-.mobius-icon-pull-left {
-  float: left;
-  margin-right: var(--mobius-icon-pull-margin, 0.3em);
-}
-
-.mobius-icon-pull-right {
-  float: right;
-  margin-left: var(--mobius-icon-pull-margin, 0.3em);
-}
-
-.mobius-icon-spin {
-  animation-name: mobius-icon-spin;
-  animation-delay: var(--mobius-icon-animation-delay, 0s);
-  animation-direction: var(--mobius-icon-animation-direction, normal);
-  animation-duration: var(--mobius-icon-animation-duration, 2s);
-  animation-iteration-count: var(--mobius-icon-animation-iteration-count, infinite);
-  animation-timing-function: var(--mobius-icon-animation-timing, linear);
-}
-
-.mobius-icon-spin-reverse {
-  --mobius-icon-animation-direction: reverse;
-}
-
-@media (prefers-reduced-motion: reduce) {
-.mobius-icon-spin {
-    animation-delay: -1ms;
-    animation-duration: 1ms;
-    animation-iteration-count: 1;
-    transition-delay: 0s;
-    transition-duration: 0s;
-  }
-}
-@keyframes mobius-icon-spin {
-  0% {
-    transform: rotate(0deg);
-  }
-  100% {
-    transform: rotate(360deg);
-  }
-}
-.mobius-icon-rotate-90 {
-  transform: rotate(90deg);
-}
-
-.mobius-icon-rotate-180 {
-  transform: rotate(180deg);
-}
-
-.mobius-icon-rotate-270 {
-  transform: rotate(270deg);
-}
-
-.mobius-icon-flip-horizontal {
-  transform: scale(-1, 1);
-}
-
-.mobius-icon-flip-vertical {
-  transform: scale(1, -1);
-}
-
-.mobius-icon-flip-both,
-.mobius-icon-flip-horizontal.mobius-icon-flip-vertical {
-  transform: scale(-1, -1);
-}
-
-.mobius-icon-rotate-by {
-  transform: rotate(var(--mobius-icon-rotate-angle, none));
-}
-
-.mobius-icon-stack {
-  display: inline-block;
-  vertical-align: middle;
-  height: 2em;
-  position: relative;
-  width: 2.5em;
-}
-
-.mobius-icon-stack-1x,
-.mobius-icon-stack-2x {
-  bottom: 0;
-  left: 0;
-  margin: auto;
-  position: absolute;
-  right: 0;
-  top: 0;
-  z-index: var(--mobius-icon-stack-z-index, auto);
-}
-
-.svg-inline--mobius-icon.mobius-icon-stack-1x {
-  height: 1em;
-  width: 1.25em;
-}
-.svg-inline--mobius-icon.mobius-icon-stack-2x {
-  height: 2em;
-  width: 2.5em;
-}
-
-.mobius-icon-inverse {
-  color: var(--mobius-icon-inverse, #fff);
-}
-
-.sr-only,
-.mobius-icon-sr-only {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  padding: 0;
-  margin: -1px;
-  overflow: hidden;
-  clip: rect(0, 0, 0, 0);
-  white-space: nowrap;
-  border-width: 0;
-}
-
-.sr-only-focusable:not(:focus),
-.mobius-icon-sr-only-focusable:not(:focus) {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  padding: 0;
-  margin: -1px;
-  overflow: hidden;
-  clip: rect(0, 0, 0, 0);
-  white-space: nowrap;
-  border-width: 0;
-}
-
-.svg-inline--mobius-icon .mobius-icon-primary {
-  fill: var(--mobius-icon-primary-color, currentColor);
-  opacity: var(--mobius-icon-primary-opacity, 1);
-}
-
-.svg-inline--mobius-icon .mobius-icon-secondary {
-  fill: var(--mobius-icon-secondary-color, currentColor);
-  opacity: var(--mobius-icon-secondary-opacity, 0.4);
-}
-
-.svg-inline--mobius-icon.mobius-icon-swap-opacity .mobius-icon-primary {
-  opacity: var(--mobius-icon-secondary-opacity, 0.4);
-}
-
-.svg-inline--mobius-icon.mobius-icon-swap-opacity .mobius-icon-secondary {
-  opacity: var(--mobius-icon-primary-opacity, 1);
-}
-
-.svg-inline--mobius-icon mask .mobius-icon-primary,
-.svg-inline--mobius-icon mask .mobius-icon-secondary {
-  fill: black;
-}
-
-.fad.mobius-icon-inverse,
-.mobius-icon-duotone.mobius-icon-inverse {
-  color: var(--mobius-icon-inverse, #fff);
-}
-`;
-let appliedStyles = false;
-function applyStyles() {
-    if (appliedStyles) {
-        return;
-    }
-    appliedStyles = true;
-    const style = document.createElement("style");
-    style.setAttribute("data-id", "icon-style");
-    style.innerText = styleText;
-    document.head.append(style);
-}
-
-//# sourceMappingURL=IconStyle.js.map

package/dist/cjs/components/Icon/IconStyle.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/components/Icon/IconStyle.tsx"],"sourcesContent":["const styleText = `\nsvg:not(:root).svg-inline--mobius-icon, svg:not(:host).svg-inline--mobius-icon {\n  overflow: visible;\n  box-sizing: content-box;\n}\n\n.svg-inline--mobius-icon {\n  display: var(--mobius-icon-display, inline-block);\n  height: 1em;\n  overflow: visible;\n  vertical-align: -0.125em;\n}\n.svg-inline--mobius-icon.mobius-icon-2xs {\n  vertical-align: 0.1em;\n}\n.svg-inline--mobius-icon.mobius-icon-xs {\n  vertical-align: 0em;\n}\n.svg-inline--mobius-icon.mobius-icon-sm {\n  vertical-align: -0.0714285705em;\n}\n.svg-inline--mobius-icon.mobius-icon-lg {\n  vertical-align: -0.2em;\n}\n.svg-inline--mobius-icon.mobius-icon-xl {\n  vertical-align: -0.25em;\n}\n.svg-inline--mobius-icon.mobius-icon-2xl {\n  vertical-align: -0.3125em;\n}\n.svg-inline--mobius-icon.mobius-icon-pull-left {\n  margin-right: var(--mobius-icon-pull-margin, 0.3em);\n  width: auto;\n}\n.svg-inline--mobius-icon.mobius-icon-pull-right {\n  margin-left: var(--mobius-icon-pull-margin, 0.3em);\n  width: auto;\n}\n.svg-inline--mobius-icon.mobius-icon-li {\n  width: var(--mobius-icon-li-width, 2em);\n  top: 0.25em;\n}\n.svg-inline--mobius-icon.mobius-icon-fw {\n  width: var(--mobius-icon-fw-width, 1.25em);\n}\n\n.mobius-icon-layers svg.svg-inline--mobius-icon {\n  bottom: 0;\n  left: 0;\n  margin: auto;\n  position: absolute;\n  right: 0;\n  top: 0;\n}\n\n.mobius-icon-layers-counter, .mobius-icon-layers-text {\n  display: inline-block;\n  position: absolute;\n  text-align: center;\n}\n\n.mobius-icon-layers {\n  display: inline-block;\n  height: 1em;\n  position: relative;\n  text-align: center;\n  vertical-align: -0.125em;\n  width: 1em;\n}\n.mobius-icon-layers svg.svg-inline--mobius-icon {\n  transform-origin: center center;\n}\n\n.mobius-icon-layers-text {\n  left: 50%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  transform-origin: center center;\n}\n\n.mobius-icon-layers-counter {\n  background-color: var(--mobius-icon-counter-background-color, #ff253a);\n  border-radius: var(--mobius-icon-counter-border-radius, 1em);\n  box-sizing: border-box;\n  color: var(--mobius-icon-inverse, #fff);\n  line-height: var(--mobius-icon-counter-line-height, 1);\n  max-width: var(--mobius-icon-counter-max-width, 5em);\n  min-width: var(--mobius-icon-counter-min-width, 1.5em);\n  overflow: hidden;\n  padding: var(--mobius-icon-counter-padding, 0.25em 0.5em);\n  right: var(--mobius-icon-right, 0);\n  text-overflow: ellipsis;\n  top: var(--mobius-icon-top, 0);\n  transform: scale(var(--mobius-icon-counter-scale, 0.25));\n  transform-origin: top right;\n}\n\n.mobius-icon-layers-bottom-right {\n  bottom: var(--mobius-icon-bottom, 0);\n  right: var(--mobius-icon-right, 0);\n  top: auto;\n  transform: scale(var(--mobius-icon-layers-scale, 0.25));\n  transform-origin: bottom right;\n}\n\n.mobius-icon-layers-bottom-left {\n  bottom: var(--mobius-icon-bottom, 0);\n  left: var(--mobius-icon-left, 0);\n  right: auto;\n  top: auto;\n  transform: scale(var(--mobius-icon-layers-scale, 0.25));\n  transform-origin: bottom left;\n}\n\n.mobius-icon-layers-top-right {\n  top: var(--mobius-icon-top, 0);\n  right: var(--mobius-icon-right, 0);\n  transform: scale(var(--mobius-icon-layers-scale, 0.25));\n  transform-origin: top right;\n}\n\n.mobius-icon-layers-top-left {\n  left: var(--mobius-icon-left, 0);\n  right: auto;\n  top: var(--mobius-icon-top, 0);\n  transform: scale(var(--mobius-icon-layers-scale, 0.25));\n  transform-origin: top left;\n}\n\n.mobius-icon-1x {\n  font-size: 1em;\n}\n\n.mobius-icon-2x {\n  font-size: 2em;\n}\n\n.mobius-icon-3x {\n  font-size: 3em;\n}\n\n.mobius-icon-4x {\n  font-size: 4em;\n}\n\n.mobius-icon-5x {\n  font-size: 5em;\n}\n\n.mobius-icon-6x {\n  font-size: 6em;\n}\n\n.mobius-icon-7x {\n  font-size: 7em;\n}\n\n.mobius-icon-8x {\n  font-size: 8em;\n}\n\n.mobius-icon-9x {\n  font-size: 9em;\n}\n\n.mobius-icon-10x {\n  font-size: 10em;\n}\n\n.mobius-icon-2xs {\n  font-size: 0.625em;\n  line-height: 0.1em;\n  vertical-align: 0.225em;\n}\n\n.mobius-icon-xs {\n  font-size: 0.75em;\n  line-height: 0.0833333337em;\n  vertical-align: 0.125em;\n}\n\n.mobius-icon-sm {\n  font-size: 0.875em;\n  line-height: 0.0714285718em;\n  vertical-align: 0.0535714295em;\n}\n\n.mobius-icon-lg {\n  font-size: 1.25em;\n  line-height: 0.05em;\n  vertical-align: -0.075em;\n}\n\n.mobius-icon-xl {\n  font-size: 1.5em;\n  line-height: 0.0416666682em;\n  vertical-align: -0.125em;\n}\n\n.mobius-icon-2xl {\n  font-size: 2em;\n  line-height: 0.03125em;\n  vertical-align: -0.1875em;\n}\n\n.mobius-icon-fw {\n  text-align: center;\n  width: 1.25em;\n}\n\n.mobius-icon-ul {\n  list-style-type: none;\n  margin-left: var(--mobius-icon-li-margin, 2.5em);\n  padding-left: 0;\n}\n.mobius-icon-ul > li {\n  position: relative;\n}\n\n.mobius-icon-li {\n  left: calc(var(--mobius-icon-li-width, 2em) * -1);\n  position: absolute;\n  text-align: center;\n  width: var(--mobius-icon-li-width, 2em);\n  line-height: inherit;\n}\n\n.mobius-icon-border {\n  border-color: var(--mobius-icon-border-color, #eee);\n  border-radius: var(--mobius-icon-border-radius, 0.1em);\n  border-style: var(--mobius-icon-border-style, solid);\n  border-width: var(--mobius-icon-border-width, 0.08em);\n  padding: var(--mobius-icon-border-padding, 0.2em 0.25em 0.15em);\n}\n\n.mobius-icon-pull-left {\n  float: left;\n  margin-right: var(--mobius-icon-pull-margin, 0.3em);\n}\n\n.mobius-icon-pull-right {\n  float: right;\n  margin-left: var(--mobius-icon-pull-margin, 0.3em);\n}\n\n.mobius-icon-spin {\n  animation-name: mobius-icon-spin;\n  animation-delay: var(--mobius-icon-animation-delay, 0s);\n  animation-direction: var(--mobius-icon-animation-direction, normal);\n  animation-duration: var(--mobius-icon-animation-duration, 2s);\n  animation-iteration-count: var(--mobius-icon-animation-iteration-count, infinite);\n  animation-timing-function: var(--mobius-icon-animation-timing, linear);\n}\n\n.mobius-icon-spin-reverse {\n  --mobius-icon-animation-direction: reverse;\n}\n\n@media (prefers-reduced-motion: reduce) {\n.mobius-icon-spin {\n    animation-delay: -1ms;\n    animation-duration: 1ms;\n    animation-iteration-count: 1;\n    transition-delay: 0s;\n    transition-duration: 0s;\n  }\n}\n@keyframes mobius-icon-spin {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n.mobius-icon-rotate-90 {\n  transform: rotate(90deg);\n}\n\n.mobius-icon-rotate-180 {\n  transform: rotate(180deg);\n}\n\n.mobius-icon-rotate-270 {\n  transform: rotate(270deg);\n}\n\n.mobius-icon-flip-horizontal {\n  transform: scale(-1, 1);\n}\n\n.mobius-icon-flip-vertical {\n  transform: scale(1, -1);\n}\n\n.mobius-icon-flip-both,\n.mobius-icon-flip-horizontal.mobius-icon-flip-vertical {\n  transform: scale(-1, -1);\n}\n\n.mobius-icon-rotate-by {\n  transform: rotate(var(--mobius-icon-rotate-angle, none));\n}\n\n.mobius-icon-stack {\n  display: inline-block;\n  vertical-align: middle;\n  height: 2em;\n  position: relative;\n  width: 2.5em;\n}\n\n.mobius-icon-stack-1x,\n.mobius-icon-stack-2x {\n  bottom: 0;\n  left: 0;\n  margin: auto;\n  position: absolute;\n  right: 0;\n  top: 0;\n  z-index: var(--mobius-icon-stack-z-index, auto);\n}\n\n.svg-inline--mobius-icon.mobius-icon-stack-1x {\n  height: 1em;\n  width: 1.25em;\n}\n.svg-inline--mobius-icon.mobius-icon-stack-2x {\n  height: 2em;\n  width: 2.5em;\n}\n\n.mobius-icon-inverse {\n  color: var(--mobius-icon-inverse, #fff);\n}\n\n.sr-only,\n.mobius-icon-sr-only {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border-width: 0;\n}\n\n.sr-only-focusable:not(:focus),\n.mobius-icon-sr-only-focusable:not(:focus) {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border-width: 0;\n}\n\n.svg-inline--mobius-icon .mobius-icon-primary {\n  fill: var(--mobius-icon-primary-color, currentColor);\n  opacity: var(--mobius-icon-primary-opacity, 1);\n}\n\n.svg-inline--mobius-icon .mobius-icon-secondary {\n  fill: var(--mobius-icon-secondary-color, currentColor);\n  opacity: var(--mobius-icon-secondary-opacity, 0.4);\n}\n\n.svg-inline--mobius-icon.mobius-icon-swap-opacity .mobius-icon-primary {\n  opacity: var(--mobius-icon-secondary-opacity, 0.4);\n}\n\n.svg-inline--mobius-icon.mobius-icon-swap-opacity .mobius-icon-secondary {\n  opacity: var(--mobius-icon-primary-opacity, 1);\n}\n\n.svg-inline--mobius-icon mask .mobius-icon-primary,\n.svg-inline--mobius-icon mask .mobius-icon-secondary {\n  fill: black;\n}\n\n.fad.mobius-icon-inverse,\n.mobius-icon-duotone.mobius-icon-inverse {\n  color: var(--mobius-icon-inverse, #fff);\n}\n`;\n\nlet appliedStyles = false;\n\nexport function applyStyles() {\n  if (appliedStyles) {\n    return;\n  }\n  appliedStyles = true;\n\n  const style = document.createElement(\"style\");\n  style.setAttribute(\"data-id\", \"icon-style\");\n  style.innerText = styleText;\n  document.head.append(style);\n}\n"],"names":["applyStyles","styleText","appliedStyles","style","document","createElement","setAttribute","innerText","head","append"],"mappings":";;;;+BAyYgBA;;;eAAAA;;;AAzYhB,MAAMC,YAAY,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqYnB,CAAC;AAED,IAAIC,gBAAgB;AAEb,SAASF;IACd,IAAIE,eAAe;QACjB;IACF;IACAA,gBAAgB;IAEhB,MAAMC,QAAQC,SAASC,aAAa,CAAC;IACrCF,MAAMG,YAAY,CAAC,WAAW;IAC9BH,MAAMI,SAAS,GAAGN;IAClBG,SAASI,IAAI,CAACC,MAAM,CAACN;AACvB"}