@pine-ds/icons 3.1.0 → 3.3.0-rc.0

package/dist/collection/components/pds-icon/test/pds-icon.spec.js.map

@@ -1 +1 @@
-{"version":3,"file":"pds-icon.spec.js","sourceRoot":"","sources":["../../../../src/components/pds-icon/test/pds-icon.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAEtC,QAAQ,CAAC,UAAU,EAAE,GAAG,EAAE;EACxB,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;IACvB,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,WAAW,CAAC;MACjC,UAAU,EAAE,CAAC,OAAO,CAAC;MACrB,IAAI,EAAE,uBAAuB;KAC9B,CAAC,CAAC;IACH,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;KAMxB,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,sCAAsC,EAAE,KAAK,IAAI,EAAE;IACpD,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,WAAW,CAAC;MACjC,UAAU,EAAE,CAAC,OAAO,CAAC;MACrB,IAAI,EAAE,oCAAoC;KAC3C,CAAC,CAAC;IACH,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;KAMxB,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,oBAAoB,EAAE,KAAK,IAAI,EAAE;IAClC,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,WAAW,CAAC;MACjC,UAAU,EAAE,CAAC,OAAO,CAAC;MACrB,IAAI,EAAE,mCAAmC;KAC1C,CAAC,CAAC;IACH,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;KAMxB,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,yBAAyB,EAAE,KAAK,IAAI,EAAE;IACvC,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,WAAW,CAAC;MACjC,UAAU,EAAE,CAAC,OAAO,CAAC;MACrB,IAAI,EAAE,sCAAsC;KAC7C,CAAC,CAAC;IACH,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;KAMxB,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,yCAAyC,EAAE,KAAK,IAAI,EAAE;IACvD,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,WAAW,CAAC;MACjC,UAAU,EAAE,CAAC,OAAO,CAAC;MACrB,IAAI,EAAE,kDAAkD;KACzD,CAAC,CAAC;IACH,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;KAMxB,CAAC,CAAC;EACL,CAAC,CAAC,CAAC;AAEL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { PdsIcon } from '../pds-icon';\n\ndescribe('pds-icon', () => {\n  it('renders', async () => {\n    const { root } = await newSpecPage({\n      components: [PdsIcon],\n      html: '<pds-icon></pds-icon>',\n    });\n    expect(root).toEqualHtml(`\n      <pds-icon role=\"img\" size=\"regular\" style=\"height: 16px; width: 16px;\">\n        <mock:shadow-root>\n          <div class=\"icon-inner\"></div>\n        </mock:shadow-root>\n      </pds-icon>\n    `);\n  });\n\n  it('renders the correct size when passed', async () => {\n    const { root } = await newSpecPage({\n      components: [PdsIcon],\n      html: '<pds-icon size=\"small\"></pds-icon>',\n    });\n    expect(root).toEqualHtml(`\n      <pds-icon role=\"img\" size=\"small\" style=\"height: 12px; width: 12px;\">\n        <mock:shadow-root>\n          <div class=\"icon-inner\"></div>\n        </mock:shadow-root>\n      </pds-icon>\n    `);\n  });\n\n  it('allows custom size', async () => {\n    const { root } = await newSpecPage({\n      components: [PdsIcon],\n      html: '<pds-icon size=\"32px\"></pds-icon>',\n    });\n    expect(root).toEqualHtml(`\n      <pds-icon role=\"img\" size=\"32px\" style=\"height: 32px; width: 32px;\">\n        <mock:shadow-root>\n          <div class=\"icon-inner\"></div>\n        </mock:shadow-root>\n      </pds-icon>\n    `);\n  });\n\n  it('renders icon when found', async () => {\n    const { root } = await newSpecPage({\n      components: [PdsIcon],\n      html: '<pds-icon name=\"archive\"></pds-icon>',\n    });\n    expect(root).toEqualHtml(`\n      <pds-icon aria-label=\"archive\" name=\"archive\" role=\"img\" size=\"regular\" style=\"height: 16px; width: 16px;\">\n        <mock:shadow-root>\n          <div class=\"icon-inner\"></div>\n        </mock:shadow-root>\n      </pds-icon>\n    `);\n  });\n\n  it('add correct styles when color specified', async () => {\n    const { root } = await newSpecPage({\n      components: [PdsIcon],\n      html: '<pds-icon name=\"archive\" color=\"red\"></pds-icon>',\n    });\n    expect(root).toEqualHtml(`\n      <pds-icon aria-label=\"archive\" class=\"pds-color pds-color-red\" color=\"red\" name=\"archive\" role=\"img\" size=\"regular\" style=\"height: 16px; width: 16px; color: red\">\n        <mock:shadow-root>\n          <div class=\"icon-inner\"></div>\n        </mock:shadow-root>\n      </pds-icon>\n    `);\n  });\n\n});\n"]}
+{"version":3,"file":"pds-icon.spec.js","sourceRoot":"","sources":["../../../../src/components/pds-icon/test/pds-icon.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAEtC,QAAQ,CAAC,UAAU,EAAE,GAAG,EAAE;IACxB,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;QACvB,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,WAAW,CAAC;YACjC,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,uBAAuB;SAC9B,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;KAMxB,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,sCAAsC,EAAE,KAAK,IAAI,EAAE;QACpD,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,WAAW,CAAC;YACjC,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,oCAAoC;SAC3C,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;KAMxB,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,oBAAoB,EAAE,KAAK,IAAI,EAAE;QAClC,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,WAAW,CAAC;YACjC,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,mCAAmC;SAC1C,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;KAMxB,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yBAAyB,EAAE,KAAK,IAAI,EAAE;QACvC,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,WAAW,CAAC;YACjC,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,sCAAsC;SAC7C,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;KAMxB,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yCAAyC,EAAE,KAAK,IAAI,EAAE;QACvD,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,WAAW,CAAC;YACjC,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,kDAAkD;SACzD,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;KAMxB,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,2BAA2B,EAAE,KAAK,IAAI,EAAE;QACzC,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,WAAW,CAAC;YACjC,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,6DAA6D;SACpE,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;KAMxB,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,4CAA4C,EAAE,KAAK,IAAI,EAAE;QAC1D,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,OAAO,CAAC;YACrB,IAAI,EAAE,gEAAgE;SACvE,CAAC,CAAC;QAEH,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;QAEvB,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;KAMxB,CAAC,CAAC;QAEH,IAAI,IAAI,EAAE;YACR,IAAI,CAAC,IAAI,GAAG,OAAO,CAAC;SACrB;QACD,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;KAMxB,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AAGL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { PdsIcon } from '../pds-icon';\n\ndescribe('pds-icon', () => {\n  it('renders', async () => {\n    const { root } = await newSpecPage({\n      components: [PdsIcon],\n      html: '<pds-icon></pds-icon>',\n    });\n    expect(root).toEqualHtml(`\n      <pds-icon role=\"img\" size=\"regular\" style=\"height: 16px; width: 16px;\">\n        <mock:shadow-root>\n          <div class=\"icon-inner\"></div>\n        </mock:shadow-root>\n      </pds-icon>\n    `);\n  });\n\n  it('renders the correct size when passed', async () => {\n    const { root } = await newSpecPage({\n      components: [PdsIcon],\n      html: '<pds-icon size=\"small\"></pds-icon>',\n    });\n    expect(root).toEqualHtml(`\n      <pds-icon role=\"img\" size=\"small\" style=\"height: 12px; width: 12px;\">\n        <mock:shadow-root>\n          <div class=\"icon-inner\"></div>\n        </mock:shadow-root>\n      </pds-icon>\n    `);\n  });\n\n  it('allows custom size', async () => {\n    const { root } = await newSpecPage({\n      components: [PdsIcon],\n      html: '<pds-icon size=\"32px\"></pds-icon>',\n    });\n    expect(root).toEqualHtml(`\n      <pds-icon role=\"img\" size=\"32px\" style=\"height: 32px; width: 32px;\">\n        <mock:shadow-root>\n          <div class=\"icon-inner\"></div>\n        </mock:shadow-root>\n      </pds-icon>\n    `);\n  });\n\n  it('renders icon when found', async () => {\n    const { root } = await newSpecPage({\n      components: [PdsIcon],\n      html: '<pds-icon name=\"archive\"></pds-icon>',\n    });\n    expect(root).toEqualHtml(`\n      <pds-icon aria-label=\"archive\" name=\"archive\" role=\"img\" size=\"regular\" style=\"height: 16px; width: 16px;\">\n        <mock:shadow-root>\n          <div class=\"icon-inner\"></div>\n        </mock:shadow-root>\n      </pds-icon>\n    `);\n  });\n\n  it('add correct styles when color specified', async () => {\n    const { root } = await newSpecPage({\n      components: [PdsIcon],\n      html: '<pds-icon name=\"archive\" color=\"red\"></pds-icon>',\n    });\n    expect(root).toEqualHtml(`\n      <pds-icon aria-label=\"archive\" class=\"pds-color pds-color-red\" color=\"red\" name=\"archive\" role=\"img\" size=\"regular\" style=\"height: 16px; width: 16px; color: red\">\n        <mock:shadow-root>\n          <div class=\"icon-inner\"></div>\n        </mock:shadow-root>\n      </pds-icon>\n    `);\n  });\n\n  it('renders custom aria-label', async () => {\n    const { root } = await newSpecPage({\n      components: [PdsIcon],\n      html: `<pds-icon name=\"star\" aria-label=\"custom label\"></pds-icon>`,\n    });\n\n    expect(root).toEqualHtml(`\n      <pds-icon name=\"star\" role=\"img\" aria-label=\"custom label\" size=\"regular\" style=\"height: 16px; width: 16px;\">\n        <mock:shadow-root>\n          <div class=\"icon-inner\"></div>\n        </mock:shadow-root>\n      </pds-icon>\n    `);\n  });\n\n  it('renders custom label after changing source', async () => {\n    const page = await newSpecPage({\n      components: [PdsIcon],\n      html: `<pds-icon name=\"youtube\" aria-label=\"custom label\"></pds-icon>`,\n    });\n\n    const icon = page.root;\n\n    expect(icon).toEqualHtml(`\n      <pds-icon name=\"youtube\" role=\"img\" aria-label=\"custom label\" size=\"regular\" style=\"height: 16px; width: 16px;\">\n        <mock:shadow-root>\n          <div class=\"icon-inner\"></div>\n        </mock:shadow-root>\n      </pds-icon>\n    `);\n\n    if (icon) {\n      icon.name = 'trash';\n    }\n    await page.waitForChanges();\n\n    expect(icon).toEqualHtml(`\n      <pds-icon name=\"trash\" role=\"img\" aria-label=\"custom label\" size=\"regular\" style=\"height: 16px; width: 16px;\">\n        <mock:shadow-root>\n          <div class=\"icon-inner\"></div>\n        </mock:shadow-root>\n      </pds-icon>\n    `);\n  });\n\n\n});\n"]}

package/dist/collection/components/pds-icon/utils.js

@@ -1,56 +1,66 @@
 import { getAssetPath } from "@stencil/core";
 let CACHED_MAP;
 export const addIcons = (icons) => {
-  const map = getIconMap();
-  Object.keys(icons).forEach(name => map.set(name, icons[name]));
+    const map = getIconMap();
+    Object.keys(icons).forEach(name => map.set(name, icons[name]));
 };
 export const getIconMap = () => {
-  if (typeof window === 'undefined') {
-    return new Map();
-  }
-  else {
-    if (!CACHED_MAP) {
-      const win = window; // eslint-disable-line @typescript-eslint/no-explicit-any
-      win.PdsIcons = win.PdsIcons || {};
-      CACHED_MAP = win.PdsIcons.map = win.PdsIcons.map || new Map();
+    if (typeof window === 'undefined') {
+        return new Map();
+    }
+    else {
+        if (!CACHED_MAP) {
+            const win = window; // eslint-disable-line @typescript-eslint/no-explicit-any
+            win.PdsIcons = win.PdsIcons || {};
+            CACHED_MAP = win.PdsIcons.map = win.PdsIcons.map || new Map();
+        }
+        return CACHED_MAP;
     }
-    return CACHED_MAP;
-  }
 };
-export const getName = (iconName) => {
-  if (isStr(iconName)) {
-    iconName = toLower(iconName);
-  }
-  if (!isStr(iconName) || iconName.trim() === '') {
-    return null;
-  }
-  const invalidChars = iconName.replace(/[a-z]|-|\d/gi, '');
-  if (invalidChars != '') {
-    return null;
-  }
-  return iconName;
+export const getName = (iconName, icon) => {
+    if (!iconName && icon && !isSrc(icon)) {
+        iconName = icon;
+    }
+    if (isStr(iconName)) {
+        iconName = toLower(iconName);
+    }
+    if (!isStr(iconName) || iconName.trim() === '') {
+        return null;
+    }
+    const invalidChars = iconName.replace(/[a-z]|-|\d/gi, '');
+    if (invalidChars != '') {
+        return null;
+    }
+    return iconName;
 };
 const getNamedUrl = (iconName) => {
-  const url = getIconMap().get(iconName);
-  if (url) {
-    return url;
-  }
-  return getAssetPath(`svg/${iconName}.svg`);
+    const url = getIconMap().get(iconName);
+    if (url) {
+        return url;
+    }
+    return getAssetPath(`svg/${iconName}.svg`);
 };
 export const getSrc = (src) => {
-  if (isStr(src)) {
-    src = src.trim();
-    if (isSrc(src)) {
-      return src;
+    if (isStr(src)) {
+        src = src.trim();
+        if (isSrc(src)) {
+            return src;
+        }
     }
-  }
-  return null;
+    return null;
 };
-export const getUrl = (icon) => {
-  const url = getName(icon.name);
-  if (url) {
-    return getNamedUrl(url);
-  }
+export const getUrl = (pdsIcon) => {
+    let url = getName(pdsIcon.name, pdsIcon.icon);
+    if (url) {
+        return getNamedUrl(url);
+    }
+    if (pdsIcon.icon) {
+        url = getSrc(pdsIcon.icon);
+        if (url) {
+            return url;
+        }
+    }
+    return null;
 };
 export const isSrc = (str) => str.length > 0 && /(\/|\.)/.test(str);
 export const isStr = (val) => typeof val === 'string'; // eslint-disable-line @typescript-eslint/no-explicit-any
@@ -66,16 +76,16 @@ export const toLower = (val) => val.toLowerCase();
  * does not trigger a re-render.
  */
 export const inheritAttributes = (el, attributes = []) => {
-  const attributeObject = {}; // eslint-disable-line @typescript-eslint/no-explicit-any
-  attributes.forEach(attr => {
-    if (el.hasAttribute(attr)) {
-      const value = el.getAttribute(attr);
-      if (value !== null) {
-        attributeObject[attr] = el.getAttribute(attr);
-      }
-      el.removeAttribute(attr);
-    }
-  });
-  return attributeObject;
+    const attributeObject = {}; // eslint-disable-line @typescript-eslint/no-explicit-any
+    attributes.forEach(attr => {
+        if (el.hasAttribute(attr)) {
+            const value = el.getAttribute(attr);
+            if (value !== null) {
+                attributeObject[attr] = el.getAttribute(attr);
+            }
+            el.removeAttribute(attr);
+        }
+    });
+    return attributeObject;
 };
 //# sourceMappingURL=utils.js.map

package/dist/collection/components/pds-icon/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/pds-icon/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import { getAssetPath } from '@stencil/core';\nimport { PdsIcon } from './pds-icon';\n\nlet CACHED_MAP: Map<string, string>;\n\nexport const addIcons = (icons: { [name: string]: string; }) => {\n  const map = getIconMap();\n  Object.keys(icons).forEach(name => map.set(name, icons[name]));\n}\n\nexport const getIconMap = (): Map<string, string> => {\n  if (typeof window === 'undefined') {\n    return new Map();\n  }  else {\n    if (!CACHED_MAP) {\n      const win = window as any; // eslint-disable-line @typescript-eslint/no-explicit-any\n      win.PdsIcons = win.PdsIcons || {};\n      CACHED_MAP = win.PdsIcons.map = win.PdsIcons.map || new Map();\n    }\n\n    return CACHED_MAP;\n  }\n}\n\nexport const getName = (iconName: string | undefined) => {\n  if (isStr(iconName)) {\n    iconName = toLower(iconName);\n  }\n\n  if (!isStr(iconName) || iconName.trim() === '') {\n    return null;\n  }\n\n  const invalidChars = iconName.replace(/[a-z]|-|\\d/gi,'');\n  if (invalidChars != '') { return null; }\n\n  return iconName;\n}\n\nconst getNamedUrl = (iconName: string) => {\n  const url = getIconMap().get(iconName);\n  if (url) {\n    return url;\n  }\n\n  return getAssetPath(`svg/${iconName}.svg`);\n};\n\nexport const getSrc = (src: string | undefined) => {\n  if (isStr(src)) {\n    src = src.trim();\n\n    if (isSrc(src)) {\n      return src;\n    }\n  }\n\n  return null;\n}\n\nexport const getUrl = (icon: PdsIcon) => {\n  const url = getName(icon.name);\n  if (url) {\n    return getNamedUrl(url);\n  }\n};\n\n\nexport const isSrc = (str: string) => str.length > 0 && /(\\/|\\.)/.test(str);\nexport const isStr = (val: any): val is string => typeof val === 'string'; // eslint-disable-line @typescript-eslint/no-explicit-any\nexport const toLower = (val: string) => val.toLowerCase();\n\n/**\n * Elements inside of web components sometimes need to inherit global attributes\n * set on the host. For example, the inner input in `ion-input` should inherit\n * the `title` attribute that developers set directly on `ion-input`. This\n * helper function should be called in componentWillLoad and assigned to a variable\n * that is later used in the render function.\n *\n * This does not need to be reactive as changing attributes on the host element\n * does not trigger a re-render.\n */\n export const inheritAttributes = (el: HTMLElement, attributes: string[] = []) => {\n  const attributeObject: { [k: string]: any } = {}; // eslint-disable-line @typescript-eslint/no-explicit-any\n\n  attributes.forEach(attr => {\n    if (el.hasAttribute(attr)) {\n      const value = el.getAttribute(attr);\n      if (value !== null) {\n        attributeObject[attr] = el.getAttribute(attr);\n      }\n      el.removeAttribute(attr);\n    }\n  });\n\n  return attributeObject;\n}\n"]}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/pds-icon/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import { getAssetPath } from '@stencil/core';\nimport { PdsIcon } from './pds-icon';\n\nlet CACHED_MAP: Map<string, string>;\n\nexport const addIcons = (icons: { [name: string]: string; }) => {\n  const map = getIconMap();\n  Object.keys(icons).forEach(name => map.set(name, icons[name]));\n}\n\nexport const getIconMap = (): Map<string, string> => {\n  if (typeof window === 'undefined') {\n    return new Map();\n  }  else {\n    if (!CACHED_MAP) {\n      const win = window as any; // eslint-disable-line @typescript-eslint/no-explicit-any\n      win.PdsIcons = win.PdsIcons || {};\n      CACHED_MAP = win.PdsIcons.map = win.PdsIcons.map || new Map();\n    }\n\n    return CACHED_MAP;\n  }\n}\n\nexport const getName = (\n  iconName: string | undefined,\n  icon: string | undefined\n  ) => {\n\n  if(!iconName && icon && !isSrc(icon)) {\n    iconName = icon;\n  }\n\n  if (isStr(iconName)) {\n    iconName = toLower(iconName);\n  }\n\n  if (!isStr(iconName) || iconName.trim() === '') {\n    return null;\n  }\n\n  const invalidChars = iconName.replace(/[a-z]|-|\\d/gi,'');\n  if (invalidChars != '') { return null; }\n\n  return iconName;\n}\n\nconst getNamedUrl = (iconName: string) => {\n  const url = getIconMap().get(iconName);\n  if (url) {\n    return url;\n  }\n\n  return getAssetPath(`svg/${iconName}.svg`);\n};\n\nexport const getSrc = (src: string | undefined) => {\n  if (isStr(src)) {\n    src = src.trim();\n\n    if (isSrc(src)) {\n      return src;\n    }\n  }\n\n  return null;\n}\n\nexport const getUrl = (pdsIcon: PdsIcon) => {\n  let url = getName(pdsIcon.name, pdsIcon.icon);\n  if (url) {\n    return getNamedUrl(url);\n  }\n\n  if (pdsIcon.icon) {\n    url = getSrc(pdsIcon.icon);\n\n    if(url) {\n      return url;\n    }\n  }\n\n  return null;\n};\n\n\nexport const isSrc = (str: string) => str.length > 0 && /(\\/|\\.)/.test(str);\nexport const isStr = (val: any): val is string => typeof val === 'string'; // eslint-disable-line @typescript-eslint/no-explicit-any\nexport const toLower = (val: string) => val.toLowerCase();\n\n/**\n * Elements inside of web components sometimes need to inherit global attributes\n * set on the host. For example, the inner input in `ion-input` should inherit\n * the `title` attribute that developers set directly on `ion-input`. This\n * helper function should be called in componentWillLoad and assigned to a variable\n * that is later used in the render function.\n *\n * This does not need to be reactive as changing attributes on the host element\n * does not trigger a re-render.\n */\n export const inheritAttributes = (el: HTMLElement, attributes: string[] = []) => {\n  const attributeObject: { [k: string]: any } = {}; // eslint-disable-line @typescript-eslint/no-explicit-any\n\n  attributes.forEach(attr => {\n    if (el.hasAttribute(attr)) {\n      const value = el.getAttribute(attr);\n      if (value !== null) {\n        attributeObject[attr] = el.getAttribute(attr);\n      }\n      el.removeAttribute(attr);\n    }\n  });\n\n  return attributeObject;\n}\n"]}

package/dist/collection/components/pds-icon/validate.js

@@ -1,44 +1,44 @@
 import { isStr } from "./utils";
 export const validateContent = (svgContent) => {
-  const div = document.createElement('div');
-  div.innerHTML = svgContent;
-  // setup this way to ensure it works on our buddy IE
-  for (let i = div.childNodes.length - 1; i >= 0; i--) {
-    if (div.childNodes[i].nodeName.toLowerCase() !== 'svg') {
-      div.removeChild(div.childNodes[i]);
+    const div = document.createElement('div');
+    div.innerHTML = svgContent;
+    // setup this way to ensure it works on our buddy IE
+    for (let i = div.childNodes.length - 1; i >= 0; i--) {
+        if (div.childNodes[i].nodeName.toLowerCase() !== 'svg') {
+            div.removeChild(div.childNodes[i]);
+        }
     }
-  }
-  // must only have 1 root element
-  const svgElm = div.firstElementChild;
-  if (svgElm && svgElm.nodeName.toLowerCase() === 'svg') {
-    const svgClass = svgElm.getAttribute('class') || '';
-    svgElm.setAttribute('class', (svgClass + ' s-ion-icon').trim());
-    // root element must be an svg
-    // lets double check we've got valid elements
-    // do not allow scripts
-    if (isValid(svgElm)) {
-      return div.innerHTML;
+    // must only have 1 root element
+    const svgElm = div.firstElementChild;
+    if (svgElm && svgElm.nodeName.toLowerCase() === 'svg') {
+        const svgClass = svgElm.getAttribute('class') || '';
+        svgElm.setAttribute('class', (svgClass + ' s-ion-icon').trim());
+        // root element must be an svg
+        // lets double check we've got valid elements
+        // do not allow scripts
+        if (isValid(svgElm)) {
+            return div.innerHTML;
+        }
     }
-  }
-  return '';
+    return '';
 };
 export const isValid = (elm) => {
-  if (elm.nodeType === 1) {
-    if (elm.nodeName.toLowerCase() === 'script') {
-      return false;
+    if (elm.nodeType === 1) {
+        if (elm.nodeName.toLowerCase() === 'script') {
+            return false;
+        }
+        for (let i = 0; i < elm.attributes.length; i++) {
+            const name = elm.attributes[i].name;
+            if (isStr(name) && name.toLowerCase().indexOf('on') === 0) {
+                return false;
+            }
+        }
+        for (let i = 0; i < elm.childNodes.length; i++) {
+            if (!isValid(elm.childNodes[i])) {
+                return false;
+            }
+        }
     }
-    for (let i = 0; i < elm.attributes.length; i++) {
-      const name = elm.attributes[i].name;
-      if (isStr(name) && name.toLowerCase().indexOf('on') === 0) {
-        return false;
-      }
-    }
-    for (let i = 0; i < elm.childNodes.length; i++) {
-      if (!isValid(elm.childNodes[i])) {
-        return false;
-      }
-    }
-  }
-  return true;
+    return true;
 };
 //# sourceMappingURL=validate.js.map

package/dist/collection/components/pds-icon/validate.js.map

@@ -1 +1 @@
-{"version":3,"file":"validate.js","sourceRoot":"","sources":["../../../src/components/pds-icon/validate.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEhC,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,UAAkB,EAAE,EAAE;EACpD,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;EAC1C,GAAG,CAAC,SAAS,GAAG,UAAU,CAAC;EAE3B,oDAAoD;EACpD,KAAK,IAAI,CAAC,GAAG,GAAG,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,EAAE;IACnD,IAAI,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,WAAW,EAAE,KAAK,KAAK,EAAE;MACtD,GAAG,CAAC,WAAW,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC;KACpC;GACF;EAED,gCAAgC;EAChC,MAAM,MAAM,GAAG,GAAG,CAAC,iBAAiB,CAAC;EACrC,IAAI,MAAM,IAAI,MAAM,CAAC,QAAQ,CAAC,WAAW,EAAE,KAAK,KAAK,EAAE;IACrD,MAAM,QAAQ,GAAG,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;IACpD,MAAM,CAAC,YAAY,CAAC,OAAO,EAAE,CAAC,QAAQ,GAAG,aAAa,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;IAEhE,8BAA8B;IAC9B,6CAA6C;IAC7C,uBAAuB;IACvB,IAAI,OAAO,CAAC,MAAqB,CAAC,EAAE;MAClC,OAAO,GAAG,CAAC,SAAS,CAAC;KACtB;GACF;EACD,OAAO,EAAE,CAAC;AACZ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,GAAgB,EAAE,EAAE;EAC1C,IAAI,GAAG,CAAC,QAAQ,KAAK,CAAC,EAAE;IACtB,IAAI,GAAG,CAAC,QAAQ,CAAC,WAAW,EAAE,KAAK,QAAQ,EAAE;MAC3C,OAAO,KAAK,CAAC;KACd;IAED,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,GAAG,CAAC,UAAU,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;MAC9C,MAAM,IAAI,GAAG,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;MACpC,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;QACzD,OAAO,KAAK,CAAC;OACd;KACF;IAED,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,GAAG,CAAC,UAAU,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;MAC9C,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,CAAgB,CAAC,EAAE;QAC9C,OAAO,KAAK,CAAC;OACd;KACF;GACF;EACD,OAAO,IAAI,CAAC;AACd,CAAC,CAAC","sourcesContent":["import { isStr } from './utils';\n\nexport const validateContent = (svgContent: string) => {\n  const div = document.createElement('div');\n  div.innerHTML = svgContent;\n\n  // setup this way to ensure it works on our buddy IE\n  for (let i = div.childNodes.length - 1; i >= 0; i--) {\n    if (div.childNodes[i].nodeName.toLowerCase() !== 'svg') {\n      div.removeChild(div.childNodes[i]);\n    }\n  }\n\n  // must only have 1 root element\n  const svgElm = div.firstElementChild;\n  if (svgElm && svgElm.nodeName.toLowerCase() === 'svg') {\n    const svgClass = svgElm.getAttribute('class') || '';\n    svgElm.setAttribute('class', (svgClass + ' s-ion-icon').trim());\n\n    // root element must be an svg\n    // lets double check we've got valid elements\n    // do not allow scripts\n    if (isValid(svgElm as HTMLElement)) {\n      return div.innerHTML;\n    }\n  }\n  return '';\n};\n\nexport const isValid = (elm: HTMLElement) => {\n  if (elm.nodeType === 1) {\n    if (elm.nodeName.toLowerCase() === 'script') {\n      return false;\n    }\n\n    for (let i = 0; i < elm.attributes.length; i++) {\n      const name = elm.attributes[i].name;\n      if (isStr(name) && name.toLowerCase().indexOf('on') === 0) {\n        return false;\n      }\n    }\n\n    for (let i = 0; i < elm.childNodes.length; i++) {\n      if (!isValid(elm.childNodes[i] as HTMLElement)) {\n        return false;\n      }\n    }\n  }\n  return true;\n};\n"]}
+{"version":3,"file":"validate.js","sourceRoot":"","sources":["../../../src/components/pds-icon/validate.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEhC,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,UAAkB,EAAE,EAAE;IACpD,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC1C,GAAG,CAAC,SAAS,GAAG,UAAU,CAAC;IAE3B,oDAAoD;IACpD,KAAK,IAAI,CAAC,GAAG,GAAG,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,EAAE;QACnD,IAAI,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,WAAW,EAAE,KAAK,KAAK,EAAE;YACtD,GAAG,CAAC,WAAW,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC;SACpC;KACF;IAED,gCAAgC;IAChC,MAAM,MAAM,GAAG,GAAG,CAAC,iBAAiB,CAAC;IACrC,IAAI,MAAM,IAAI,MAAM,CAAC,QAAQ,CAAC,WAAW,EAAE,KAAK,KAAK,EAAE;QACrD,MAAM,QAAQ,GAAG,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;QACpD,MAAM,CAAC,YAAY,CAAC,OAAO,EAAE,CAAC,QAAQ,GAAG,aAAa,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;QAEhE,8BAA8B;QAC9B,6CAA6C;QAC7C,uBAAuB;QACvB,IAAI,OAAO,CAAC,MAAqB,CAAC,EAAE;YAClC,OAAO,GAAG,CAAC,SAAS,CAAC;SACtB;KACF;IACD,OAAO,EAAE,CAAC;AACZ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,GAAgB,EAAE,EAAE;IAC1C,IAAI,GAAG,CAAC,QAAQ,KAAK,CAAC,EAAE;QACtB,IAAI,GAAG,CAAC,QAAQ,CAAC,WAAW,EAAE,KAAK,QAAQ,EAAE;YAC3C,OAAO,KAAK,CAAC;SACd;QAED,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,GAAG,CAAC,UAAU,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YAC9C,MAAM,IAAI,GAAG,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;YACpC,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;gBACzD,OAAO,KAAK,CAAC;aACd;SACF;QAED,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,GAAG,CAAC,UAAU,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YAC9C,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,CAAgB,CAAC,EAAE;gBAC9C,OAAO,KAAK,CAAC;aACd;SACF;KACF;IACD,OAAO,IAAI,CAAC;AACd,CAAC,CAAC","sourcesContent":["import { isStr } from './utils';\n\nexport const validateContent = (svgContent: string) => {\n  const div = document.createElement('div');\n  div.innerHTML = svgContent;\n\n  // setup this way to ensure it works on our buddy IE\n  for (let i = div.childNodes.length - 1; i >= 0; i--) {\n    if (div.childNodes[i].nodeName.toLowerCase() !== 'svg') {\n      div.removeChild(div.childNodes[i]);\n    }\n  }\n\n  // must only have 1 root element\n  const svgElm = div.firstElementChild;\n  if (svgElm && svgElm.nodeName.toLowerCase() === 'svg') {\n    const svgClass = svgElm.getAttribute('class') || '';\n    svgElm.setAttribute('class', (svgClass + ' s-ion-icon').trim());\n\n    // root element must be an svg\n    // lets double check we've got valid elements\n    // do not allow scripts\n    if (isValid(svgElm as HTMLElement)) {\n      return div.innerHTML;\n    }\n  }\n  return '';\n};\n\nexport const isValid = (elm: HTMLElement) => {\n  if (elm.nodeType === 1) {\n    if (elm.nodeName.toLowerCase() === 'script') {\n      return false;\n    }\n\n    for (let i = 0; i < elm.attributes.length; i++) {\n      const name = elm.attributes[i].name;\n      if (isStr(name) && name.toLowerCase().indexOf('on') === 0) {\n        return false;\n      }\n    }\n\n    for (let i = 0; i < elm.childNodes.length; i++) {\n      if (!isValid(elm.childNodes[i] as HTMLElement)) {\n        return false;\n      }\n    }\n  }\n  return true;\n};\n"]}

package/dist/docs.json

@@ -1,8 +1,8 @@
 {
-  "timestamp": "2023-11-30T11:05:15",
+  "timestamp": "2023-12-13T15:58:43",
   "compiler": {
     "name": "@stencil/core",
-    "version": "4.4.0",
+    "version": "4.8.1",
     "typescriptVersion": "5.2.2"
   },
   "components": [
@@ -36,6 +36,27 @@
           "optional": true,
           "required": false
         },
+        {
+          "name": "icon",
+          "type": "any",
+          "complexType": {
+            "original": "any",
+            "resolved": "any",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "icon",
+          "reflectToAttr": false,
+          "docs": "This a combination of both `name` and `src`. If a `src` url is detected\nit will set the `src` property. Otherwise it assumes it's a built-in named\nSVG and set the `name` property.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "any"
+            }
+          ],
+          "optional": true,
+          "required": false
+        },
         {
           "name": "name",
           "type": "string",

package/dist/esm/{index-8effeb27.js → index-d1a605fc.js}

@@ -31,6 +31,13 @@ const uniqueTime = (key, measureText) => {
     }
 };
 const HYDRATED_CSS = '{visibility:hidden}.hydrated{visibility:inherit}';
+/**
+ * Constant for styles to be globally applied to `slot-fb` elements for pseudo-slot behavior.
+ *
+ * Two cascading rules must be used instead of a `:not()` selector due to Stencil browser
+ * support as of Stencil v4.
+ */
+const SLOT_FB_CSS = 'slot-fb{display:contents}slot-fb[hidden]{display:none}';
 const XLINK_NS = 'http://www.w3.org/1999/xlink';
 /**
  * Default style mode id
@@ -257,6 +264,10 @@ const addStyle = (styleContainerNode, cmpMeta, mode) => {
                     }
                     styleContainerNode.insertBefore(styleElm, styleContainerNode.querySelector('link'));
                 }
+                // Add styles for `slot-fb` elements if we're using slots outside the Shadow DOM
+                if (cmpMeta.$flags$ & 4 /* CMP_FLAGS.hasSlotRelocation */) {
+                    styleElm.innerHTML += SLOT_FB_CSS;
+                }
                 if (appliedStyles) {
                     appliedStyles.add(scopeId);
                 }
@@ -387,11 +398,19 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
                 // except for the first character, we keep the event name case
                 memberName = ln[2] + memberName.slice(3);
             }
-            if (oldValue) {
-                plt.rel(elm, memberName, oldValue, false);
-            }
-            if (newValue) {
-                plt.ael(elm, memberName, newValue, false);
+            if (oldValue || newValue) {
+                // Need to account for "capture" events.
+                // If the event name ends with "Capture", we'll update the name to remove
+                // the "Capture" suffix and make sure the event listener is setup to handle the capture event.
+                const capture = memberName.endsWith(CAPTURE_EVENT_SUFFIX);
+                // Make sure we only replace the last instance of "Capture"
+                memberName = memberName.replace(CAPTURE_EVENT_REGEX, '');
+                if (oldValue) {
+                    plt.rel(elm, memberName, oldValue, capture);
+                }
+                if (newValue) {
+                    plt.ael(elm, memberName, newValue, capture);
+                }
             }
         }
         else {
@@ -413,7 +432,11 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
                         elm[memberName] = newValue;
                     }
                 }
-                catch (e) { }
+                catch (e) {
+                    /**
+                     * in case someone tries to set a read-only property, e.g. "namespaceURI", we just ignore it
+                     */
+                }
             }
             /**
              * Need to manually update attribute if:
@@ -452,7 +475,14 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
     }
 };
 const parseClassListRegex = /\s/;
+/**
+ * Parsed a string of classnames into an array
+ * @param value className string, e.g. "foo bar baz"
+ * @returns list of classes, e.g. ["foo", "bar", "baz"]
+ */
 const parseClassList = (value) => (!value ? [] : value.split(parseClassListRegex));
+const CAPTURE_EVENT_SUFFIX = 'Capture';
+const CAPTURE_EVENT_REGEX = new RegExp(CAPTURE_EVENT_SUFFIX + '$');
 const updateElement = (oldVnode, newVnode, isSvgMode, memberName) => {
     // if the element passed in is a shadow root, which is a document fragment
     // then we want to be adding attrs/props to the shadow root's "host" element
@@ -861,9 +891,9 @@ const patch = (oldVNode, newVNode) => {
     }
 };
 /**
- * 'Nullify' any VDom `ref` callbacks on a VDom node or its children by
- * calling them with `null`. This signals that the DOM element corresponding to
- * the VDom node has been removed from the DOM.
+ * 'Nullify' any VDom `ref` callbacks on a VDom node or its children by calling
+ * them with `null`. This signals that the DOM element corresponding to the VDom
+ * node has been removed from the DOM.
  *
  * @param vNode a virtual DOM node
  */
@@ -1230,13 +1260,13 @@ const setValue = (ref, propName, newVal, cmpMeta) => {
  */
 const proxyComponent = (Cstr, cmpMeta, flags) => {
     var _a;
+    const prototype = Cstr.prototype;
     if (cmpMeta.$members$) {
         if (Cstr.watchers) {
             cmpMeta.$watchers$ = Cstr.watchers;
         }
         // It's better to have a const than two Object.entries()
         const members = Object.entries(cmpMeta.$members$);
-        const prototype = Cstr.prototype;
         members.map(([memberName, [memberFlags]]) => {
             if ((memberFlags & 31 /* MEMBER_FLAGS.Prop */ ||
                     ((flags & 2 /* PROXY_FLAGS.proxyState */) && memberFlags & 32 /* MEMBER_FLAGS.State */))) {
@@ -1259,6 +1289,7 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
             const attrNameToPropName = new Map();
             prototype.attributeChangedCallback = function (attrName, oldValue, newValue) {
                 plt.jmp(() => {
+                    var _a;
                     const propName = attrNameToPropName.get(attrName);
                     //  In a web component lifecycle the attributeChangedCallback runs prior to connectedCallback
                     //  in the case where an attribute was set inline.
@@ -1314,11 +1345,12 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
                         // 1. The instance is ready
                         // 2. The watchers are ready
                         // 3. The value has changed
-                        if (!(flags & 8 /* HOST_FLAGS.isConstructingInstance */) &&
+                        if (flags &&
+                            !(flags & 8 /* HOST_FLAGS.isConstructingInstance */) &&
                             flags & 128 /* HOST_FLAGS.isWatchReady */ &&
                             newValue !== oldValue) {
                             const instance = hostRef.$lazyInstance$ ;
-                            const entry = cmpMeta.$watchers$[attrName];
+                            const entry = (_a = cmpMeta.$watchers$) === null || _a === void 0 ? void 0 : _a[attrName];
                             entry === null || entry === void 0 ? void 0 : entry.forEach((callbackName) => {
                                 if (instance[callbackName] != null) {
                                     instance[callbackName].call(instance, newValue, oldValue, attrName);
@@ -1340,10 +1372,11 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
                 ...members
                     .filter(([_, m]) => m[0] & 15 /* MEMBER_FLAGS.HasAttribute */)
                     .map(([propName, m]) => {
+                    var _a;
                     const attrName = m[1] || propName;
                     attrNameToPropName.set(attrName, propName);
                     if (m[0] & 512 /* MEMBER_FLAGS.ReflectAttr */) {
-                        cmpMeta.$attrsToReflect$.push([propName, attrName]);
+                        (_a = cmpMeta.$attrsToReflect$) === null || _a === void 0 ? void 0 : _a.push([propName, attrName]);
                     }
                     return attrName;
                 }),
@@ -1352,7 +1385,18 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
     }
     return Cstr;
 };
-const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId, Cstr) => {
+/**
+ * Initialize a Stencil component given a reference to its host element, its
+ * runtime bookkeeping data structure, runtime metadata about the component,
+ * and (optionally) an HMR version ID.
+ *
+ * @param elm a host element
+ * @param hostRef the element's runtime bookkeeping object
+ * @param cmpMeta runtime metadata for the Stencil component
+ * @param hmrVersionId an (optional) HMR version ID
+ */
+const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
+    let Cstr;
     // initializeComponent
     if ((hostRef.$flags$ & 32 /* HOST_FLAGS.hasInitializedComponent */) === 0) {
         // Let the runtime know that the component has been initialized
@@ -1510,12 +1554,13 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
     const customElements = win.customElements;
     const head = doc.head;
     const metaCharset = /*@__PURE__*/ head.querySelector('meta[charset]');
-    const visibilityStyle = /*@__PURE__*/ doc.createElement('style');
+    const dataStyles = /*@__PURE__*/ doc.createElement('style');
     const deferredConnectedCallbacks = [];
     let appLoadFallback;
     let isBootstrapping = true;
     Object.assign(plt, options);
     plt.$resourcesUrl$ = new URL(options.resourcesUrl || './', doc.baseURI).href;
+    let hasSlotRelocation = false;
     lazyBundles.map((lazyBundle) => {
         lazyBundle[1].map((compactMeta) => {
             var _a;
@@ -1525,6 +1570,11 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
                 $members$: compactMeta[2],
                 $listeners$: compactMeta[3],
             };
+            // Check if we are using slots outside the shadow DOM in this component.
+            // We'll use this information later to add styles for `slot-fb` elements
+            if (cmpMeta.$flags$ & 4 /* CMP_FLAGS.hasSlotRelocation */) {
+                hasSlotRelocation = true;
+            }
             {
                 cmpMeta.$members$ = compactMeta[2];
             }
@@ -1581,15 +1631,25 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
             }
         });
     });
+    // Add styles for `slot-fb` elements if any of our components are using slots outside the Shadow DOM
+    if (hasSlotRelocation) {
+        dataStyles.innerHTML += SLOT_FB_CSS;
+    }
+    // Add hydration styles
     {
-        visibilityStyle.innerHTML = cmpTags + HYDRATED_CSS;
-        visibilityStyle.setAttribute('data-styles', '');
+        dataStyles.innerHTML += cmpTags + HYDRATED_CSS;
+    }
+    // If we have styles, add them to the DOM
+    if (dataStyles.innerHTML.length) {
+        dataStyles.setAttribute('data-styles', '');
         // Apply CSP nonce to the style tag if it exists
         const nonce = (_a = plt.$nonce$) !== null && _a !== void 0 ? _a : queryNonceMetaTagContent(doc);
         if (nonce != null) {
-            visibilityStyle.setAttribute('nonce', nonce);
+            dataStyles.setAttribute('nonce', nonce);
         }
-        head.insertBefore(visibilityStyle, metaCharset ? metaCharset.nextSibling : head.firstChild);
+        // Insert the styles into the document head
+        // NOTE: this _needs_ to happen last so we can ensure the nonce (and other attributes) are applied
+        head.insertBefore(dataStyles, metaCharset ? metaCharset.nextSibling : head.firstChild);
     }
     // Process deferred connectedCallbacks now all components have been registered
     isBootstrapping = false;
@@ -1741,9 +1801,9 @@ const flush = () => {
         }
     }
 };
-const nextTick = /*@__PURE__*/ (cb) => promiseResolve().then(cb);
+const nextTick = (cb) => promiseResolve().then(cb);
 const writeTask = /*@__PURE__*/ queueTask(queueDomWrites, true);
 
 export { Host as H, getElement as a, bootstrapLazy as b, getAssetPath as g, h, promiseResolve as p, registerInstance as r, setNonce as s };
 
-//# sourceMappingURL=index-8effeb27.js.map
+//# sourceMappingURL=index-d1a605fc.js.map