@wrrdev/fenix-ui 1.1.3 → 1.1.5

package/dist/icons/base-css.d.ts

@@ -18,4 +18,20 @@ export declare const FENIX_ICON_FONT_VAR = "var(--fx-icon-font, Fenix Icons)";
 export declare const FENIX_ICON_BASE_CSS = "\n.fx-icon {\n  font-family: var(--fx-icon-font, Fenix Icons);\n  font-weight: normal;\n  font-style: normal;\n  line-height: 1;\n  letter-spacing: normal;\n  text-transform: none;\n  display: inline-block;\n  white-space: nowrap;\n  word-wrap: normal;\n  direction: ltr;\n  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;\n  -webkit-font-smoothing: antialiased;\n  text-rendering: optimizeLegibility;\n  user-select: none;\n}\n.fx-icon.fx-icon-fill { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24; }\n.fx-icon.fx-icon-bold { font-variation-settings: 'FILL' 0, 'wght' 600, 'GRAD' 0, 'opsz' 24; }\n";
 /** Verifica se o valor parece um nome de ícone da Fenix Icons (e não emoji/texto livre). */
 export declare function isFenixIconName(value: string): boolean;
+/**
+ * HTML do ícone para uso DENTRO de Shadow DOM (concatenar ao template).
+ *
+ * - Nome válido da Fenix Icons (ex.: `home`) → glifo via LIGADURA: o nome
+ *   vira o conteúdo de texto do elemento com a font-family de ícones.
+ *   Isso é obrigatório dentro de Shadow DOM: as regras
+ *   `.fx-icon-<nome>::before` são injetadas no <head> do documento e NÃO
+ *   atravessam a fronteira do shadow root (apenas o @font-face vale
+ *   dentro dele) — a classe vazia renderizaria um elemento sem glifo.
+ * - Qualquer outro valor (emoji, texto) → texto puro escapado.
+ *
+ * A classe base `.fx-icon` é fornecida por `FENIX_ICON_BASE_CSS`
+ * (concatenada às `static styles` do componente); o @font-face vem do
+ * `@wrrdev/fenix-ui/icons` (injetado no <head>).
+ */
+export declare function fenixIconHtml(icon: string): string;
 //# sourceMappingURL=base-css.d.ts.map

package/dist/icons/base-css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"base-css.d.ts","sourceRoot":"","sources":["../../src/icons/base-css.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,mFAAmF;AACnF,eAAO,MAAM,sBAAsB,gBAAgB,CAAC;AAEpD,kFAAkF;AAClF,eAAO,MAAM,mBAAmB,qCAAmD,CAAC;AAEpF;;;GAGG;AACH,eAAO,MAAM,mBAAmB,moBAmB/B,CAAC;AAEF,4FAA4F;AAC5F,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAEtD"}
+{"version":3,"file":"base-css.d.ts","sourceRoot":"","sources":["../../src/icons/base-css.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,mFAAmF;AACnF,eAAO,MAAM,sBAAsB,gBAAgB,CAAC;AAEpD,kFAAkF;AAClF,eAAO,MAAM,mBAAmB,qCAAmD,CAAC;AAEpF;;;GAGG;AACH,eAAO,MAAM,mBAAmB,moBAmB/B,CAAC;AAEF,4FAA4F;AAC5F,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAEtD;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAOlD"}

package/dist/icons/base-css.js

@@ -1,3 +1,4 @@
+import { esc } from "../core/sanitize.js";
 const FENIX_ICON_FONT_FAMILY = "Fenix Icons";
 const FENIX_ICON_FONT_VAR = `var(--fx-icon-font, ${FENIX_ICON_FONT_FAMILY})`;
 const FENIX_ICON_BASE_CSS = `
@@ -23,10 +24,19 @@ const FENIX_ICON_BASE_CSS = `
 function isFenixIconName(value) {
   return /^[a-z][a-z0-9_]*$/.test(value.trim());
 }
+function fenixIconHtml(icon) {
+  const value = (icon ?? "").trim();
+  if (!value) return "";
+  if (isFenixIconName(value)) {
+    return `<i class="fx-icon" aria-hidden="true">${value}</i>`;
+  }
+  return `<span aria-hidden="true">${esc(value)}</span>`;
+}
 export {
   FENIX_ICON_BASE_CSS,
   FENIX_ICON_FONT_FAMILY,
   FENIX_ICON_FONT_VAR,
+  fenixIconHtml,
   isFenixIconName
 };
 //# sourceMappingURL=base-css.js.map

package/dist/icons/base-css.js.map

@@ -1 +1 @@
-{"version":3,"file":"base-css.js","sources":["../../src/icons/base-css.ts"],"sourcesContent":["/**\n * CSS base da biblioteca de ícones — módulo LEVE (não importa a lista de nomes\n * nem dispara o carregamento da fonte). Usado dentro dos Shadow DOMs dos\n * componentes que suportam o atributo `icon`.\n *\n * O @font-face em si é injetado no <head> por `@wrrdev/fenix-ui/icons`\n * (ver ./index.ts) — @font-face registrado no documento também se aplica\n * dentro dos Shadow DOMs.\n */\n\n/** Nome da família de fontes dos ícones (self-hosted, sem dependência externa). */\nexport const FENIX_ICON_FONT_FAMILY = 'Fenix Icons';\n\n/** Família configurável via CSS custom property (fallback para o nome padrão). */\nexport const FENIX_ICON_FONT_VAR = `var(--fx-icon-font, ${FENIX_ICON_FONT_FAMILY})`;\n\n/**\n * Regras da classe `.fx-icon` para uso DENTRO de Shadow DOM\n * (concatene às `static styles` do componente).\n */\nexport const FENIX_ICON_BASE_CSS = `\n.fx-icon {\n  font-family: ${FENIX_ICON_FONT_VAR};\n  font-weight: normal;\n  font-style: normal;\n  line-height: 1;\n  letter-spacing: normal;\n  text-transform: none;\n  display: inline-block;\n  white-space: nowrap;\n  word-wrap: normal;\n  direction: ltr;\n  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;\n  -webkit-font-smoothing: antialiased;\n  text-rendering: optimizeLegibility;\n  user-select: none;\n}\n.fx-icon.fx-icon-fill { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24; }\n.fx-icon.fx-icon-bold { font-variation-settings: 'FILL' 0, 'wght' 600, 'GRAD' 0, 'opsz' 24; }\n`;\n\n/** Verifica se o valor parece um nome de ícone da Fenix Icons (e não emoji/texto livre). */\nexport function isFenixIconName(value: string): boolean {\n  return /^[a-z][a-z0-9_]*$/.test(value.trim());\n}\n"],"names":[],"mappings":"AAWO,MAAM,yBAAyB;AAG/B,MAAM,sBAAsB,uBAAuB,sBAAsB;AAMzE,MAAM,sBAAsB;AAAA;AAAA,iBAElB,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoB7B,SAAS,gBAAgB,OAAwB;AACtD,SAAO,oBAAoB,KAAK,MAAM,KAAA,CAAM;AAC9C;"}
+{"version":3,"file":"base-css.js","sources":["../../src/icons/base-css.ts"],"sourcesContent":["/**\n * CSS base da biblioteca de ícones — módulo LEVE (não importa a lista de nomes\n * nem dispara o carregamento da fonte). Usado dentro dos Shadow DOMs dos\n * componentes que suportam o atributo `icon`.\n *\n * O @font-face em si é injetado no <head> por `@wrrdev/fenix-ui/icons`\n * (ver ./index.ts) — @font-face registrado no documento também se aplica\n * dentro dos Shadow DOMs.\n */\n\nimport { esc } from '../core/sanitize';\n\n/** Nome da família de fontes dos ícones (self-hosted, sem dependência externa). */\nexport const FENIX_ICON_FONT_FAMILY = 'Fenix Icons';\n\n/** Família configurável via CSS custom property (fallback para o nome padrão). */\nexport const FENIX_ICON_FONT_VAR = `var(--fx-icon-font, ${FENIX_ICON_FONT_FAMILY})`;\n\n/**\n * Regras da classe `.fx-icon` para uso DENTRO de Shadow DOM\n * (concatene às `static styles` do componente).\n */\nexport const FENIX_ICON_BASE_CSS = `\n.fx-icon {\n  font-family: ${FENIX_ICON_FONT_VAR};\n  font-weight: normal;\n  font-style: normal;\n  line-height: 1;\n  letter-spacing: normal;\n  text-transform: none;\n  display: inline-block;\n  white-space: nowrap;\n  word-wrap: normal;\n  direction: ltr;\n  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;\n  -webkit-font-smoothing: antialiased;\n  text-rendering: optimizeLegibility;\n  user-select: none;\n}\n.fx-icon.fx-icon-fill { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24; }\n.fx-icon.fx-icon-bold { font-variation-settings: 'FILL' 0, 'wght' 600, 'GRAD' 0, 'opsz' 24; }\n`;\n\n/** Verifica se o valor parece um nome de ícone da Fenix Icons (e não emoji/texto livre). */\nexport function isFenixIconName(value: string): boolean {\n  return /^[a-z][a-z0-9_]*$/.test(value.trim());\n}\n\n/**\n * HTML do ícone para uso DENTRO de Shadow DOM (concatenar ao template).\n *\n * - Nome válido da Fenix Icons (ex.: `home`) → glifo via LIGADURA: o nome\n *   vira o conteúdo de texto do elemento com a font-family de ícones.\n *   Isso é obrigatório dentro de Shadow DOM: as regras\n *   `.fx-icon-<nome>::before` são injetadas no <head> do documento e NÃO\n *   atravessam a fronteira do shadow root (apenas o @font-face vale\n *   dentro dele) — a classe vazia renderizaria um elemento sem glifo.\n * - Qualquer outro valor (emoji, texto) → texto puro escapado.\n *\n * A classe base `.fx-icon` é fornecida por `FENIX_ICON_BASE_CSS`\n * (concatenada às `static styles` do componente); o @font-face vem do\n * `@wrrdev/fenix-ui/icons` (injetado no <head>).\n */\nexport function fenixIconHtml(icon: string): string {\n  const value = (icon ?? '').trim();\n  if (!value) return '';\n  if (isFenixIconName(value)) {\n    return `<i class=\"fx-icon\" aria-hidden=\"true\">${value}</i>`;\n  }\n  return `<span aria-hidden=\"true\">${esc(value)}</span>`;\n}\n"],"names":[],"mappings":";AAaO,MAAM,yBAAyB;AAG/B,MAAM,sBAAsB,uBAAuB,sBAAsB;AAMzE,MAAM,sBAAsB;AAAA;AAAA,iBAElB,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoB7B,SAAS,gBAAgB,OAAwB;AACtD,SAAO,oBAAoB,KAAK,MAAM,KAAA,CAAM;AAC9C;AAiBO,SAAS,cAAc,MAAsB;AAClD,QAAM,SAAS,QAAQ,IAAI,KAAA;AAC3B,MAAI,CAAC,MAAO,QAAO;AACnB,MAAI,gBAAgB,KAAK,GAAG;AAC1B,WAAO,yCAAyC,KAAK;AAAA,EACvD;AACA,SAAO,4BAA4B,IAAI,KAAK,CAAC;AAC/C;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wrrdev/fenix-ui",
-  "version": "1.1.3",
+  "version": "1.1.5",
   "description": "FenixUI Design System Web nativo (Web Components + Shadow DOM + Design Tokens) com tree-shaking por componente.",
   "type": "module",
   "license": "ISC",

package/dist/assets/base-css-BifSeW2H.js

@@ -1,31 +0,0 @@
-const FENIX_ICON_FONT_FAMILY = "Fenix Icons";
-const FENIX_ICON_FONT_VAR = `var(--fx-icon-font, ${FENIX_ICON_FONT_FAMILY})`;
-const FENIX_ICON_BASE_CSS = `
-.fx-icon {
-  font-family: ${FENIX_ICON_FONT_VAR};
-  font-weight: normal;
-  font-style: normal;
-  line-height: 1;
-  letter-spacing: normal;
-  text-transform: none;
-  display: inline-block;
-  white-space: nowrap;
-  word-wrap: normal;
-  direction: ltr;
-  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
-  -webkit-font-smoothing: antialiased;
-  text-rendering: optimizeLegibility;
-  user-select: none;
-}
-.fx-icon.fx-icon-fill { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24; }
-.fx-icon.fx-icon-bold { font-variation-settings: 'FILL' 0, 'wght' 600, 'GRAD' 0, 'opsz' 24; }
-`;
-function isFenixIconName(value) {
-  return /^[a-z][a-z0-9_]*$/.test(value.trim());
-}
-export {
-  FENIX_ICON_FONT_FAMILY as F,
-  FENIX_ICON_BASE_CSS as a,
-  isFenixIconName as i
-};
-//# sourceMappingURL=base-css-BifSeW2H.js.map

package/dist/assets/base-css-BifSeW2H.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"base-css-BifSeW2H.js","sources":["../../src/icons/base-css.ts"],"sourcesContent":["/**\n * CSS base da biblioteca de ícones — módulo LEVE (não importa a lista de nomes\n * nem dispara o carregamento da fonte). Usado dentro dos Shadow DOMs dos\n * componentes que suportam o atributo `icon`.\n *\n * O @font-face em si é injetado no <head> por `@wrrdev/fenix-ui/icons`\n * (ver ./index.ts) — @font-face registrado no documento também se aplica\n * dentro dos Shadow DOMs.\n */\n\n/** Nome da família de fontes dos ícones (self-hosted, sem dependência externa). */\nexport const FENIX_ICON_FONT_FAMILY = 'Fenix Icons';\n\n/** Família configurável via CSS custom property (fallback para o nome padrão). */\nexport const FENIX_ICON_FONT_VAR = `var(--fx-icon-font, ${FENIX_ICON_FONT_FAMILY})`;\n\n/**\n * Regras da classe `.fx-icon` para uso DENTRO de Shadow DOM\n * (concatene às `static styles` do componente).\n */\nexport const FENIX_ICON_BASE_CSS = `\n.fx-icon {\n  font-family: ${FENIX_ICON_FONT_VAR};\n  font-weight: normal;\n  font-style: normal;\n  line-height: 1;\n  letter-spacing: normal;\n  text-transform: none;\n  display: inline-block;\n  white-space: nowrap;\n  word-wrap: normal;\n  direction: ltr;\n  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;\n  -webkit-font-smoothing: antialiased;\n  text-rendering: optimizeLegibility;\n  user-select: none;\n}\n.fx-icon.fx-icon-fill { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24; }\n.fx-icon.fx-icon-bold { font-variation-settings: 'FILL' 0, 'wght' 600, 'GRAD' 0, 'opsz' 24; }\n`;\n\n/** Verifica se o valor parece um nome de ícone da Fenix Icons (e não emoji/texto livre). */\nexport function isFenixIconName(value: string): boolean {\n  return /^[a-z][a-z0-9_]*$/.test(value.trim());\n}\n"],"names":[],"mappings":"AAWO,MAAM,yBAAyB;AAG/B,MAAM,sBAAsB,uBAAuB,sBAAsB;AAMzE,MAAM,sBAAsB;AAAA;AAAA,iBAElB,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoB7B,SAAS,gBAAgB,OAAwB;AACtD,SAAO,oBAAoB,KAAK,MAAM,KAAA,CAAM;AAC9C;"}