@pine-ds/icons 9.6.1 → 9.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/pds-icon.js +24 -10
- package/components/pds-icon.js.map +1 -1
- package/dist/cheatsheet.html +7 -5
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/pds-icon.cjs.entry.js +21 -7
- package/dist/cjs/pds-icon.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-icon.entry.cjs.js.map +1 -1
- package/dist/cjs/pds-icons.cjs.js +1 -1
- package/dist/collection/components/pds-icon/pds-icon.js +21 -7
- package/dist/collection/components/pds-icon/pds-icon.js.map +1 -1
- package/dist/docs.json +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/pds-icon.entry.js +21 -7
- package/dist/esm/pds-icon.entry.js.map +1 -1
- package/dist/esm/pds-icons.js +1 -1
- package/dist/pds-icons/p-5ea9f963.entry.js +2 -0
- package/dist/pds-icons/p-5ea9f963.entry.js.map +1 -0
- package/dist/pds-icons/pds-icon.entry.esm.js.map +1 -1
- package/dist/pds-icons/pds-icons.esm.js +1 -1
- package/dist/pds-icons.json +12 -1
- package/dist/pds-icons.symbols.svg +2 -1
- package/dist/svg/speedometer.svg +1 -0
- package/dist/types/components/pds-icon/pds-icon.d.ts +2 -0
- package/icons/index.d.ts +2 -1
- package/icons/index.js +2 -1
- package/icons/index.mjs +2 -1
- package/icons/package.json +1 -1
- package/package.json +1 -1
- package/dist/pds-icons/p-23a00a5a.entry.js +0 -2
- package/dist/pds-icons/p-23a00a5a.entry.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pds-icon.entry.cjs.js","sources":["src/components/pds-icon/validate.ts","src/components/pds-icon/request.ts","src/components/pds-icon/pds-icon.scss?tag=pds-icon&encapsulation=shadow","src/components/pds-icon/pds-icon.tsx"],"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-pds-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\nexport const isSvgDataUrl = (url: string) => url.startsWith('data:image/svg+xml');\nexport const isEncodedDataUrl = (url: string) => url.indexOf(';utf8,') !== -1;\n","import { isEncodedDataUrl, isSvgDataUrl, validateContent } from './validate';\n\nexport const pdsIconContent = new Map<string, string>();\nconst requests = new Map<string, Promise<any>>(); // eslint-disable-line @typescript-eslint/no-explicit-any\n\nlet parser: DOMParser;\n\nexport const getSvgContent = (url: string, sanitize = false) => {\n let req = requests.get(url);\n\n if(!req) {\n if (typeof fetch != 'undefined' && typeof document !== 'undefined') {\n if (isSvgDataUrl(url) && isEncodedDataUrl(url)) {\n if (!parser) {\n parser = new DOMParser();\n }\n\n try {\n const doc = parser.parseFromString(url, 'text/html');\n const svg = doc.querySelector('svg');\n\n if (svg) {\n pdsIconContent.set(url, svg.outerHTML);\n } else {\n pdsIconContent.set(url, '');\n }\n } catch (error) {\n pdsIconContent.set(url, '');\n }\n\n return Promise.resolve();\n } else {\n // we don't have a request\n req = fetch(url).then((rsp) => {\n if (rsp.ok) {\n return rsp.text().then((svgContent) => {\n if (svgContent && sanitize !== false) {\n try {\n svgContent = validateContent(svgContent);\n } catch (validationError) {\n svgContent = '';\n }\n }\n pdsIconContent.set(url, svgContent || '');\n });\n } else {\n // Handle HTTP errors\n throw new Error(`Failed to load SVG: ${rsp.status} ${rsp.statusText}`);\n }\n }).catch((error) => {\n // Handle all fetch errors gracefully\n console.warn('Failed to load SVG:', url, error);\n pdsIconContent.set(url, '');\n // Don't re-throw to prevent unhandled promise rejections\n });\n\n requests.set(url, req);\n }\n } else {\n pdsIconContent.set(url, '');\n return Promise.resolve();\n }\n }\n\n return req;\n}\n",":host {\n --dimension-icon-height: 16px;\n --dimension-icon-width: 16px;\n --color-icon-fill: currentColor;\n\n contain: strict;\n display: inline-block;\n fill: var(--color-icon-fill);\n flex-shrink: 0;\n height: var(--dimension-icon-height);\n width: var(--dimension-icon-width);\n\n .pdsicon {\n fill: var(--color-icon-fill);\n }\n}\n\n.pds-icon-fill-none {\n fill: none;\n}\n\n.icon-inner,\n.pds-icon,\nsvg {\n display: block;\n height: 100%;\n width: 100%;\n}\n\n/* :host-context is supported in chromium; :dir is supported in safari & firefox */\n:host(.flip-rtl):host-context([dir='rtl']) .icon-inner {\n transform: scaleX(-1);\n}\n\n:host(.flip-rtl:dir(rtl)) .icon-inner {\n transform: scaleX(-1);\n}\n\n/**\n * This is needed for WebKit otherwise the fallback\n * will always cause the icon to be flipped if the document\n * loads in RTL.\n */\n:host(.flip-rtl:dir(ltr)) .icon-inner {\n transform: scaleX(1);\n}\n\n","import { Build, Component, Element, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { getSvgContent, pdsIconContent } from './request';\nimport { getName, getUrl, inheritAttributes, isRTL, shouldRtlFlipIcon } from './utils';\n\n@Component({\n tag: 'pds-icon',\n assetsDirs: ['svg'],\n styleUrl: 'pds-icon.scss',\n shadow: true,\n})\nexport class PdsIcon {\n private didLoadIcon = false;\n private iconName: string | null = null;\n private io?: IntersectionObserver;\n private inheritedAttributes: { [k: string]: any } = {}; // eslint-disable-line @typescript-eslint/no-explicit-any\n\n @Element() el!: HTMLPdsIconElement;\n\n @State() private ariaLabel?: string;\n @State() private isVisible = false;\n @State() private svgContent?: string;\n\n /**\n *\n * The color of the icon\n *\n */\n @Prop() color?: string;\n\n /**\n * Determines if the icon should be flipped when the `dir` is right-to-left (`\"rtl\"`).\n * This is automatically enabled for icons that are in the `ICONS_TO_FLIP` list and\n * when the `dir` is `\"rtl\"`. If `flipRtl` is set to `false`, the icon will not be flipped\n * even if the `dir` is `\"rtl\"`.\n */\n @Prop() flipRtl?: boolean;\n\n /**\n * This is a combination of both `name` and `src`. If a `src` URL is detected,\n * it will set the `src` property. Otherwise it assumes it's a built-in named\n * SVG and sets the `name` property.\n */\n @Prop() icon?: any;\n\n /**\n * The name of the icon to use from\n * the built-in set.\n */\n @Prop({ reflect: true }) name?: string;\n\n /**\n * The size of the icon. This can be\n * 'small', 'regular', 'medium', 'large', or a\n * custom value (40px, 1rem, etc)\n *\n */\n @Prop({ reflect: true }) size?:\n | 'small' // 12px\n | 'regular' // 16px\n | 'medium' // 20px\n | 'large' // 24px\n | 'auto'\n | string = 'regular'\n\n /**\n *\n * Specifies the exact `src` of an SVG file to use.\n */\n @Prop() src?: string;\n\n private iconSize() {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const sizes: { [key: string]: any } = {\n small: '12px',\n regular: '16px',\n medium: '20px',\n large: '24px',\n }\n\n if (sizes[this.size]) {\n return sizes[this.size];\n } else {\n return this.size;\n }\n }\n\n componentDidLoad() {\n this.setCSSVariables();\n\n if (!this.didLoadIcon) {\n this.loadIcon();\n }\n\n // Fallback: Ensure icon loads even if IntersectionObserver doesn't fire\n setTimeout(() => {\n if (!this.svgContent && !this.isVisible) {\n this.isVisible = true;\n this.loadIcon();\n }\n }, 100);\n\n // Additional fallback for client-side navigation (React Router, etc.)\n // React's useLayoutEffect and rendering cycles can delay visibility detection\n setTimeout(() => {\n if (!this.svgContent && !this.isVisible) {\n this.isVisible = true;\n this.loadIcon();\n }\n }, 500);\n }\n\n componentWillLoad() {\n this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);\n this.setCSSVariables();\n }\n\n setCSSVariables() {\n this.el.style.setProperty(`--dimension-icon-height`, this.iconSize());\n this.el.style.setProperty(`--dimension-icon-width`, this.iconSize());\n this.el.style.setProperty(`--color-icon-fill`, typeof this.color !== 'undefined' ? this.color : 'currentColor');\n }\n\n connectedCallback() {\n // Handle re-connection during client-side navigation\n if (!this.isVisible && !this.svgContent) {\n this.waitUntilVisible(this.el, '50px', () => {\n this.isVisible = true;\n this.loadIcon();\n });\n }\n\n // Immediate load attempt if already visible (e.g., during React navigation)\n if (this.isElementInViewport(this.el)) {\n this.isVisible = true;\n this.loadIcon();\n }\n }\n\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n }\n\n @Watch('size')\n @Watch('color')\n updateStyles() {\n this.setCSSVariables();\n }\n\n @Watch('name')\n @Watch('src')\n @Watch('icon')\n loadIcon() {\n // Reset load state when URL changes\n this.didLoadIcon = false;\n\n // Clear existing content to prevent stale content when switching icons\n this.svgContent = undefined;\n\n if (Build.isBrowser && this.isVisible) {\n const url = getUrl(this);\n if (url) {\n if (pdsIconContent.has(url)) {\n this.svgContent = pdsIconContent.get(url);\n } else {\n // Fix: Ensure promise callback triggers re-render and handle errors\n getSvgContent(url)\n .then(() => {\n // Force re-render by setting state in next tick\n setTimeout(() => {\n this.svgContent = pdsIconContent.get(url);\n }, 0);\n })\n .catch(() => {\n // Handle fetch errors gracefully\n this.svgContent = '';\n });\n }\n this.didLoadIcon = true;\n }\n }\n\n this.iconName = getName(this.name, this.icon);\n\n if (this.iconName) {\n this.ariaLabel = this.iconName.replace(/\\-/g, ' ');\n }\n }\n\n render() {\n const { ariaLabel, flipRtl, iconName,inheritedAttributes } = this;\n const shouldIconAutoFlip = iconName\n ? shouldRtlFlipIcon(iconName, this.el) && flipRtl !== false\n : false;\n const shouldFlip = flipRtl || shouldIconAutoFlip;\n\n return (\n\n <Host\n aria-label={ariaLabel !== undefined && !this.hasAriaHidden() ? ariaLabel : null }\n alt=\"\"\n role=\"img\"\n class={{\n ...createColorClasses(this.color),\n 'flip-rtl': shouldFlip,\n 'icon-rtl': shouldFlip && isRTL(this.el)\n }}\n {...inheritedAttributes}\n >\n {Build.isBrowser && this.svgContent ? (\n <div class=\"icon-inner\" innerHTML={this.svgContent}></div>\n ) : (\n <div class=\"icon-inner\"></div>\n )}\n </Host>\n )\n }\n\n /*****\n * Private Methods\n ****/\n\n private waitUntilVisible(el: HTMLElement, rootMargin: string, cb: () => void) {\n if (Build.isBrowser && typeof window !== 'undefined' && (window).IntersectionObserver) {\n const io = (this.io = new (window).IntersectionObserver(\n (data: IntersectionObserverEntry[]) => {\n if (data[0].isIntersecting) {\n io.disconnect();\n this.io = undefined;\n cb();\n }\n },\n { rootMargin },\n ));\n\n io.observe(el);\n\n // Safety timeout for client-side navigation scenarios\n // Sometimes IntersectionObserver doesn't fire during React navigation\n setTimeout(() => {\n if (this.io && !this.isVisible) {\n // Check if element is actually visible in viewport\n if (this.isElementInViewport(el)) {\n this.io.disconnect();\n this.io = undefined;\n cb();\n }\n }\n }, 1000);\n } else {\n // browser doesn't support IntersectionObserver\n // so just fallback to always show it\n cb();\n }\n }\n\n private isElementInViewport(el: HTMLElement): boolean {\n if (!el || !el.isConnected) return false;\n\n const rect = el.getBoundingClientRect();\n const windowHeight = window.innerHeight || document.documentElement.clientHeight;\n const windowWidth = window.innerWidth || document.documentElement.clientWidth;\n\n return (\n rect.top >= 0 &&\n rect.left >= 0 &&\n rect.bottom <= windowHeight &&\n rect.right <= windowWidth\n ) || (\n // Also consider partially visible elements\n rect.top < windowHeight &&\n rect.bottom > 0 &&\n rect.left < windowWidth &&\n rect.right > 0\n );\n }\n\n private hasAriaHidden = () => {\n const { el } = this;\n\n return el.hasAttribute('aria-hidden') && el.getAttribute('aria-hidden') === 'true';\n }\n\n /**\n * Debug method to help diagnose loading issues\n * Call from browser console: document.querySelector('pds-icon').debugIconState()\n */\n debugIconState() {\n const url = getUrl(this);\n const rect = this.el.getBoundingClientRect();\n\n console.log('PdsIcon Debug State:', {\n name: this.name,\n src: this.src,\n icon: this.icon,\n iconName: this.iconName,\n url,\n isVisible: this.isVisible,\n didLoadIcon: this.didLoadIcon,\n hasSvgContent: !!this.svgContent,\n svgContentLength: this.svgContent?.length || 0,\n isInCache: url ? pdsIconContent.has(url) : false,\n cachedContent: url ? pdsIconContent.get(url) : null,\n element: this.el,\n // Client-side navigation specific debug info\n isConnected: this.el.isConnected,\n isInViewport: this.isElementInViewport(this.el),\n hasIntersectionObserver: !!this.io,\n boundingClientRect: rect,\n windowDimensions: {\n width: window.innerWidth || document.documentElement.clientWidth,\n height: window.innerHeight || document.documentElement.clientHeight\n }\n });\n }\n}\n\nconst createColorClasses = (color: string | undefined) => {\n return color\n ? {\n 'pds-color': true,\n [`pds-color-${color}`]: true,\n }\n : null;\n };\n"],"names":["isStr","inheritAttributes","getUrl","getName","shouldRtlFlipIcon","h","Host","isRTL"],"mappings":";;;;;AAEO,MAAM,eAAe,GAAG,CAAC,UAAkB,KAAI;IACpD,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;AACzC,IAAA,GAAG,CAAC,SAAS,GAAG,UAAU;;AAG1B,IAAA,KAAK,IAAI,CAAC,GAAG,GAAG,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,EAAE;AACnD,QAAA,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;;;;AAKtC,IAAA,MAAM,MAAM,GAAG,GAAG,CAAC,iBAAiB;IACpC,IAAI,MAAM,IAAI,MAAM,CAAC,QAAQ,CAAC,WAAW,EAAE,KAAK,KAAK,EAAE;QACrD,MAAM,QAAQ,GAAG,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,IAAI,EAAE;AACnD,QAAA,MAAM,CAAC,YAAY,CAAC,OAAO,EAAE,CAAC,QAAQ,GAAG,aAAa,EAAE,IAAI,EAAE,CAAC;;;;AAK/D,QAAA,IAAI,OAAO,CAAC,MAAqB,CAAC,EAAE;YAClC,OAAO,GAAG,CAAC,SAAS;;;AAGxB,IAAA,OAAO,EAAE;AACX,CAAC;AAEM,MAAM,OAAO,GAAG,CAAC,GAAgB,KAAI;AAC1C,IAAA,IAAI,GAAG,CAAC,QAAQ,KAAK,CAAC,EAAE;QACtB,IAAI,GAAG,CAAC,QAAQ,CAAC,WAAW,EAAE,KAAK,QAAQ,EAAE;AAC3C,YAAA,OAAO,KAAK;;AAGd,QAAA,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;AACnC,YAAA,IAAIA,WAAK,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;AACzD,gBAAA,OAAO,KAAK;;;AAIhB,QAAA,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;AAC9C,gBAAA,OAAO,KAAK;;;;AAIlB,IAAA,OAAO,IAAI;AACb,CAAC;AAEM,MAAM,YAAY,GAAG,CAAC,GAAW,KAAK,GAAG,CAAC,UAAU,CAAC,oBAAoB,CAAC;AAC1E,MAAM,gBAAgB,GAAG,CAAC,GAAW,KAAK,GAAG,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,EAAE;;AClDtE,MAAM,cAAc,GAAG,IAAI,GAAG,EAAkB;AACvD,MAAM,QAAQ,GAAG,IAAI,GAAG,EAAwB,CAAC;AAEjD,IAAI,MAAiB;AAEd,MAAM,aAAa,GAAG,CAAC,GAAW,EAAE,QAAQ,GAAG,KAAK,KAAI;IAC7D,IAAI,GAAG,GAAG,QAAQ,CAAC,GAAG,CAAC,GAAG,CAAC;IAE3B,IAAG,CAAC,GAAG,EAAE;QACP,IAAI,OAAO,KAAK,IAAI,WAAW,IAAI,OAAO,QAAQ,KAAK,WAAW,EAAE;YAClE,IAAI,YAAY,CAAC,GAAG,CAAC,IAAI,gBAAgB,CAAC,GAAG,CAAC,EAAE;gBAC9C,IAAI,CAAC,MAAM,EAAE;AACX,oBAAA,MAAM,GAAG,IAAI,SAAS,EAAE;;AAG1B,gBAAA,IAAI;oBACF,MAAM,GAAG,GAAG,MAAM,CAAC,eAAe,CAAC,GAAG,EAAE,WAAW,CAAC;oBACpD,MAAM,GAAG,GAAG,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC;oBAEpC,IAAI,GAAG,EAAE;wBACP,cAAc,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,CAAC,SAAS,CAAC;;yBACjC;AACL,wBAAA,cAAc,CAAC,GAAG,CAAC,GAAG,EAAE,EAAE,CAAC;;;gBAE7B,OAAO,KAAK,EAAE;AACd,oBAAA,cAAc,CAAC,GAAG,CAAC,GAAG,EAAE,EAAE,CAAC;;AAG7B,gBAAA,OAAO,OAAO,CAAC,OAAO,EAAE;;iBACnB;;gBAEL,GAAG,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,KAAI;AAC5B,oBAAA,IAAI,GAAG,CAAC,EAAE,EAAE;wBACV,OAAO,GAAG,CAAC,IAAI,EAAE,CAAC,IAAI,CAAC,CAAC,UAAU,KAAI;AACpC,4BAAA,IAAI,UAAU,IAAI,QAAQ,KAAK,KAAK,EAAE;AACpC,gCAAA,IAAI;AACF,oCAAA,UAAU,GAAG,eAAe,CAAC,UAAU,CAAC;;gCACxC,OAAO,eAAe,EAAE;oCACxB,UAAU,GAAG,EAAE;;;4BAGnB,cAAc,CAAC,GAAG,CAAC,GAAG,EAAE,UAAU,IAAI,EAAE,CAAC;AAC3C,yBAAC,CAAC;;yBACG;;AAEL,wBAAA,MAAM,IAAI,KAAK,CAAC,CAAA,oBAAA,EAAuB,GAAG,CAAC,MAAM,CAAA,CAAA,EAAI,GAAG,CAAC,UAAU,CAAA,CAAE,CAAC;;AAE1E,iBAAC,CAAC,CAAC,KAAK,CAAC,CAAC,KAAK,KAAI;;oBAEjB,OAAO,CAAC,IAAI,CAAC,qBAAqB,EAAE,GAAG,EAAE,KAAK,CAAC;AAC/C,oBAAA,cAAc,CAAC,GAAG,CAAC,GAAG,EAAE,EAAE,CAAC;;AAE7B,iBAAC,CAAC;AAEF,gBAAA,QAAQ,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,CAAC;;;aAEnB;AACL,YAAA,cAAc,CAAC,GAAG,CAAC,GAAG,EAAE,EAAE,CAAC;AAC3B,YAAA,OAAO,OAAO,CAAC,OAAO,EAAE;;;AAI5B,IAAA,OAAO,GAAG;AACZ,CAAC;;ACjED,MAAM,UAAU,GAAG,2jBAA2jB;;MCUjkB,OAAO,GAAA,MAAA;AANpB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAOU,QAAA,IAAW,CAAA,WAAA,GAAG,KAAK;AACnB,QAAA,IAAQ,CAAA,QAAA,GAAkB,IAAI;AAE9B,QAAA,IAAA,CAAA,mBAAmB,GAAyB,EAAE,CAAC;AAKtC,QAAA,IAAS,CAAA,SAAA,GAAG,KAAK;AA+BlC;;;;;AAKG;AACsB,QAAA,IAAI,CAAA,IAAA,GAMhB,SAAS;AAyNd,QAAA,IAAa,CAAA,aAAA,GAAG,MAAK;AAC3B,YAAA,MAAM,EAAE,EAAE,EAAE,GAAG,IAAI;AAEnB,YAAA,OAAO,EAAE,CAAC,YAAY,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC,YAAY,CAAC,aAAa,CAAC,KAAK,MAAM;AACpF,SAAC;AAkCF;IAvPS,QAAQ,GAAA;;AAEd,QAAA,MAAM,KAAK,GAA2B;AACpC,YAAA,KAAK,EAAE,MAAM;AACb,YAAA,OAAO,EAAE,MAAM;AACf,YAAA,MAAM,EAAE,MAAM;AACd,YAAA,KAAK,EAAE,MAAM;SACd;AAED,QAAA,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;AACpB,YAAA,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC;;aAClB;YACL,OAAO,IAAI,CAAC,IAAI;;;IAIpB,gBAAgB,GAAA;QACd,IAAI,CAAC,eAAe,EAAE;AAEtB,QAAA,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;YACrB,IAAI,CAAC,QAAQ,EAAE;;;QAIjB,UAAU,CAAC,MAAK;YACd,IAAI,CAAC,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;AACvC,gBAAA,IAAI,CAAC,SAAS,GAAG,IAAI;gBACrB,IAAI,CAAC,QAAQ,EAAE;;SAElB,EAAE,GAAG,CAAC;;;QAIP,UAAU,CAAC,MAAK;YACd,IAAI,CAAC,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;AACvC,gBAAA,IAAI,CAAC,SAAS,GAAG,IAAI;gBACrB,IAAI,CAAC,QAAQ,EAAE;;SAElB,EAAE,GAAG,CAAC;;IAGT,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,mBAAmB,GAAGC,uBAAiB,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC,YAAY,CAAC,CAAC;QACrE,IAAI,CAAC,eAAe,EAAE;;IAGxB,eAAe,GAAA;AACb,QAAA,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,CAAyB,uBAAA,CAAA,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC;AACrE,QAAA,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,CAAwB,sBAAA,CAAA,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC;QACpE,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,CAAmB,iBAAA,CAAA,EAAE,OAAO,IAAI,CAAC,KAAK,KAAK,WAAW,GAAG,IAAI,CAAC,KAAK,GAAG,cAAc,CAAC;;IAGjH,iBAAiB,GAAA;;QAEf,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;YACvC,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,EAAE,MAAM,EAAE,MAAK;AAC1C,gBAAA,IAAI,CAAC,SAAS,GAAG,IAAI;gBACrB,IAAI,CAAC,QAAQ,EAAE;AACjB,aAAC,CAAC;;;QAIJ,IAAI,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE;AACrC,YAAA,IAAI,CAAC,SAAS,GAAG,IAAI;YACrB,IAAI,CAAC,QAAQ,EAAE;;;IAInB,oBAAoB,GAAA;AAClB,QAAA,IAAI,IAAI,CAAC,EAAE,EAAE;AACX,YAAA,IAAI,CAAC,EAAE,CAAC,UAAU,EAAE;AACpB,YAAA,IAAI,CAAC,EAAE,GAAG,SAAS;;;IAMvB,YAAY,GAAA;QACV,IAAI,CAAC,eAAe,EAAE;;IAMxB,QAAQ,GAAA;;AAEN,QAAA,IAAI,CAAC,WAAW,GAAG,KAAK;;AAGxB,QAAA,IAAI,CAAC,UAAU,GAAG,SAAS;QAE3B,IAAuB,IAAI,CAAC,SAAS,EAAE;AACrC,YAAA,MAAM,GAAG,GAAGC,YAAM,CAAC,IAAI,CAAC;YACxB,IAAI,GAAG,EAAE;AACP,gBAAA,IAAI,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;oBAC3B,IAAI,CAAC,UAAU,GAAG,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC;;qBACpC;;oBAEL,aAAa,CAAC,GAAG;yBACd,IAAI,CAAC,MAAK;;wBAET,UAAU,CAAC,MAAK;4BACd,IAAI,CAAC,UAAU,GAAG,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC;yBAC1C,EAAE,CAAC,CAAC;AACP,qBAAC;yBACA,KAAK,CAAC,MAAK;;AAEV,wBAAA,IAAI,CAAC,UAAU,GAAG,EAAE;AACtB,qBAAC,CAAC;;AAEN,gBAAA,IAAI,CAAC,WAAW,GAAG,IAAI;;;AAI3B,QAAA,IAAI,CAAC,QAAQ,GAAGC,aAAO,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC;AAE7C,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AACjB,YAAA,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC;;;IAItD,MAAM,GAAA;QACJ,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAC,mBAAmB,EAAE,GAAG,IAAI;QACjE,MAAM,kBAAkB,GAAG;AACzB,cAAEC,uBAAiB,CAAC,QAAQ,EAAE,IAAI,CAAC,EAAE,CAAC,IAAI,OAAO,KAAK;cACpD,KAAK;AACT,QAAA,MAAM,UAAU,GAAG,OAAO,IAAI,kBAAkB;AAEhD,QAAA,QAEEC,SAAC,CAAAC,YAAI,iFACS,SAAS,KAAK,SAAS,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,GAAG,SAAS,GAAG,IAAI,EAC/E,GAAG,EAAC,EAAE,EACN,IAAI,EAAC,KAAK,EACV,KAAK,EACA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA,EAAA,EACjC,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,UAAU,IAAIC,WAAK,CAAC,IAAI,CAAC,EAAE,CAAC,EAAA,CAAA,EAAA,EAEtC,mBAAmB,CAEtB,EAAmB,IAAI,CAAC,UAAU,IACjCF,SAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,YAAY,EAAC,SAAS,EAAE,IAAI,CAAC,UAAU,EAAA,CAAQ,KAE1DA,SAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,YAAY,GAAO,CAC/B,CACI;;AAIX;;AAEM;AAEE,IAAA,gBAAgB,CAAC,EAAe,EAAE,UAAkB,EAAE,EAAc,EAAA;AAC1E,QAAA,IAAuB,OAAO,MAAM,KAAK,WAAW,IAAI,CAAC,MAAM,EAAE,oBAAoB,EAAE;AACrF,YAAA,MAAM,EAAE,IAAI,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,oBAAoB,CACrD,CAAC,IAAiC,KAAI;AACpC,gBAAA,IAAI,IAAI,CAAC,CAAC,CAAC,CAAC,cAAc,EAAE;oBAC1B,EAAE,CAAC,UAAU,EAAE;AACf,oBAAA,IAAI,CAAC,EAAE,GAAG,SAAS;AACnB,oBAAA,EAAE,EAAE;;AAER,aAAC,EACD,EAAE,UAAU,EAAE,CACf,CAAC;AAEF,YAAA,EAAE,CAAC,OAAO,CAAC,EAAE,CAAC;;;YAId,UAAU,CAAC,MAAK;gBACd,IAAI,IAAI,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;;AAE9B,oBAAA,IAAI,IAAI,CAAC,mBAAmB,CAAC,EAAE,CAAC,EAAE;AAChC,wBAAA,IAAI,CAAC,EAAE,CAAC,UAAU,EAAE;AACpB,wBAAA,IAAI,CAAC,EAAE,GAAG,SAAS;AACnB,wBAAA,EAAE,EAAE;;;aAGT,EAAE,IAAI,CAAC;;aACH;;;AAGL,YAAA,EAAE,EAAE;;;AAIA,IAAA,mBAAmB,CAAC,EAAe,EAAA;AACzC,QAAA,IAAI,CAAC,EAAE,IAAI,CAAC,EAAE,CAAC,WAAW;AAAE,YAAA,OAAO,KAAK;AAExC,QAAA,MAAM,IAAI,GAAG,EAAE,CAAC,qBAAqB,EAAE;QACvC,MAAM,YAAY,GAAG,MAAM,CAAC,WAAW,IAAI,QAAQ,CAAC,eAAe,CAAC,YAAY;QAChF,MAAM,WAAW,GAAG,MAAM,CAAC,UAAU,IAAI,QAAQ,CAAC,eAAe,CAAC,WAAW;AAE7E,QAAA,OAAO,CACL,IAAI,CAAC,GAAG,IAAI,CAAC;YACb,IAAI,CAAC,IAAI,IAAI,CAAC;YACd,IAAI,CAAC,MAAM,IAAI,YAAY;AAC3B,YAAA,IAAI,CAAC,KAAK,IAAI,WAAW;;QAGzB,IAAI,CAAC,GAAG,GAAG,YAAY;YACvB,IAAI,CAAC,MAAM,GAAG,CAAC;YACf,IAAI,CAAC,IAAI,GAAG,WAAW;AACvB,YAAA,IAAI,CAAC,KAAK,GAAG,CAAC,CACf;;AASH;;;AAGG;IACH,cAAc,GAAA;;AACZ,QAAA,MAAM,GAAG,GAAGH,YAAM,CAAC,IAAI,CAAC;QACxB,MAAM,IAAI,GAAG,IAAI,CAAC,EAAE,CAAC,qBAAqB,EAAE;AAE5C,QAAA,OAAO,CAAC,GAAG,CAAC,sBAAsB,EAAE;YAClC,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,GAAG,EAAE,IAAI,CAAC,GAAG;YACb,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,GAAG;YACH,SAAS,EAAE,IAAI,CAAC,SAAS;YACzB,WAAW,EAAE,IAAI,CAAC,WAAW;AAC7B,YAAA,aAAa,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU;AAChC,YAAA,gBAAgB,EAAE,CAAA,CAAA,EAAA,GAAA,IAAI,CAAC,UAAU,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,MAAM,KAAI,CAAC;AAC9C,YAAA,SAAS,EAAE,GAAG,GAAG,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK;AAChD,YAAA,aAAa,EAAE,GAAG,GAAG,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI;YACnD,OAAO,EAAE,IAAI,CAAC,EAAE;;AAEhB,YAAA,WAAW,EAAE,IAAI,CAAC,EAAE,CAAC,WAAW;YAChC,YAAY,EAAE,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,EAAE,CAAC;AAC/C,YAAA,uBAAuB,EAAE,CAAC,CAAC,IAAI,CAAC,EAAE;AAClC,YAAA,kBAAkB,EAAE,IAAI;AACxB,YAAA,gBAAgB,EAAE;gBAChB,KAAK,EAAE,MAAM,CAAC,UAAU,IAAI,QAAQ,CAAC,eAAe,CAAC,WAAW;gBAChE,MAAM,EAAE,MAAM,CAAC,WAAW,IAAI,QAAQ,CAAC,eAAe,CAAC;AACxD;AACF,SAAA,CAAC;;;;;;;;;;;;AAIN,MAAM,kBAAkB,GAAG,CAAC,KAAyB,KAAI;AACvD,IAAA,OAAO;AACN,UAAE;AACE,YAAA,WAAW,EAAE,IAAI;AACjB,YAAA,CAAC,CAAa,UAAA,EAAA,KAAK,CAAE,CAAA,GAAG,IAAI;AAC7B;UACD,IAAI;AACR,CAAC;;;;;"}
|
|
1
|
+
{"version":3,"file":"pds-icon.entry.cjs.js","sources":["src/components/pds-icon/validate.ts","src/components/pds-icon/request.ts","src/components/pds-icon/pds-icon.scss?tag=pds-icon&encapsulation=shadow","src/components/pds-icon/pds-icon.tsx"],"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-pds-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\nexport const isSvgDataUrl = (url: string) => url.startsWith('data:image/svg+xml');\nexport const isEncodedDataUrl = (url: string) => url.indexOf(';utf8,') !== -1;\n","import { isEncodedDataUrl, isSvgDataUrl, validateContent } from './validate';\n\nexport const pdsIconContent = new Map<string, string>();\nconst requests = new Map<string, Promise<any>>(); // eslint-disable-line @typescript-eslint/no-explicit-any\n\nlet parser: DOMParser;\n\nexport const getSvgContent = (url: string, sanitize = false) => {\n let req = requests.get(url);\n\n if(!req) {\n if (typeof fetch != 'undefined' && typeof document !== 'undefined') {\n if (isSvgDataUrl(url) && isEncodedDataUrl(url)) {\n if (!parser) {\n parser = new DOMParser();\n }\n\n try {\n const doc = parser.parseFromString(url, 'text/html');\n const svg = doc.querySelector('svg');\n\n if (svg) {\n pdsIconContent.set(url, svg.outerHTML);\n } else {\n pdsIconContent.set(url, '');\n }\n } catch (error) {\n pdsIconContent.set(url, '');\n }\n\n return Promise.resolve();\n } else {\n // we don't have a request\n req = fetch(url).then((rsp) => {\n if (rsp.ok) {\n return rsp.text().then((svgContent) => {\n if (svgContent && sanitize !== false) {\n try {\n svgContent = validateContent(svgContent);\n } catch (validationError) {\n svgContent = '';\n }\n }\n pdsIconContent.set(url, svgContent || '');\n });\n } else {\n // Handle HTTP errors\n throw new Error(`Failed to load SVG: ${rsp.status} ${rsp.statusText}`);\n }\n }).catch((error) => {\n // Handle all fetch errors gracefully\n console.warn('Failed to load SVG:', url, error);\n pdsIconContent.set(url, '');\n // Don't re-throw to prevent unhandled promise rejections\n });\n\n requests.set(url, req);\n }\n } else {\n pdsIconContent.set(url, '');\n return Promise.resolve();\n }\n }\n\n return req;\n}\n",":host {\n --dimension-icon-height: 16px;\n --dimension-icon-width: 16px;\n --color-icon-fill: currentColor;\n\n contain: strict;\n display: inline-block;\n fill: var(--color-icon-fill);\n flex-shrink: 0;\n height: var(--dimension-icon-height);\n width: var(--dimension-icon-width);\n\n .pdsicon {\n fill: var(--color-icon-fill);\n }\n}\n\n.pds-icon-fill-none {\n fill: none;\n}\n\n.icon-inner,\n.pds-icon,\nsvg {\n display: block;\n height: 100%;\n width: 100%;\n}\n\n/* :host-context is supported in chromium; :dir is supported in safari & firefox */\n:host(.flip-rtl):host-context([dir='rtl']) .icon-inner {\n transform: scaleX(-1);\n}\n\n:host(.flip-rtl:dir(rtl)) .icon-inner {\n transform: scaleX(-1);\n}\n\n/**\n * This is needed for WebKit otherwise the fallback\n * will always cause the icon to be flipped if the document\n * loads in RTL.\n */\n:host(.flip-rtl:dir(ltr)) .icon-inner {\n transform: scaleX(1);\n}\n\n","import { Build, Component, Element, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { getSvgContent, pdsIconContent } from './request';\nimport { getName, getUrl, inheritAttributes, isRTL, shouldRtlFlipIcon } from './utils';\n\n@Component({\n tag: 'pds-icon',\n assetsDirs: ['svg'],\n styleUrl: 'pds-icon.scss',\n shadow: true,\n})\nexport class PdsIcon {\n private didLoadIcon = false;\n private iconName: string | null = null;\n private io?: IntersectionObserver;\n private inheritedAttributes: { [k: string]: any } = {}; // eslint-disable-line @typescript-eslint/no-explicit-any\n\n @Element() el!: HTMLPdsIconElement;\n\n @State() private ariaLabel?: string;\n @State() private isVisible = false;\n @State() private svgContent?: string;\n\n /**\n *\n * The color of the icon\n *\n */\n @Prop() color?: string;\n\n /**\n * Determines if the icon should be flipped when the `dir` is right-to-left (`\"rtl\"`).\n * This is automatically enabled for icons that are in the `ICONS_TO_FLIP` list and\n * when the `dir` is `\"rtl\"`. If `flipRtl` is set to `false`, the icon will not be flipped\n * even if the `dir` is `\"rtl\"`.\n */\n @Prop() flipRtl?: boolean;\n\n /**\n * This is a combination of both `name` and `src`. If a `src` URL is detected,\n * it will set the `src` property. Otherwise it assumes it's a built-in named\n * SVG and sets the `name` property.\n */\n @Prop() icon?: any;\n\n /**\n * The name of the icon to use from\n * the built-in set.\n */\n @Prop({ reflect: true }) name?: string;\n\n /**\n * The size of the icon. This can be\n * 'small', 'regular', 'medium', 'large', or a\n * custom value (40px, 1rem, etc)\n *\n */\n @Prop({ reflect: true }) size?:\n | 'small' // 12px\n | 'regular' // 16px\n | 'medium' // 20px\n | 'large' // 24px\n | 'auto'\n | string = 'regular'\n\n /**\n *\n * Specifies the exact `src` of an SVG file to use.\n */\n @Prop() src?: string;\n\n private iconSize() {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const sizes: { [key: string]: any } = {\n small: '12px',\n regular: '16px',\n medium: '20px',\n large: '24px',\n }\n\n if (sizes[this.size]) {\n return sizes[this.size];\n } else {\n return this.size;\n }\n }\n\n componentDidLoad() {\n this.setCSSVariables();\n\n if (!this.didLoadIcon) {\n this.loadIcon();\n }\n\n // Fallback: Ensure icon loads even if IntersectionObserver doesn't fire\n setTimeout(() => {\n if (!this.svgContent && !this.isVisible) {\n this.isVisible = true;\n this.loadIcon();\n }\n }, 100);\n\n // Additional fallback for client-side navigation (React Router, etc.)\n // React's useLayoutEffect and rendering cycles can delay visibility detection\n setTimeout(() => {\n if (!this.svgContent && !this.isVisible) {\n this.isVisible = true;\n this.loadIcon();\n }\n }, 500);\n }\n\n componentWillLoad() {\n this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);\n this.setCSSVariables();\n this.setupInitialAriaLabel();\n }\n\n setCSSVariables() {\n this.el.style.setProperty(`--dimension-icon-height`, this.iconSize());\n this.el.style.setProperty(`--dimension-icon-width`, this.iconSize());\n this.el.style.setProperty(`--color-icon-fill`, typeof this.color !== 'undefined' ? this.color : 'currentColor');\n }\n\n connectedCallback() {\n // Handle re-connection during client-side navigation\n if (!this.isVisible && !this.svgContent) {\n this.waitUntilVisible(this.el, '50px', () => {\n this.isVisible = true;\n this.loadIcon();\n });\n }\n\n // Immediate load attempt if already visible (e.g., during React navigation)\n if (this.isElementInViewport(this.el)) {\n this.isVisible = true;\n this.loadIcon();\n }\n }\n\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n }\n\n @Watch('size')\n @Watch('color')\n updateStyles() {\n this.setCSSVariables();\n }\n\n @Watch('name')\n @Watch('src')\n @Watch('icon')\n onIconPropertyChange() {\n this.loadIcon();\n // Update aria-label when icon properties change\n this.setupInitialAriaLabel();\n }\n\n loadIcon() {\n // Reset load state when URL changes\n this.didLoadIcon = false;\n\n // Clear existing content to prevent stale content when switching icons\n this.svgContent = undefined;\n\n if (Build.isBrowser && this.isVisible) {\n const url = getUrl(this);\n if (url) {\n if (pdsIconContent.has(url)) {\n this.svgContent = pdsIconContent.get(url);\n } else {\n // Fix: Ensure promise callback triggers re-render and handle errors\n getSvgContent(url)\n .then(() => {\n // Force re-render by setting state in next tick\n setTimeout(() => {\n this.svgContent = pdsIconContent.get(url);\n }, 0);\n })\n .catch(() => {\n // Handle fetch errors gracefully\n this.svgContent = '';\n });\n }\n this.didLoadIcon = true;\n }\n }\n\n this.iconName = getName(this.name, this.icon);\n }\n\n render() {\n const { ariaLabel, flipRtl, iconName,inheritedAttributes } = this;\n const shouldIconAutoFlip = iconName\n ? shouldRtlFlipIcon(iconName, this.el) && flipRtl !== false\n : false;\n const shouldFlip = flipRtl || shouldIconAutoFlip;\n\n // Use inherited aria-label if provided, otherwise fall back to auto-generated one\n const finalAriaLabel = inheritedAttributes['aria-label'] || ariaLabel;\n\n return (\n\n <Host\n aria-label={finalAriaLabel !== undefined && !this.hasAriaHidden() ? finalAriaLabel : null }\n alt=\"\"\n role=\"img\"\n class={{\n ...createColorClasses(this.color),\n 'flip-rtl': shouldFlip,\n 'icon-rtl': shouldFlip && isRTL(this.el)\n }}\n {...inheritedAttributes}\n >\n {Build.isBrowser && this.svgContent ? (\n <div class=\"icon-inner\" innerHTML={this.svgContent}></div>\n ) : (\n <div class=\"icon-inner\"></div>\n )}\n </Host>\n )\n }\n\n /*****\n * Private Methods\n ****/\n\n private setupInitialAriaLabel() {\n // Only set aria-label during initial load if one isn't already provided\n if (!this.inheritedAttributes['aria-label']) {\n const iconName = getName(this.name, this.icon);\n if (iconName) {\n this.ariaLabel = iconName.replace(/\\-/g, ' ');\n }\n }\n }\n\n private waitUntilVisible(el: HTMLElement, rootMargin: string, cb: () => void) {\n if (Build.isBrowser && typeof window !== 'undefined' && (window).IntersectionObserver) {\n const io = (this.io = new (window).IntersectionObserver(\n (data: IntersectionObserverEntry[]) => {\n if (data[0].isIntersecting) {\n io.disconnect();\n this.io = undefined;\n cb();\n }\n },\n { rootMargin },\n ));\n\n io.observe(el);\n\n // Safety timeout for client-side navigation scenarios\n // Sometimes IntersectionObserver doesn't fire during React navigation\n setTimeout(() => {\n if (this.io && !this.isVisible) {\n // Check if element is actually visible in viewport\n if (this.isElementInViewport(el)) {\n this.io.disconnect();\n this.io = undefined;\n cb();\n }\n }\n }, 1000);\n } else {\n // browser doesn't support IntersectionObserver\n // so just fallback to always show it\n cb();\n }\n }\n\n private isElementInViewport(el: HTMLElement): boolean {\n if (!el || !el.isConnected) return false;\n\n const rect = el.getBoundingClientRect();\n const windowHeight = window.innerHeight || document.documentElement.clientHeight;\n const windowWidth = window.innerWidth || document.documentElement.clientWidth;\n\n return (\n rect.top >= 0 &&\n rect.left >= 0 &&\n rect.bottom <= windowHeight &&\n rect.right <= windowWidth\n ) || (\n // Also consider partially visible elements\n rect.top < windowHeight &&\n rect.bottom > 0 &&\n rect.left < windowWidth &&\n rect.right > 0\n );\n }\n\n private hasAriaHidden = () => {\n const { el } = this;\n\n return el.hasAttribute('aria-hidden') && el.getAttribute('aria-hidden') === 'true';\n }\n\n /**\n * Debug method to help diagnose loading issues\n * Call from browser console: document.querySelector('pds-icon').debugIconState()\n */\n debugIconState() {\n const url = getUrl(this);\n const rect = this.el.getBoundingClientRect();\n\n console.log('PdsIcon Debug State:', {\n name: this.name,\n src: this.src,\n icon: this.icon,\n iconName: this.iconName,\n url,\n isVisible: this.isVisible,\n didLoadIcon: this.didLoadIcon,\n hasSvgContent: !!this.svgContent,\n svgContentLength: this.svgContent?.length || 0,\n isInCache: url ? pdsIconContent.has(url) : false,\n cachedContent: url ? pdsIconContent.get(url) : null,\n element: this.el,\n // Client-side navigation specific debug info\n isConnected: this.el.isConnected,\n isInViewport: this.isElementInViewport(this.el),\n hasIntersectionObserver: !!this.io,\n boundingClientRect: rect,\n windowDimensions: {\n width: window.innerWidth || document.documentElement.clientWidth,\n height: window.innerHeight || document.documentElement.clientHeight\n }\n });\n }\n}\n\nconst createColorClasses = (color: string | undefined) => {\n return color\n ? {\n 'pds-color': true,\n [`pds-color-${color}`]: true,\n }\n : null;\n };\n"],"names":["isStr","inheritAttributes","getUrl","getName","shouldRtlFlipIcon","h","Host","isRTL"],"mappings":"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"}
|
|
@@ -19,7 +19,7 @@ var patchBrowser = () => {
|
|
|
19
19
|
|
|
20
20
|
patchBrowser().then(async (options) => {
|
|
21
21
|
await appGlobals.globalScripts();
|
|
22
|
-
return index.bootstrapLazy([["pds-icon.cjs",[[1,"pds-icon",{"color":[1],"flipRtl":[4,"flip-rtl"],"icon":[8],"name":[513],"size":[513],"src":[1],"ariaLabel":[32],"isVisible":[32],"svgContent":[32]},null,{"size":["updateStyles"],"color":["updateStyles"],"name":["
|
|
22
|
+
return index.bootstrapLazy([["pds-icon.cjs",[[1,"pds-icon",{"color":[1],"flipRtl":[4,"flip-rtl"],"icon":[8],"name":[513],"size":[513],"src":[1],"ariaLabel":[32],"isVisible":[32],"svgContent":[32]},null,{"size":["updateStyles"],"color":["updateStyles"],"name":["onIconPropertyChange"],"src":["onIconPropertyChange"],"icon":["onIconPropertyChange"]}]]]], options);
|
|
23
23
|
});
|
|
24
24
|
|
|
25
25
|
exports.setNonce = index.setNonce;
|
|
@@ -58,6 +58,7 @@ export class PdsIcon {
|
|
|
58
58
|
componentWillLoad() {
|
|
59
59
|
this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);
|
|
60
60
|
this.setCSSVariables();
|
|
61
|
+
this.setupInitialAriaLabel();
|
|
61
62
|
}
|
|
62
63
|
setCSSVariables() {
|
|
63
64
|
this.el.style.setProperty(`--dimension-icon-height`, this.iconSize());
|
|
@@ -87,6 +88,11 @@ export class PdsIcon {
|
|
|
87
88
|
updateStyles() {
|
|
88
89
|
this.setCSSVariables();
|
|
89
90
|
}
|
|
91
|
+
onIconPropertyChange() {
|
|
92
|
+
this.loadIcon();
|
|
93
|
+
// Update aria-label when icon properties change
|
|
94
|
+
this.setupInitialAriaLabel();
|
|
95
|
+
}
|
|
90
96
|
loadIcon() {
|
|
91
97
|
// Reset load state when URL changes
|
|
92
98
|
this.didLoadIcon = false;
|
|
@@ -116,9 +122,6 @@ export class PdsIcon {
|
|
|
116
122
|
}
|
|
117
123
|
}
|
|
118
124
|
this.iconName = getName(this.name, this.icon);
|
|
119
|
-
if (this.iconName) {
|
|
120
|
-
this.ariaLabel = this.iconName.replace(/\-/g, ' ');
|
|
121
|
-
}
|
|
122
125
|
}
|
|
123
126
|
render() {
|
|
124
127
|
const { ariaLabel, flipRtl, iconName, inheritedAttributes } = this;
|
|
@@ -126,11 +129,22 @@ export class PdsIcon {
|
|
|
126
129
|
? shouldRtlFlipIcon(iconName, this.el) && flipRtl !== false
|
|
127
130
|
: false;
|
|
128
131
|
const shouldFlip = flipRtl || shouldIconAutoFlip;
|
|
129
|
-
|
|
132
|
+
// Use inherited aria-label if provided, otherwise fall back to auto-generated one
|
|
133
|
+
const finalAriaLabel = inheritedAttributes['aria-label'] || ariaLabel;
|
|
134
|
+
return (h(Host, Object.assign({ key: '43aa73531314e6529a887468e69362430d006229', "aria-label": finalAriaLabel !== undefined && !this.hasAriaHidden() ? finalAriaLabel : null, alt: "", role: "img", class: Object.assign(Object.assign({}, createColorClasses(this.color)), { 'flip-rtl': shouldFlip, 'icon-rtl': shouldFlip && isRTL(this.el) }) }, inheritedAttributes), Build.isBrowser && this.svgContent ? (h("div", { class: "icon-inner", innerHTML: this.svgContent })) : (h("div", { class: "icon-inner" }))));
|
|
130
135
|
}
|
|
131
136
|
/*****
|
|
132
137
|
* Private Methods
|
|
133
138
|
****/
|
|
139
|
+
setupInitialAriaLabel() {
|
|
140
|
+
// Only set aria-label during initial load if one isn't already provided
|
|
141
|
+
if (!this.inheritedAttributes['aria-label']) {
|
|
142
|
+
const iconName = getName(this.name, this.icon);
|
|
143
|
+
if (iconName) {
|
|
144
|
+
this.ariaLabel = iconName.replace(/\-/g, ' ');
|
|
145
|
+
}
|
|
146
|
+
}
|
|
147
|
+
}
|
|
134
148
|
waitUntilVisible(el, rootMargin, cb) {
|
|
135
149
|
if (Build.isBrowser && typeof window !== 'undefined' && (window).IntersectionObserver) {
|
|
136
150
|
const io = (this.io = new (window).IntersectionObserver((data) => {
|
|
@@ -357,13 +371,13 @@ export class PdsIcon {
|
|
|
357
371
|
"methodName": "updateStyles"
|
|
358
372
|
}, {
|
|
359
373
|
"propName": "name",
|
|
360
|
-
"methodName": "
|
|
374
|
+
"methodName": "onIconPropertyChange"
|
|
361
375
|
}, {
|
|
362
376
|
"propName": "src",
|
|
363
|
-
"methodName": "
|
|
377
|
+
"methodName": "onIconPropertyChange"
|
|
364
378
|
}, {
|
|
365
379
|
"propName": "icon",
|
|
366
|
-
"methodName": "
|
|
380
|
+
"methodName": "onIconPropertyChange"
|
|
367
381
|
}];
|
|
368
382
|
}
|
|
369
383
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pds-icon.js","sourceRoot":"","sources":["../../../../src/components/pds-icon/pds-icon.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Build, Component, Element, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { getSvgContent, pdsIconContent } from './request';\nimport { getName, getUrl, inheritAttributes, isRTL, shouldRtlFlipIcon } from './utils';\n\n@Component({\n tag: 'pds-icon',\n assetsDirs: ['svg'],\n styleUrl: 'pds-icon.scss',\n shadow: true,\n})\nexport class PdsIcon {\n private didLoadIcon = false;\n private iconName: string | null = null;\n private io?: IntersectionObserver;\n private inheritedAttributes: { [k: string]: any } = {}; // eslint-disable-line @typescript-eslint/no-explicit-any\n\n @Element() el!: HTMLPdsIconElement;\n\n @State() private ariaLabel?: string;\n @State() private isVisible = false;\n @State() private svgContent?: string;\n\n /**\n *\n * The color of the icon\n *\n */\n @Prop() color?: string;\n\n /**\n * Determines if the icon should be flipped when the `dir` is right-to-left (`\"rtl\"`).\n * This is automatically enabled for icons that are in the `ICONS_TO_FLIP` list and\n * when the `dir` is `\"rtl\"`. If `flipRtl` is set to `false`, the icon will not be flipped\n * even if the `dir` is `\"rtl\"`.\n */\n @Prop() flipRtl?: boolean;\n\n /**\n * This is a combination of both `name` and `src`. If a `src` URL is detected,\n * it will set the `src` property. Otherwise it assumes it's a built-in named\n * SVG and sets the `name` property.\n */\n @Prop() icon?: any;\n\n /**\n * The name of the icon to use from\n * the built-in set.\n */\n @Prop({ reflect: true }) name?: string;\n\n /**\n * The size of the icon. This can be\n * 'small', 'regular', 'medium', 'large', or a\n * custom value (40px, 1rem, etc)\n *\n */\n @Prop({ reflect: true }) size?:\n | 'small' // 12px\n | 'regular' // 16px\n | 'medium' // 20px\n | 'large' // 24px\n | 'auto'\n | string = 'regular'\n\n /**\n *\n * Specifies the exact `src` of an SVG file to use.\n */\n @Prop() src?: string;\n\n private iconSize() {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const sizes: { [key: string]: any } = {\n small: '12px',\n regular: '16px',\n medium: '20px',\n large: '24px',\n }\n\n if (sizes[this.size]) {\n return sizes[this.size];\n } else {\n return this.size;\n }\n }\n\n componentDidLoad() {\n this.setCSSVariables();\n\n if (!this.didLoadIcon) {\n this.loadIcon();\n }\n\n // Fallback: Ensure icon loads even if IntersectionObserver doesn't fire\n setTimeout(() => {\n if (!this.svgContent && !this.isVisible) {\n this.isVisible = true;\n this.loadIcon();\n }\n }, 100);\n\n // Additional fallback for client-side navigation (React Router, etc.)\n // React's useLayoutEffect and rendering cycles can delay visibility detection\n setTimeout(() => {\n if (!this.svgContent && !this.isVisible) {\n this.isVisible = true;\n this.loadIcon();\n }\n }, 500);\n }\n\n componentWillLoad() {\n this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);\n this.setCSSVariables();\n }\n\n setCSSVariables() {\n this.el.style.setProperty(`--dimension-icon-height`, this.iconSize());\n this.el.style.setProperty(`--dimension-icon-width`, this.iconSize());\n this.el.style.setProperty(`--color-icon-fill`, typeof this.color !== 'undefined' ? this.color : 'currentColor');\n }\n\n connectedCallback() {\n // Handle re-connection during client-side navigation\n if (!this.isVisible && !this.svgContent) {\n this.waitUntilVisible(this.el, '50px', () => {\n this.isVisible = true;\n this.loadIcon();\n });\n }\n\n // Immediate load attempt if already visible (e.g., during React navigation)\n if (this.isElementInViewport(this.el)) {\n this.isVisible = true;\n this.loadIcon();\n }\n }\n\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n }\n\n @Watch('size')\n @Watch('color')\n updateStyles() {\n this.setCSSVariables();\n }\n\n @Watch('name')\n @Watch('src')\n @Watch('icon')\n loadIcon() {\n // Reset load state when URL changes\n this.didLoadIcon = false;\n\n // Clear existing content to prevent stale content when switching icons\n this.svgContent = undefined;\n\n if (Build.isBrowser && this.isVisible) {\n const url = getUrl(this);\n if (url) {\n if (pdsIconContent.has(url)) {\n this.svgContent = pdsIconContent.get(url);\n } else {\n // Fix: Ensure promise callback triggers re-render and handle errors\n getSvgContent(url)\n .then(() => {\n // Force re-render by setting state in next tick\n setTimeout(() => {\n this.svgContent = pdsIconContent.get(url);\n }, 0);\n })\n .catch(() => {\n // Handle fetch errors gracefully\n this.svgContent = '';\n });\n }\n this.didLoadIcon = true;\n }\n }\n\n this.iconName = getName(this.name, this.icon);\n\n if (this.iconName) {\n this.ariaLabel = this.iconName.replace(/\\-/g, ' ');\n }\n }\n\n render() {\n const { ariaLabel, flipRtl, iconName,inheritedAttributes } = this;\n const shouldIconAutoFlip = iconName\n ? shouldRtlFlipIcon(iconName, this.el) && flipRtl !== false\n : false;\n const shouldFlip = flipRtl || shouldIconAutoFlip;\n\n return (\n\n <Host\n aria-label={ariaLabel !== undefined && !this.hasAriaHidden() ? ariaLabel : null }\n alt=\"\"\n role=\"img\"\n class={{\n ...createColorClasses(this.color),\n 'flip-rtl': shouldFlip,\n 'icon-rtl': shouldFlip && isRTL(this.el)\n }}\n {...inheritedAttributes}\n >\n {Build.isBrowser && this.svgContent ? (\n <div class=\"icon-inner\" innerHTML={this.svgContent}></div>\n ) : (\n <div class=\"icon-inner\"></div>\n )}\n </Host>\n )\n }\n\n /*****\n * Private Methods\n ****/\n\n private waitUntilVisible(el: HTMLElement, rootMargin: string, cb: () => void) {\n if (Build.isBrowser && typeof window !== 'undefined' && (window).IntersectionObserver) {\n const io = (this.io = new (window).IntersectionObserver(\n (data: IntersectionObserverEntry[]) => {\n if (data[0].isIntersecting) {\n io.disconnect();\n this.io = undefined;\n cb();\n }\n },\n { rootMargin },\n ));\n\n io.observe(el);\n\n // Safety timeout for client-side navigation scenarios\n // Sometimes IntersectionObserver doesn't fire during React navigation\n setTimeout(() => {\n if (this.io && !this.isVisible) {\n // Check if element is actually visible in viewport\n if (this.isElementInViewport(el)) {\n this.io.disconnect();\n this.io = undefined;\n cb();\n }\n }\n }, 1000);\n } else {\n // browser doesn't support IntersectionObserver\n // so just fallback to always show it\n cb();\n }\n }\n\n private isElementInViewport(el: HTMLElement): boolean {\n if (!el || !el.isConnected) return false;\n\n const rect = el.getBoundingClientRect();\n const windowHeight = window.innerHeight || document.documentElement.clientHeight;\n const windowWidth = window.innerWidth || document.documentElement.clientWidth;\n\n return (\n rect.top >= 0 &&\n rect.left >= 0 &&\n rect.bottom <= windowHeight &&\n rect.right <= windowWidth\n ) || (\n // Also consider partially visible elements\n rect.top < windowHeight &&\n rect.bottom > 0 &&\n rect.left < windowWidth &&\n rect.right > 0\n );\n }\n\n private hasAriaHidden = () => {\n const { el } = this;\n\n return el.hasAttribute('aria-hidden') && el.getAttribute('aria-hidden') === 'true';\n }\n\n /**\n * Debug method to help diagnose loading issues\n * Call from browser console: document.querySelector('pds-icon').debugIconState()\n */\n debugIconState() {\n const url = getUrl(this);\n const rect = this.el.getBoundingClientRect();\n\n console.log('PdsIcon Debug State:', {\n name: this.name,\n src: this.src,\n icon: this.icon,\n iconName: this.iconName,\n url,\n isVisible: this.isVisible,\n didLoadIcon: this.didLoadIcon,\n hasSvgContent: !!this.svgContent,\n svgContentLength: this.svgContent?.length || 0,\n isInCache: url ? pdsIconContent.has(url) : false,\n cachedContent: url ? pdsIconContent.get(url) : null,\n element: this.el,\n // Client-side navigation specific debug info\n isConnected: this.el.isConnected,\n isInViewport: this.isElementInViewport(this.el),\n hasIntersectionObserver: !!this.io,\n boundingClientRect: rect,\n windowDimensions: {\n width: window.innerWidth || document.documentElement.clientWidth,\n height: window.innerHeight || document.documentElement.clientHeight\n }\n });\n }\n}\n\nconst createColorClasses = (color: string | undefined) => {\n return color\n ? {\n 'pds-color': true,\n [`pds-color-${color}`]: true,\n }\n : null;\n };\n"]}
|
|
1
|
+
{"version":3,"file":"pds-icon.js","sourceRoot":"","sources":["../../../../src/components/pds-icon/pds-icon.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Build, Component, Element, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { getSvgContent, pdsIconContent } from './request';\nimport { getName, getUrl, inheritAttributes, isRTL, shouldRtlFlipIcon } from './utils';\n\n@Component({\n tag: 'pds-icon',\n assetsDirs: ['svg'],\n styleUrl: 'pds-icon.scss',\n shadow: true,\n})\nexport class PdsIcon {\n private didLoadIcon = false;\n private iconName: string | null = null;\n private io?: IntersectionObserver;\n private inheritedAttributes: { [k: string]: any } = {}; // eslint-disable-line @typescript-eslint/no-explicit-any\n\n @Element() el!: HTMLPdsIconElement;\n\n @State() private ariaLabel?: string;\n @State() private isVisible = false;\n @State() private svgContent?: string;\n\n /**\n *\n * The color of the icon\n *\n */\n @Prop() color?: string;\n\n /**\n * Determines if the icon should be flipped when the `dir` is right-to-left (`\"rtl\"`).\n * This is automatically enabled for icons that are in the `ICONS_TO_FLIP` list and\n * when the `dir` is `\"rtl\"`. If `flipRtl` is set to `false`, the icon will not be flipped\n * even if the `dir` is `\"rtl\"`.\n */\n @Prop() flipRtl?: boolean;\n\n /**\n * This is a combination of both `name` and `src`. If a `src` URL is detected,\n * it will set the `src` property. Otherwise it assumes it's a built-in named\n * SVG and sets the `name` property.\n */\n @Prop() icon?: any;\n\n /**\n * The name of the icon to use from\n * the built-in set.\n */\n @Prop({ reflect: true }) name?: string;\n\n /**\n * The size of the icon. This can be\n * 'small', 'regular', 'medium', 'large', or a\n * custom value (40px, 1rem, etc)\n *\n */\n @Prop({ reflect: true }) size?:\n | 'small' // 12px\n | 'regular' // 16px\n | 'medium' // 20px\n | 'large' // 24px\n | 'auto'\n | string = 'regular'\n\n /**\n *\n * Specifies the exact `src` of an SVG file to use.\n */\n @Prop() src?: string;\n\n private iconSize() {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const sizes: { [key: string]: any } = {\n small: '12px',\n regular: '16px',\n medium: '20px',\n large: '24px',\n }\n\n if (sizes[this.size]) {\n return sizes[this.size];\n } else {\n return this.size;\n }\n }\n\n componentDidLoad() {\n this.setCSSVariables();\n\n if (!this.didLoadIcon) {\n this.loadIcon();\n }\n\n // Fallback: Ensure icon loads even if IntersectionObserver doesn't fire\n setTimeout(() => {\n if (!this.svgContent && !this.isVisible) {\n this.isVisible = true;\n this.loadIcon();\n }\n }, 100);\n\n // Additional fallback for client-side navigation (React Router, etc.)\n // React's useLayoutEffect and rendering cycles can delay visibility detection\n setTimeout(() => {\n if (!this.svgContent && !this.isVisible) {\n this.isVisible = true;\n this.loadIcon();\n }\n }, 500);\n }\n\n componentWillLoad() {\n this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);\n this.setCSSVariables();\n this.setupInitialAriaLabel();\n }\n\n setCSSVariables() {\n this.el.style.setProperty(`--dimension-icon-height`, this.iconSize());\n this.el.style.setProperty(`--dimension-icon-width`, this.iconSize());\n this.el.style.setProperty(`--color-icon-fill`, typeof this.color !== 'undefined' ? this.color : 'currentColor');\n }\n\n connectedCallback() {\n // Handle re-connection during client-side navigation\n if (!this.isVisible && !this.svgContent) {\n this.waitUntilVisible(this.el, '50px', () => {\n this.isVisible = true;\n this.loadIcon();\n });\n }\n\n // Immediate load attempt if already visible (e.g., during React navigation)\n if (this.isElementInViewport(this.el)) {\n this.isVisible = true;\n this.loadIcon();\n }\n }\n\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n }\n\n @Watch('size')\n @Watch('color')\n updateStyles() {\n this.setCSSVariables();\n }\n\n @Watch('name')\n @Watch('src')\n @Watch('icon')\n onIconPropertyChange() {\n this.loadIcon();\n // Update aria-label when icon properties change\n this.setupInitialAriaLabel();\n }\n\n loadIcon() {\n // Reset load state when URL changes\n this.didLoadIcon = false;\n\n // Clear existing content to prevent stale content when switching icons\n this.svgContent = undefined;\n\n if (Build.isBrowser && this.isVisible) {\n const url = getUrl(this);\n if (url) {\n if (pdsIconContent.has(url)) {\n this.svgContent = pdsIconContent.get(url);\n } else {\n // Fix: Ensure promise callback triggers re-render and handle errors\n getSvgContent(url)\n .then(() => {\n // Force re-render by setting state in next tick\n setTimeout(() => {\n this.svgContent = pdsIconContent.get(url);\n }, 0);\n })\n .catch(() => {\n // Handle fetch errors gracefully\n this.svgContent = '';\n });\n }\n this.didLoadIcon = true;\n }\n }\n\n this.iconName = getName(this.name, this.icon);\n }\n\n render() {\n const { ariaLabel, flipRtl, iconName,inheritedAttributes } = this;\n const shouldIconAutoFlip = iconName\n ? shouldRtlFlipIcon(iconName, this.el) && flipRtl !== false\n : false;\n const shouldFlip = flipRtl || shouldIconAutoFlip;\n\n // Use inherited aria-label if provided, otherwise fall back to auto-generated one\n const finalAriaLabel = inheritedAttributes['aria-label'] || ariaLabel;\n\n return (\n\n <Host\n aria-label={finalAriaLabel !== undefined && !this.hasAriaHidden() ? finalAriaLabel : null }\n alt=\"\"\n role=\"img\"\n class={{\n ...createColorClasses(this.color),\n 'flip-rtl': shouldFlip,\n 'icon-rtl': shouldFlip && isRTL(this.el)\n }}\n {...inheritedAttributes}\n >\n {Build.isBrowser && this.svgContent ? (\n <div class=\"icon-inner\" innerHTML={this.svgContent}></div>\n ) : (\n <div class=\"icon-inner\"></div>\n )}\n </Host>\n )\n }\n\n /*****\n * Private Methods\n ****/\n\n private setupInitialAriaLabel() {\n // Only set aria-label during initial load if one isn't already provided\n if (!this.inheritedAttributes['aria-label']) {\n const iconName = getName(this.name, this.icon);\n if (iconName) {\n this.ariaLabel = iconName.replace(/\\-/g, ' ');\n }\n }\n }\n\n private waitUntilVisible(el: HTMLElement, rootMargin: string, cb: () => void) {\n if (Build.isBrowser && typeof window !== 'undefined' && (window).IntersectionObserver) {\n const io = (this.io = new (window).IntersectionObserver(\n (data: IntersectionObserverEntry[]) => {\n if (data[0].isIntersecting) {\n io.disconnect();\n this.io = undefined;\n cb();\n }\n },\n { rootMargin },\n ));\n\n io.observe(el);\n\n // Safety timeout for client-side navigation scenarios\n // Sometimes IntersectionObserver doesn't fire during React navigation\n setTimeout(() => {\n if (this.io && !this.isVisible) {\n // Check if element is actually visible in viewport\n if (this.isElementInViewport(el)) {\n this.io.disconnect();\n this.io = undefined;\n cb();\n }\n }\n }, 1000);\n } else {\n // browser doesn't support IntersectionObserver\n // so just fallback to always show it\n cb();\n }\n }\n\n private isElementInViewport(el: HTMLElement): boolean {\n if (!el || !el.isConnected) return false;\n\n const rect = el.getBoundingClientRect();\n const windowHeight = window.innerHeight || document.documentElement.clientHeight;\n const windowWidth = window.innerWidth || document.documentElement.clientWidth;\n\n return (\n rect.top >= 0 &&\n rect.left >= 0 &&\n rect.bottom <= windowHeight &&\n rect.right <= windowWidth\n ) || (\n // Also consider partially visible elements\n rect.top < windowHeight &&\n rect.bottom > 0 &&\n rect.left < windowWidth &&\n rect.right > 0\n );\n }\n\n private hasAriaHidden = () => {\n const { el } = this;\n\n return el.hasAttribute('aria-hidden') && el.getAttribute('aria-hidden') === 'true';\n }\n\n /**\n * Debug method to help diagnose loading issues\n * Call from browser console: document.querySelector('pds-icon').debugIconState()\n */\n debugIconState() {\n const url = getUrl(this);\n const rect = this.el.getBoundingClientRect();\n\n console.log('PdsIcon Debug State:', {\n name: this.name,\n src: this.src,\n icon: this.icon,\n iconName: this.iconName,\n url,\n isVisible: this.isVisible,\n didLoadIcon: this.didLoadIcon,\n hasSvgContent: !!this.svgContent,\n svgContentLength: this.svgContent?.length || 0,\n isInCache: url ? pdsIconContent.has(url) : false,\n cachedContent: url ? pdsIconContent.get(url) : null,\n element: this.el,\n // Client-side navigation specific debug info\n isConnected: this.el.isConnected,\n isInViewport: this.isElementInViewport(this.el),\n hasIntersectionObserver: !!this.io,\n boundingClientRect: rect,\n windowDimensions: {\n width: window.innerWidth || document.documentElement.clientWidth,\n height: window.innerHeight || document.documentElement.clientHeight\n }\n });\n }\n}\n\nconst createColorClasses = (color: string | undefined) => {\n return color\n ? {\n 'pds-color': true,\n [`pds-color-${color}`]: true,\n }\n : null;\n };\n"]}
|
package/dist/docs.json
CHANGED
package/dist/esm/loader.js
CHANGED
|
@@ -5,7 +5,7 @@ import { g as globalScripts } from './app-globals-DQuL1Twl.js';
|
|
|
5
5
|
const defineCustomElements = async (win, options) => {
|
|
6
6
|
if (typeof window === 'undefined') return undefined;
|
|
7
7
|
await globalScripts();
|
|
8
|
-
return bootstrapLazy([["pds-icon",[[1,"pds-icon",{"color":[1],"flipRtl":[4,"flip-rtl"],"icon":[8],"name":[513],"size":[513],"src":[1],"ariaLabel":[32],"isVisible":[32],"svgContent":[32]},null,{"size":["updateStyles"],"color":["updateStyles"],"name":["
|
|
8
|
+
return bootstrapLazy([["pds-icon",[[1,"pds-icon",{"color":[1],"flipRtl":[4,"flip-rtl"],"icon":[8],"name":[513],"size":[513],"src":[1],"ariaLabel":[32],"isVisible":[32],"svgContent":[32]},null,{"size":["updateStyles"],"color":["updateStyles"],"name":["onIconPropertyChange"],"src":["onIconPropertyChange"],"icon":["onIconPropertyChange"]}]]]], options);
|
|
9
9
|
};
|
|
10
10
|
|
|
11
11
|
export { defineCustomElements };
|
|
@@ -169,6 +169,7 @@ const PdsIcon = class {
|
|
|
169
169
|
componentWillLoad() {
|
|
170
170
|
this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);
|
|
171
171
|
this.setCSSVariables();
|
|
172
|
+
this.setupInitialAriaLabel();
|
|
172
173
|
}
|
|
173
174
|
setCSSVariables() {
|
|
174
175
|
this.el.style.setProperty(`--dimension-icon-height`, this.iconSize());
|
|
@@ -198,6 +199,11 @@ const PdsIcon = class {
|
|
|
198
199
|
updateStyles() {
|
|
199
200
|
this.setCSSVariables();
|
|
200
201
|
}
|
|
202
|
+
onIconPropertyChange() {
|
|
203
|
+
this.loadIcon();
|
|
204
|
+
// Update aria-label when icon properties change
|
|
205
|
+
this.setupInitialAriaLabel();
|
|
206
|
+
}
|
|
201
207
|
loadIcon() {
|
|
202
208
|
// Reset load state when URL changes
|
|
203
209
|
this.didLoadIcon = false;
|
|
@@ -227,9 +233,6 @@ const PdsIcon = class {
|
|
|
227
233
|
}
|
|
228
234
|
}
|
|
229
235
|
this.iconName = getName(this.name, this.icon);
|
|
230
|
-
if (this.iconName) {
|
|
231
|
-
this.ariaLabel = this.iconName.replace(/\-/g, ' ');
|
|
232
|
-
}
|
|
233
236
|
}
|
|
234
237
|
render() {
|
|
235
238
|
const { ariaLabel, flipRtl, iconName, inheritedAttributes } = this;
|
|
@@ -237,11 +240,22 @@ const PdsIcon = class {
|
|
|
237
240
|
? shouldRtlFlipIcon(iconName, this.el) && flipRtl !== false
|
|
238
241
|
: false;
|
|
239
242
|
const shouldFlip = flipRtl || shouldIconAutoFlip;
|
|
240
|
-
|
|
243
|
+
// Use inherited aria-label if provided, otherwise fall back to auto-generated one
|
|
244
|
+
const finalAriaLabel = inheritedAttributes['aria-label'] || ariaLabel;
|
|
245
|
+
return (h(Host, Object.assign({ key: '43aa73531314e6529a887468e69362430d006229', "aria-label": finalAriaLabel !== undefined && !this.hasAriaHidden() ? finalAriaLabel : null, alt: "", role: "img", class: Object.assign(Object.assign({}, createColorClasses(this.color)), { 'flip-rtl': shouldFlip, 'icon-rtl': shouldFlip && isRTL(this.el) }) }, inheritedAttributes), this.svgContent ? (h("div", { class: "icon-inner", innerHTML: this.svgContent })) : (h("div", { class: "icon-inner" }))));
|
|
241
246
|
}
|
|
242
247
|
/*****
|
|
243
248
|
* Private Methods
|
|
244
249
|
****/
|
|
250
|
+
setupInitialAriaLabel() {
|
|
251
|
+
// Only set aria-label during initial load if one isn't already provided
|
|
252
|
+
if (!this.inheritedAttributes['aria-label']) {
|
|
253
|
+
const iconName = getName(this.name, this.icon);
|
|
254
|
+
if (iconName) {
|
|
255
|
+
this.ariaLabel = iconName.replace(/\-/g, ' ');
|
|
256
|
+
}
|
|
257
|
+
}
|
|
258
|
+
}
|
|
245
259
|
waitUntilVisible(el, rootMargin, cb) {
|
|
246
260
|
if (typeof window !== 'undefined' && (window).IntersectionObserver) {
|
|
247
261
|
const io = (this.io = new (window).IntersectionObserver((data) => {
|
|
@@ -324,9 +338,9 @@ const PdsIcon = class {
|
|
|
324
338
|
static get watchers() { return {
|
|
325
339
|
"size": ["updateStyles"],
|
|
326
340
|
"color": ["updateStyles"],
|
|
327
|
-
"name": ["
|
|
328
|
-
"src": ["
|
|
329
|
-
"icon": ["
|
|
341
|
+
"name": ["onIconPropertyChange"],
|
|
342
|
+
"src": ["onIconPropertyChange"],
|
|
343
|
+
"icon": ["onIconPropertyChange"]
|
|
330
344
|
}; }
|
|
331
345
|
};
|
|
332
346
|
const createColorClasses = (color) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pds-icon.entry.js","sources":["src/components/pds-icon/validate.ts","src/components/pds-icon/request.ts","src/components/pds-icon/pds-icon.scss?tag=pds-icon&encapsulation=shadow","src/components/pds-icon/pds-icon.tsx"],"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-pds-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\nexport const isSvgDataUrl = (url: string) => url.startsWith('data:image/svg+xml');\nexport const isEncodedDataUrl = (url: string) => url.indexOf(';utf8,') !== -1;\n","import { isEncodedDataUrl, isSvgDataUrl, validateContent } from './validate';\n\nexport const pdsIconContent = new Map<string, string>();\nconst requests = new Map<string, Promise<any>>(); // eslint-disable-line @typescript-eslint/no-explicit-any\n\nlet parser: DOMParser;\n\nexport const getSvgContent = (url: string, sanitize = false) => {\n let req = requests.get(url);\n\n if(!req) {\n if (typeof fetch != 'undefined' && typeof document !== 'undefined') {\n if (isSvgDataUrl(url) && isEncodedDataUrl(url)) {\n if (!parser) {\n parser = new DOMParser();\n }\n\n try {\n const doc = parser.parseFromString(url, 'text/html');\n const svg = doc.querySelector('svg');\n\n if (svg) {\n pdsIconContent.set(url, svg.outerHTML);\n } else {\n pdsIconContent.set(url, '');\n }\n } catch (error) {\n pdsIconContent.set(url, '');\n }\n\n return Promise.resolve();\n } else {\n // we don't have a request\n req = fetch(url).then((rsp) => {\n if (rsp.ok) {\n return rsp.text().then((svgContent) => {\n if (svgContent && sanitize !== false) {\n try {\n svgContent = validateContent(svgContent);\n } catch (validationError) {\n svgContent = '';\n }\n }\n pdsIconContent.set(url, svgContent || '');\n });\n } else {\n // Handle HTTP errors\n throw new Error(`Failed to load SVG: ${rsp.status} ${rsp.statusText}`);\n }\n }).catch((error) => {\n // Handle all fetch errors gracefully\n console.warn('Failed to load SVG:', url, error);\n pdsIconContent.set(url, '');\n // Don't re-throw to prevent unhandled promise rejections\n });\n\n requests.set(url, req);\n }\n } else {\n pdsIconContent.set(url, '');\n return Promise.resolve();\n }\n }\n\n return req;\n}\n",":host {\n --dimension-icon-height: 16px;\n --dimension-icon-width: 16px;\n --color-icon-fill: currentColor;\n\n contain: strict;\n display: inline-block;\n fill: var(--color-icon-fill);\n flex-shrink: 0;\n height: var(--dimension-icon-height);\n width: var(--dimension-icon-width);\n\n .pdsicon {\n fill: var(--color-icon-fill);\n }\n}\n\n.pds-icon-fill-none {\n fill: none;\n}\n\n.icon-inner,\n.pds-icon,\nsvg {\n display: block;\n height: 100%;\n width: 100%;\n}\n\n/* :host-context is supported in chromium; :dir is supported in safari & firefox */\n:host(.flip-rtl):host-context([dir='rtl']) .icon-inner {\n transform: scaleX(-1);\n}\n\n:host(.flip-rtl:dir(rtl)) .icon-inner {\n transform: scaleX(-1);\n}\n\n/**\n * This is needed for WebKit otherwise the fallback\n * will always cause the icon to be flipped if the document\n * loads in RTL.\n */\n:host(.flip-rtl:dir(ltr)) .icon-inner {\n transform: scaleX(1);\n}\n\n","import { Build, Component, Element, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { getSvgContent, pdsIconContent } from './request';\nimport { getName, getUrl, inheritAttributes, isRTL, shouldRtlFlipIcon } from './utils';\n\n@Component({\n tag: 'pds-icon',\n assetsDirs: ['svg'],\n styleUrl: 'pds-icon.scss',\n shadow: true,\n})\nexport class PdsIcon {\n private didLoadIcon = false;\n private iconName: string | null = null;\n private io?: IntersectionObserver;\n private inheritedAttributes: { [k: string]: any } = {}; // eslint-disable-line @typescript-eslint/no-explicit-any\n\n @Element() el!: HTMLPdsIconElement;\n\n @State() private ariaLabel?: string;\n @State() private isVisible = false;\n @State() private svgContent?: string;\n\n /**\n *\n * The color of the icon\n *\n */\n @Prop() color?: string;\n\n /**\n * Determines if the icon should be flipped when the `dir` is right-to-left (`\"rtl\"`).\n * This is automatically enabled for icons that are in the `ICONS_TO_FLIP` list and\n * when the `dir` is `\"rtl\"`. If `flipRtl` is set to `false`, the icon will not be flipped\n * even if the `dir` is `\"rtl\"`.\n */\n @Prop() flipRtl?: boolean;\n\n /**\n * This is a combination of both `name` and `src`. If a `src` URL is detected,\n * it will set the `src` property. Otherwise it assumes it's a built-in named\n * SVG and sets the `name` property.\n */\n @Prop() icon?: any;\n\n /**\n * The name of the icon to use from\n * the built-in set.\n */\n @Prop({ reflect: true }) name?: string;\n\n /**\n * The size of the icon. This can be\n * 'small', 'regular', 'medium', 'large', or a\n * custom value (40px, 1rem, etc)\n *\n */\n @Prop({ reflect: true }) size?:\n | 'small' // 12px\n | 'regular' // 16px\n | 'medium' // 20px\n | 'large' // 24px\n | 'auto'\n | string = 'regular'\n\n /**\n *\n * Specifies the exact `src` of an SVG file to use.\n */\n @Prop() src?: string;\n\n private iconSize() {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const sizes: { [key: string]: any } = {\n small: '12px',\n regular: '16px',\n medium: '20px',\n large: '24px',\n }\n\n if (sizes[this.size]) {\n return sizes[this.size];\n } else {\n return this.size;\n }\n }\n\n componentDidLoad() {\n this.setCSSVariables();\n\n if (!this.didLoadIcon) {\n this.loadIcon();\n }\n\n // Fallback: Ensure icon loads even if IntersectionObserver doesn't fire\n setTimeout(() => {\n if (!this.svgContent && !this.isVisible) {\n this.isVisible = true;\n this.loadIcon();\n }\n }, 100);\n\n // Additional fallback for client-side navigation (React Router, etc.)\n // React's useLayoutEffect and rendering cycles can delay visibility detection\n setTimeout(() => {\n if (!this.svgContent && !this.isVisible) {\n this.isVisible = true;\n this.loadIcon();\n }\n }, 500);\n }\n\n componentWillLoad() {\n this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);\n this.setCSSVariables();\n }\n\n setCSSVariables() {\n this.el.style.setProperty(`--dimension-icon-height`, this.iconSize());\n this.el.style.setProperty(`--dimension-icon-width`, this.iconSize());\n this.el.style.setProperty(`--color-icon-fill`, typeof this.color !== 'undefined' ? this.color : 'currentColor');\n }\n\n connectedCallback() {\n // Handle re-connection during client-side navigation\n if (!this.isVisible && !this.svgContent) {\n this.waitUntilVisible(this.el, '50px', () => {\n this.isVisible = true;\n this.loadIcon();\n });\n }\n\n // Immediate load attempt if already visible (e.g., during React navigation)\n if (this.isElementInViewport(this.el)) {\n this.isVisible = true;\n this.loadIcon();\n }\n }\n\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n }\n\n @Watch('size')\n @Watch('color')\n updateStyles() {\n this.setCSSVariables();\n }\n\n @Watch('name')\n @Watch('src')\n @Watch('icon')\n loadIcon() {\n // Reset load state when URL changes\n this.didLoadIcon = false;\n\n // Clear existing content to prevent stale content when switching icons\n this.svgContent = undefined;\n\n if (Build.isBrowser && this.isVisible) {\n const url = getUrl(this);\n if (url) {\n if (pdsIconContent.has(url)) {\n this.svgContent = pdsIconContent.get(url);\n } else {\n // Fix: Ensure promise callback triggers re-render and handle errors\n getSvgContent(url)\n .then(() => {\n // Force re-render by setting state in next tick\n setTimeout(() => {\n this.svgContent = pdsIconContent.get(url);\n }, 0);\n })\n .catch(() => {\n // Handle fetch errors gracefully\n this.svgContent = '';\n });\n }\n this.didLoadIcon = true;\n }\n }\n\n this.iconName = getName(this.name, this.icon);\n\n if (this.iconName) {\n this.ariaLabel = this.iconName.replace(/\\-/g, ' ');\n }\n }\n\n render() {\n const { ariaLabel, flipRtl, iconName,inheritedAttributes } = this;\n const shouldIconAutoFlip = iconName\n ? shouldRtlFlipIcon(iconName, this.el) && flipRtl !== false\n : false;\n const shouldFlip = flipRtl || shouldIconAutoFlip;\n\n return (\n\n <Host\n aria-label={ariaLabel !== undefined && !this.hasAriaHidden() ? ariaLabel : null }\n alt=\"\"\n role=\"img\"\n class={{\n ...createColorClasses(this.color),\n 'flip-rtl': shouldFlip,\n 'icon-rtl': shouldFlip && isRTL(this.el)\n }}\n {...inheritedAttributes}\n >\n {Build.isBrowser && this.svgContent ? (\n <div class=\"icon-inner\" innerHTML={this.svgContent}></div>\n ) : (\n <div class=\"icon-inner\"></div>\n )}\n </Host>\n )\n }\n\n /*****\n * Private Methods\n ****/\n\n private waitUntilVisible(el: HTMLElement, rootMargin: string, cb: () => void) {\n if (Build.isBrowser && typeof window !== 'undefined' && (window).IntersectionObserver) {\n const io = (this.io = new (window).IntersectionObserver(\n (data: IntersectionObserverEntry[]) => {\n if (data[0].isIntersecting) {\n io.disconnect();\n this.io = undefined;\n cb();\n }\n },\n { rootMargin },\n ));\n\n io.observe(el);\n\n // Safety timeout for client-side navigation scenarios\n // Sometimes IntersectionObserver doesn't fire during React navigation\n setTimeout(() => {\n if (this.io && !this.isVisible) {\n // Check if element is actually visible in viewport\n if (this.isElementInViewport(el)) {\n this.io.disconnect();\n this.io = undefined;\n cb();\n }\n }\n }, 1000);\n } else {\n // browser doesn't support IntersectionObserver\n // so just fallback to always show it\n cb();\n }\n }\n\n private isElementInViewport(el: HTMLElement): boolean {\n if (!el || !el.isConnected) return false;\n\n const rect = el.getBoundingClientRect();\n const windowHeight = window.innerHeight || document.documentElement.clientHeight;\n const windowWidth = window.innerWidth || document.documentElement.clientWidth;\n\n return (\n rect.top >= 0 &&\n rect.left >= 0 &&\n rect.bottom <= windowHeight &&\n rect.right <= windowWidth\n ) || (\n // Also consider partially visible elements\n rect.top < windowHeight &&\n rect.bottom > 0 &&\n rect.left < windowWidth &&\n rect.right > 0\n );\n }\n\n private hasAriaHidden = () => {\n const { el } = this;\n\n return el.hasAttribute('aria-hidden') && el.getAttribute('aria-hidden') === 'true';\n }\n\n /**\n * Debug method to help diagnose loading issues\n * Call from browser console: document.querySelector('pds-icon').debugIconState()\n */\n debugIconState() {\n const url = getUrl(this);\n const rect = this.el.getBoundingClientRect();\n\n console.log('PdsIcon Debug State:', {\n name: this.name,\n src: this.src,\n icon: this.icon,\n iconName: this.iconName,\n url,\n isVisible: this.isVisible,\n didLoadIcon: this.didLoadIcon,\n hasSvgContent: !!this.svgContent,\n svgContentLength: this.svgContent?.length || 0,\n isInCache: url ? pdsIconContent.has(url) : false,\n cachedContent: url ? pdsIconContent.get(url) : null,\n element: this.el,\n // Client-side navigation specific debug info\n isConnected: this.el.isConnected,\n isInViewport: this.isElementInViewport(this.el),\n hasIntersectionObserver: !!this.io,\n boundingClientRect: rect,\n windowDimensions: {\n width: window.innerWidth || document.documentElement.clientWidth,\n height: window.innerHeight || document.documentElement.clientHeight\n }\n });\n }\n}\n\nconst createColorClasses = (color: string | undefined) => {\n return color\n ? {\n 'pds-color': true,\n [`pds-color-${color}`]: true,\n }\n : null;\n };\n"],"names":[],"mappings":";;;AAEO,MAAM,eAAe,GAAG,CAAC,UAAkB,KAAI;IACpD,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;AACzC,IAAA,GAAG,CAAC,SAAS,GAAG,UAAU;;AAG1B,IAAA,KAAK,IAAI,CAAC,GAAG,GAAG,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,EAAE;AACnD,QAAA,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;;;;AAKtC,IAAA,MAAM,MAAM,GAAG,GAAG,CAAC,iBAAiB;IACpC,IAAI,MAAM,IAAI,MAAM,CAAC,QAAQ,CAAC,WAAW,EAAE,KAAK,KAAK,EAAE;QACrD,MAAM,QAAQ,GAAG,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,IAAI,EAAE;AACnD,QAAA,MAAM,CAAC,YAAY,CAAC,OAAO,EAAE,CAAC,QAAQ,GAAG,aAAa,EAAE,IAAI,EAAE,CAAC;;;;AAK/D,QAAA,IAAI,OAAO,CAAC,MAAqB,CAAC,EAAE;YAClC,OAAO,GAAG,CAAC,SAAS;;;AAGxB,IAAA,OAAO,EAAE;AACX,CAAC;AAEM,MAAM,OAAO,GAAG,CAAC,GAAgB,KAAI;AAC1C,IAAA,IAAI,GAAG,CAAC,QAAQ,KAAK,CAAC,EAAE;QACtB,IAAI,GAAG,CAAC,QAAQ,CAAC,WAAW,EAAE,KAAK,QAAQ,EAAE;AAC3C,YAAA,OAAO,KAAK;;AAGd,QAAA,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;AACnC,YAAA,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;AACzD,gBAAA,OAAO,KAAK;;;AAIhB,QAAA,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;AAC9C,gBAAA,OAAO,KAAK;;;;AAIlB,IAAA,OAAO,IAAI;AACb,CAAC;AAEM,MAAM,YAAY,GAAG,CAAC,GAAW,KAAK,GAAG,CAAC,UAAU,CAAC,oBAAoB,CAAC;AAC1E,MAAM,gBAAgB,GAAG,CAAC,GAAW,KAAK,GAAG,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,EAAE;;AClDtE,MAAM,cAAc,GAAG,IAAI,GAAG,EAAkB;AACvD,MAAM,QAAQ,GAAG,IAAI,GAAG,EAAwB,CAAC;AAEjD,IAAI,MAAiB;AAEd,MAAM,aAAa,GAAG,CAAC,GAAW,EAAE,QAAQ,GAAG,KAAK,KAAI;IAC7D,IAAI,GAAG,GAAG,QAAQ,CAAC,GAAG,CAAC,GAAG,CAAC;IAE3B,IAAG,CAAC,GAAG,EAAE;QACP,IAAI,OAAO,KAAK,IAAI,WAAW,IAAI,OAAO,QAAQ,KAAK,WAAW,EAAE;YAClE,IAAI,YAAY,CAAC,GAAG,CAAC,IAAI,gBAAgB,CAAC,GAAG,CAAC,EAAE;gBAC9C,IAAI,CAAC,MAAM,EAAE;AACX,oBAAA,MAAM,GAAG,IAAI,SAAS,EAAE;;AAG1B,gBAAA,IAAI;oBACF,MAAM,GAAG,GAAG,MAAM,CAAC,eAAe,CAAC,GAAG,EAAE,WAAW,CAAC;oBACpD,MAAM,GAAG,GAAG,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC;oBAEpC,IAAI,GAAG,EAAE;wBACP,cAAc,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,CAAC,SAAS,CAAC;;yBACjC;AACL,wBAAA,cAAc,CAAC,GAAG,CAAC,GAAG,EAAE,EAAE,CAAC;;;gBAE7B,OAAO,KAAK,EAAE;AACd,oBAAA,cAAc,CAAC,GAAG,CAAC,GAAG,EAAE,EAAE,CAAC;;AAG7B,gBAAA,OAAO,OAAO,CAAC,OAAO,EAAE;;iBACnB;;gBAEL,GAAG,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,KAAI;AAC5B,oBAAA,IAAI,GAAG,CAAC,EAAE,EAAE;wBACV,OAAO,GAAG,CAAC,IAAI,EAAE,CAAC,IAAI,CAAC,CAAC,UAAU,KAAI;AACpC,4BAAA,IAAI,UAAU,IAAI,QAAQ,KAAK,KAAK,EAAE;AACpC,gCAAA,IAAI;AACF,oCAAA,UAAU,GAAG,eAAe,CAAC,UAAU,CAAC;;gCACxC,OAAO,eAAe,EAAE;oCACxB,UAAU,GAAG,EAAE;;;4BAGnB,cAAc,CAAC,GAAG,CAAC,GAAG,EAAE,UAAU,IAAI,EAAE,CAAC;AAC3C,yBAAC,CAAC;;yBACG;;AAEL,wBAAA,MAAM,IAAI,KAAK,CAAC,CAAA,oBAAA,EAAuB,GAAG,CAAC,MAAM,CAAA,CAAA,EAAI,GAAG,CAAC,UAAU,CAAA,CAAE,CAAC;;AAE1E,iBAAC,CAAC,CAAC,KAAK,CAAC,CAAC,KAAK,KAAI;;oBAEjB,OAAO,CAAC,IAAI,CAAC,qBAAqB,EAAE,GAAG,EAAE,KAAK,CAAC;AAC/C,oBAAA,cAAc,CAAC,GAAG,CAAC,GAAG,EAAE,EAAE,CAAC;;AAE7B,iBAAC,CAAC;AAEF,gBAAA,QAAQ,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,CAAC;;;aAEnB;AACL,YAAA,cAAc,CAAC,GAAG,CAAC,GAAG,EAAE,EAAE,CAAC;AAC3B,YAAA,OAAO,OAAO,CAAC,OAAO,EAAE;;;AAI5B,IAAA,OAAO,GAAG;AACZ,CAAC;;ACjED,MAAM,UAAU,GAAG,2jBAA2jB;;MCUjkB,OAAO,GAAA,MAAA;AANpB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAOU,QAAA,IAAW,CAAA,WAAA,GAAG,KAAK;AACnB,QAAA,IAAQ,CAAA,QAAA,GAAkB,IAAI;AAE9B,QAAA,IAAA,CAAA,mBAAmB,GAAyB,EAAE,CAAC;AAKtC,QAAA,IAAS,CAAA,SAAA,GAAG,KAAK;AA+BlC;;;;;AAKG;AACsB,QAAA,IAAI,CAAA,IAAA,GAMhB,SAAS;AAyNd,QAAA,IAAa,CAAA,aAAA,GAAG,MAAK;AAC3B,YAAA,MAAM,EAAE,EAAE,EAAE,GAAG,IAAI;AAEnB,YAAA,OAAO,EAAE,CAAC,YAAY,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC,YAAY,CAAC,aAAa,CAAC,KAAK,MAAM;AACpF,SAAC;AAkCF;IAvPS,QAAQ,GAAA;;AAEd,QAAA,MAAM,KAAK,GAA2B;AACpC,YAAA,KAAK,EAAE,MAAM;AACb,YAAA,OAAO,EAAE,MAAM;AACf,YAAA,MAAM,EAAE,MAAM;AACd,YAAA,KAAK,EAAE,MAAM;SACd;AAED,QAAA,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;AACpB,YAAA,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC;;aAClB;YACL,OAAO,IAAI,CAAC,IAAI;;;IAIpB,gBAAgB,GAAA;QACd,IAAI,CAAC,eAAe,EAAE;AAEtB,QAAA,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE;YACrB,IAAI,CAAC,QAAQ,EAAE;;;QAIjB,UAAU,CAAC,MAAK;YACd,IAAI,CAAC,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;AACvC,gBAAA,IAAI,CAAC,SAAS,GAAG,IAAI;gBACrB,IAAI,CAAC,QAAQ,EAAE;;SAElB,EAAE,GAAG,CAAC;;;QAIP,UAAU,CAAC,MAAK;YACd,IAAI,CAAC,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;AACvC,gBAAA,IAAI,CAAC,SAAS,GAAG,IAAI;gBACrB,IAAI,CAAC,QAAQ,EAAE;;SAElB,EAAE,GAAG,CAAC;;IAGT,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,mBAAmB,GAAG,iBAAiB,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC,YAAY,CAAC,CAAC;QACrE,IAAI,CAAC,eAAe,EAAE;;IAGxB,eAAe,GAAA;AACb,QAAA,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,CAAyB,uBAAA,CAAA,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC;AACrE,QAAA,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,CAAwB,sBAAA,CAAA,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC;QACpE,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,CAAmB,iBAAA,CAAA,EAAE,OAAO,IAAI,CAAC,KAAK,KAAK,WAAW,GAAG,IAAI,CAAC,KAAK,GAAG,cAAc,CAAC;;IAGjH,iBAAiB,GAAA;;QAEf,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;YACvC,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,EAAE,MAAM,EAAE,MAAK;AAC1C,gBAAA,IAAI,CAAC,SAAS,GAAG,IAAI;gBACrB,IAAI,CAAC,QAAQ,EAAE;AACjB,aAAC,CAAC;;;QAIJ,IAAI,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE;AACrC,YAAA,IAAI,CAAC,SAAS,GAAG,IAAI;YACrB,IAAI,CAAC,QAAQ,EAAE;;;IAInB,oBAAoB,GAAA;AAClB,QAAA,IAAI,IAAI,CAAC,EAAE,EAAE;AACX,YAAA,IAAI,CAAC,EAAE,CAAC,UAAU,EAAE;AACpB,YAAA,IAAI,CAAC,EAAE,GAAG,SAAS;;;IAMvB,YAAY,GAAA;QACV,IAAI,CAAC,eAAe,EAAE;;IAMxB,QAAQ,GAAA;;AAEN,QAAA,IAAI,CAAC,WAAW,GAAG,KAAK;;AAGxB,QAAA,IAAI,CAAC,UAAU,GAAG,SAAS;QAE3B,IAAuB,IAAI,CAAC,SAAS,EAAE;AACrC,YAAA,MAAM,GAAG,GAAG,MAAM,CAAC,IAAI,CAAC;YACxB,IAAI,GAAG,EAAE;AACP,gBAAA,IAAI,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;oBAC3B,IAAI,CAAC,UAAU,GAAG,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC;;qBACpC;;oBAEL,aAAa,CAAC,GAAG;yBACd,IAAI,CAAC,MAAK;;wBAET,UAAU,CAAC,MAAK;4BACd,IAAI,CAAC,UAAU,GAAG,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC;yBAC1C,EAAE,CAAC,CAAC;AACP,qBAAC;yBACA,KAAK,CAAC,MAAK;;AAEV,wBAAA,IAAI,CAAC,UAAU,GAAG,EAAE;AACtB,qBAAC,CAAC;;AAEN,gBAAA,IAAI,CAAC,WAAW,GAAG,IAAI;;;AAI3B,QAAA,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC;AAE7C,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AACjB,YAAA,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC;;;IAItD,MAAM,GAAA;QACJ,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAC,mBAAmB,EAAE,GAAG,IAAI;QACjE,MAAM,kBAAkB,GAAG;AACzB,cAAE,iBAAiB,CAAC,QAAQ,EAAE,IAAI,CAAC,EAAE,CAAC,IAAI,OAAO,KAAK;cACpD,KAAK;AACT,QAAA,MAAM,UAAU,GAAG,OAAO,IAAI,kBAAkB;AAEhD,QAAA,QAEE,CAAC,CAAA,IAAI,iFACS,SAAS,KAAK,SAAS,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,GAAG,SAAS,GAAG,IAAI,EAC/E,GAAG,EAAC,EAAE,EACN,IAAI,EAAC,KAAK,EACV,KAAK,EACA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA,EAAA,EACjC,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,UAAU,IAAI,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,EAAA,CAAA,EAAA,EAEtC,mBAAmB,CAEtB,EAAmB,IAAI,CAAC,UAAU,IACjC,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,YAAY,EAAC,SAAS,EAAE,IAAI,CAAC,UAAU,EAAA,CAAQ,KAE1D,CAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,YAAY,GAAO,CAC/B,CACI;;AAIX;;AAEM;AAEE,IAAA,gBAAgB,CAAC,EAAe,EAAE,UAAkB,EAAE,EAAc,EAAA;AAC1E,QAAA,IAAuB,OAAO,MAAM,KAAK,WAAW,IAAI,CAAC,MAAM,EAAE,oBAAoB,EAAE;AACrF,YAAA,MAAM,EAAE,IAAI,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,oBAAoB,CACrD,CAAC,IAAiC,KAAI;AACpC,gBAAA,IAAI,IAAI,CAAC,CAAC,CAAC,CAAC,cAAc,EAAE;oBAC1B,EAAE,CAAC,UAAU,EAAE;AACf,oBAAA,IAAI,CAAC,EAAE,GAAG,SAAS;AACnB,oBAAA,EAAE,EAAE;;AAER,aAAC,EACD,EAAE,UAAU,EAAE,CACf,CAAC;AAEF,YAAA,EAAE,CAAC,OAAO,CAAC,EAAE,CAAC;;;YAId,UAAU,CAAC,MAAK;gBACd,IAAI,IAAI,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;;AAE9B,oBAAA,IAAI,IAAI,CAAC,mBAAmB,CAAC,EAAE,CAAC,EAAE;AAChC,wBAAA,IAAI,CAAC,EAAE,CAAC,UAAU,EAAE;AACpB,wBAAA,IAAI,CAAC,EAAE,GAAG,SAAS;AACnB,wBAAA,EAAE,EAAE;;;aAGT,EAAE,IAAI,CAAC;;aACH;;;AAGL,YAAA,EAAE,EAAE;;;AAIA,IAAA,mBAAmB,CAAC,EAAe,EAAA;AACzC,QAAA,IAAI,CAAC,EAAE,IAAI,CAAC,EAAE,CAAC,WAAW;AAAE,YAAA,OAAO,KAAK;AAExC,QAAA,MAAM,IAAI,GAAG,EAAE,CAAC,qBAAqB,EAAE;QACvC,MAAM,YAAY,GAAG,MAAM,CAAC,WAAW,IAAI,QAAQ,CAAC,eAAe,CAAC,YAAY;QAChF,MAAM,WAAW,GAAG,MAAM,CAAC,UAAU,IAAI,QAAQ,CAAC,eAAe,CAAC,WAAW;AAE7E,QAAA,OAAO,CACL,IAAI,CAAC,GAAG,IAAI,CAAC;YACb,IAAI,CAAC,IAAI,IAAI,CAAC;YACd,IAAI,CAAC,MAAM,IAAI,YAAY;AAC3B,YAAA,IAAI,CAAC,KAAK,IAAI,WAAW;;QAGzB,IAAI,CAAC,GAAG,GAAG,YAAY;YACvB,IAAI,CAAC,MAAM,GAAG,CAAC;YACf,IAAI,CAAC,IAAI,GAAG,WAAW;AACvB,YAAA,IAAI,CAAC,KAAK,GAAG,CAAC,CACf;;AASH;;;AAGG;IACH,cAAc,GAAA;;AACZ,QAAA,MAAM,GAAG,GAAG,MAAM,CAAC,IAAI,CAAC;QACxB,MAAM,IAAI,GAAG,IAAI,CAAC,EAAE,CAAC,qBAAqB,EAAE;AAE5C,QAAA,OAAO,CAAC,GAAG,CAAC,sBAAsB,EAAE;YAClC,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,GAAG,EAAE,IAAI,CAAC,GAAG;YACb,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,GAAG;YACH,SAAS,EAAE,IAAI,CAAC,SAAS;YACzB,WAAW,EAAE,IAAI,CAAC,WAAW;AAC7B,YAAA,aAAa,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU;AAChC,YAAA,gBAAgB,EAAE,CAAA,CAAA,EAAA,GAAA,IAAI,CAAC,UAAU,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,MAAM,KAAI,CAAC;AAC9C,YAAA,SAAS,EAAE,GAAG,GAAG,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK;AAChD,YAAA,aAAa,EAAE,GAAG,GAAG,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI;YACnD,OAAO,EAAE,IAAI,CAAC,EAAE;;AAEhB,YAAA,WAAW,EAAE,IAAI,CAAC,EAAE,CAAC,WAAW;YAChC,YAAY,EAAE,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,EAAE,CAAC;AAC/C,YAAA,uBAAuB,EAAE,CAAC,CAAC,IAAI,CAAC,EAAE;AAClC,YAAA,kBAAkB,EAAE,IAAI;AACxB,YAAA,gBAAgB,EAAE;gBAChB,KAAK,EAAE,MAAM,CAAC,UAAU,IAAI,QAAQ,CAAC,eAAe,CAAC,WAAW;gBAChE,MAAM,EAAE,MAAM,CAAC,WAAW,IAAI,QAAQ,CAAC,eAAe,CAAC;AACxD;AACF,SAAA,CAAC;;;;;;;;;;;;AAIN,MAAM,kBAAkB,GAAG,CAAC,KAAyB,KAAI;AACvD,IAAA,OAAO;AACN,UAAE;AACE,YAAA,WAAW,EAAE,IAAI;AACjB,YAAA,CAAC,CAAa,UAAA,EAAA,KAAK,CAAE,CAAA,GAAG,IAAI;AAC7B;UACD,IAAI;AACR,CAAC;;;;;"}
|
|
1
|
+
{"version":3,"file":"pds-icon.entry.js","sources":["src/components/pds-icon/validate.ts","src/components/pds-icon/request.ts","src/components/pds-icon/pds-icon.scss?tag=pds-icon&encapsulation=shadow","src/components/pds-icon/pds-icon.tsx"],"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-pds-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\nexport const isSvgDataUrl = (url: string) => url.startsWith('data:image/svg+xml');\nexport const isEncodedDataUrl = (url: string) => url.indexOf(';utf8,') !== -1;\n","import { isEncodedDataUrl, isSvgDataUrl, validateContent } from './validate';\n\nexport const pdsIconContent = new Map<string, string>();\nconst requests = new Map<string, Promise<any>>(); // eslint-disable-line @typescript-eslint/no-explicit-any\n\nlet parser: DOMParser;\n\nexport const getSvgContent = (url: string, sanitize = false) => {\n let req = requests.get(url);\n\n if(!req) {\n if (typeof fetch != 'undefined' && typeof document !== 'undefined') {\n if (isSvgDataUrl(url) && isEncodedDataUrl(url)) {\n if (!parser) {\n parser = new DOMParser();\n }\n\n try {\n const doc = parser.parseFromString(url, 'text/html');\n const svg = doc.querySelector('svg');\n\n if (svg) {\n pdsIconContent.set(url, svg.outerHTML);\n } else {\n pdsIconContent.set(url, '');\n }\n } catch (error) {\n pdsIconContent.set(url, '');\n }\n\n return Promise.resolve();\n } else {\n // we don't have a request\n req = fetch(url).then((rsp) => {\n if (rsp.ok) {\n return rsp.text().then((svgContent) => {\n if (svgContent && sanitize !== false) {\n try {\n svgContent = validateContent(svgContent);\n } catch (validationError) {\n svgContent = '';\n }\n }\n pdsIconContent.set(url, svgContent || '');\n });\n } else {\n // Handle HTTP errors\n throw new Error(`Failed to load SVG: ${rsp.status} ${rsp.statusText}`);\n }\n }).catch((error) => {\n // Handle all fetch errors gracefully\n console.warn('Failed to load SVG:', url, error);\n pdsIconContent.set(url, '');\n // Don't re-throw to prevent unhandled promise rejections\n });\n\n requests.set(url, req);\n }\n } else {\n pdsIconContent.set(url, '');\n return Promise.resolve();\n }\n }\n\n return req;\n}\n",":host {\n --dimension-icon-height: 16px;\n --dimension-icon-width: 16px;\n --color-icon-fill: currentColor;\n\n contain: strict;\n display: inline-block;\n fill: var(--color-icon-fill);\n flex-shrink: 0;\n height: var(--dimension-icon-height);\n width: var(--dimension-icon-width);\n\n .pdsicon {\n fill: var(--color-icon-fill);\n }\n}\n\n.pds-icon-fill-none {\n fill: none;\n}\n\n.icon-inner,\n.pds-icon,\nsvg {\n display: block;\n height: 100%;\n width: 100%;\n}\n\n/* :host-context is supported in chromium; :dir is supported in safari & firefox */\n:host(.flip-rtl):host-context([dir='rtl']) .icon-inner {\n transform: scaleX(-1);\n}\n\n:host(.flip-rtl:dir(rtl)) .icon-inner {\n transform: scaleX(-1);\n}\n\n/**\n * This is needed for WebKit otherwise the fallback\n * will always cause the icon to be flipped if the document\n * loads in RTL.\n */\n:host(.flip-rtl:dir(ltr)) .icon-inner {\n transform: scaleX(1);\n}\n\n","import { Build, Component, Element, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { getSvgContent, pdsIconContent } from './request';\nimport { getName, getUrl, inheritAttributes, isRTL, shouldRtlFlipIcon } from './utils';\n\n@Component({\n tag: 'pds-icon',\n assetsDirs: ['svg'],\n styleUrl: 'pds-icon.scss',\n shadow: true,\n})\nexport class PdsIcon {\n private didLoadIcon = false;\n private iconName: string | null = null;\n private io?: IntersectionObserver;\n private inheritedAttributes: { [k: string]: any } = {}; // eslint-disable-line @typescript-eslint/no-explicit-any\n\n @Element() el!: HTMLPdsIconElement;\n\n @State() private ariaLabel?: string;\n @State() private isVisible = false;\n @State() private svgContent?: string;\n\n /**\n *\n * The color of the icon\n *\n */\n @Prop() color?: string;\n\n /**\n * Determines if the icon should be flipped when the `dir` is right-to-left (`\"rtl\"`).\n * This is automatically enabled for icons that are in the `ICONS_TO_FLIP` list and\n * when the `dir` is `\"rtl\"`. If `flipRtl` is set to `false`, the icon will not be flipped\n * even if the `dir` is `\"rtl\"`.\n */\n @Prop() flipRtl?: boolean;\n\n /**\n * This is a combination of both `name` and `src`. If a `src` URL is detected,\n * it will set the `src` property. Otherwise it assumes it's a built-in named\n * SVG and sets the `name` property.\n */\n @Prop() icon?: any;\n\n /**\n * The name of the icon to use from\n * the built-in set.\n */\n @Prop({ reflect: true }) name?: string;\n\n /**\n * The size of the icon. This can be\n * 'small', 'regular', 'medium', 'large', or a\n * custom value (40px, 1rem, etc)\n *\n */\n @Prop({ reflect: true }) size?:\n | 'small' // 12px\n | 'regular' // 16px\n | 'medium' // 20px\n | 'large' // 24px\n | 'auto'\n | string = 'regular'\n\n /**\n *\n * Specifies the exact `src` of an SVG file to use.\n */\n @Prop() src?: string;\n\n private iconSize() {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const sizes: { [key: string]: any } = {\n small: '12px',\n regular: '16px',\n medium: '20px',\n large: '24px',\n }\n\n if (sizes[this.size]) {\n return sizes[this.size];\n } else {\n return this.size;\n }\n }\n\n componentDidLoad() {\n this.setCSSVariables();\n\n if (!this.didLoadIcon) {\n this.loadIcon();\n }\n\n // Fallback: Ensure icon loads even if IntersectionObserver doesn't fire\n setTimeout(() => {\n if (!this.svgContent && !this.isVisible) {\n this.isVisible = true;\n this.loadIcon();\n }\n }, 100);\n\n // Additional fallback for client-side navigation (React Router, etc.)\n // React's useLayoutEffect and rendering cycles can delay visibility detection\n setTimeout(() => {\n if (!this.svgContent && !this.isVisible) {\n this.isVisible = true;\n this.loadIcon();\n }\n }, 500);\n }\n\n componentWillLoad() {\n this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);\n this.setCSSVariables();\n this.setupInitialAriaLabel();\n }\n\n setCSSVariables() {\n this.el.style.setProperty(`--dimension-icon-height`, this.iconSize());\n this.el.style.setProperty(`--dimension-icon-width`, this.iconSize());\n this.el.style.setProperty(`--color-icon-fill`, typeof this.color !== 'undefined' ? this.color : 'currentColor');\n }\n\n connectedCallback() {\n // Handle re-connection during client-side navigation\n if (!this.isVisible && !this.svgContent) {\n this.waitUntilVisible(this.el, '50px', () => {\n this.isVisible = true;\n this.loadIcon();\n });\n }\n\n // Immediate load attempt if already visible (e.g., during React navigation)\n if (this.isElementInViewport(this.el)) {\n this.isVisible = true;\n this.loadIcon();\n }\n }\n\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n }\n\n @Watch('size')\n @Watch('color')\n updateStyles() {\n this.setCSSVariables();\n }\n\n @Watch('name')\n @Watch('src')\n @Watch('icon')\n onIconPropertyChange() {\n this.loadIcon();\n // Update aria-label when icon properties change\n this.setupInitialAriaLabel();\n }\n\n loadIcon() {\n // Reset load state when URL changes\n this.didLoadIcon = false;\n\n // Clear existing content to prevent stale content when switching icons\n this.svgContent = undefined;\n\n if (Build.isBrowser && this.isVisible) {\n const url = getUrl(this);\n if (url) {\n if (pdsIconContent.has(url)) {\n this.svgContent = pdsIconContent.get(url);\n } else {\n // Fix: Ensure promise callback triggers re-render and handle errors\n getSvgContent(url)\n .then(() => {\n // Force re-render by setting state in next tick\n setTimeout(() => {\n this.svgContent = pdsIconContent.get(url);\n }, 0);\n })\n .catch(() => {\n // Handle fetch errors gracefully\n this.svgContent = '';\n });\n }\n this.didLoadIcon = true;\n }\n }\n\n this.iconName = getName(this.name, this.icon);\n }\n\n render() {\n const { ariaLabel, flipRtl, iconName,inheritedAttributes } = this;\n const shouldIconAutoFlip = iconName\n ? shouldRtlFlipIcon(iconName, this.el) && flipRtl !== false\n : false;\n const shouldFlip = flipRtl || shouldIconAutoFlip;\n\n // Use inherited aria-label if provided, otherwise fall back to auto-generated one\n const finalAriaLabel = inheritedAttributes['aria-label'] || ariaLabel;\n\n return (\n\n <Host\n aria-label={finalAriaLabel !== undefined && !this.hasAriaHidden() ? finalAriaLabel : null }\n alt=\"\"\n role=\"img\"\n class={{\n ...createColorClasses(this.color),\n 'flip-rtl': shouldFlip,\n 'icon-rtl': shouldFlip && isRTL(this.el)\n }}\n {...inheritedAttributes}\n >\n {Build.isBrowser && this.svgContent ? (\n <div class=\"icon-inner\" innerHTML={this.svgContent}></div>\n ) : (\n <div class=\"icon-inner\"></div>\n )}\n </Host>\n )\n }\n\n /*****\n * Private Methods\n ****/\n\n private setupInitialAriaLabel() {\n // Only set aria-label during initial load if one isn't already provided\n if (!this.inheritedAttributes['aria-label']) {\n const iconName = getName(this.name, this.icon);\n if (iconName) {\n this.ariaLabel = iconName.replace(/\\-/g, ' ');\n }\n }\n }\n\n private waitUntilVisible(el: HTMLElement, rootMargin: string, cb: () => void) {\n if (Build.isBrowser && typeof window !== 'undefined' && (window).IntersectionObserver) {\n const io = (this.io = new (window).IntersectionObserver(\n (data: IntersectionObserverEntry[]) => {\n if (data[0].isIntersecting) {\n io.disconnect();\n this.io = undefined;\n cb();\n }\n },\n { rootMargin },\n ));\n\n io.observe(el);\n\n // Safety timeout for client-side navigation scenarios\n // Sometimes IntersectionObserver doesn't fire during React navigation\n setTimeout(() => {\n if (this.io && !this.isVisible) {\n // Check if element is actually visible in viewport\n if (this.isElementInViewport(el)) {\n this.io.disconnect();\n this.io = undefined;\n cb();\n }\n }\n }, 1000);\n } else {\n // browser doesn't support IntersectionObserver\n // so just fallback to always show it\n cb();\n }\n }\n\n private isElementInViewport(el: HTMLElement): boolean {\n if (!el || !el.isConnected) return false;\n\n const rect = el.getBoundingClientRect();\n const windowHeight = window.innerHeight || document.documentElement.clientHeight;\n const windowWidth = window.innerWidth || document.documentElement.clientWidth;\n\n return (\n rect.top >= 0 &&\n rect.left >= 0 &&\n rect.bottom <= windowHeight &&\n rect.right <= windowWidth\n ) || (\n // Also consider partially visible elements\n rect.top < windowHeight &&\n rect.bottom > 0 &&\n rect.left < windowWidth &&\n rect.right > 0\n );\n }\n\n private hasAriaHidden = () => {\n const { el } = this;\n\n return el.hasAttribute('aria-hidden') && el.getAttribute('aria-hidden') === 'true';\n }\n\n /**\n * Debug method to help diagnose loading issues\n * Call from browser console: document.querySelector('pds-icon').debugIconState()\n */\n debugIconState() {\n const url = getUrl(this);\n const rect = this.el.getBoundingClientRect();\n\n console.log('PdsIcon Debug State:', {\n name: this.name,\n src: this.src,\n icon: this.icon,\n iconName: this.iconName,\n url,\n isVisible: this.isVisible,\n didLoadIcon: this.didLoadIcon,\n hasSvgContent: !!this.svgContent,\n svgContentLength: this.svgContent?.length || 0,\n isInCache: url ? pdsIconContent.has(url) : false,\n cachedContent: url ? pdsIconContent.get(url) : null,\n element: this.el,\n // Client-side navigation specific debug info\n isConnected: this.el.isConnected,\n isInViewport: this.isElementInViewport(this.el),\n hasIntersectionObserver: !!this.io,\n boundingClientRect: rect,\n windowDimensions: {\n width: window.innerWidth || document.documentElement.clientWidth,\n height: window.innerHeight || document.documentElement.clientHeight\n }\n });\n }\n}\n\nconst createColorClasses = (color: string | undefined) => {\n return color\n ? {\n 'pds-color': true,\n [`pds-color-${color}`]: true,\n }\n : null;\n };\n"],"names":[],"mappings":"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"}
|
package/dist/esm/pds-icons.js
CHANGED
|
@@ -17,7 +17,7 @@ var patchBrowser = () => {
|
|
|
17
17
|
|
|
18
18
|
patchBrowser().then(async (options) => {
|
|
19
19
|
await globalScripts();
|
|
20
|
-
return bootstrapLazy([["pds-icon",[[1,"pds-icon",{"color":[1],"flipRtl":[4,"flip-rtl"],"icon":[8],"name":[513],"size":[513],"src":[1],"ariaLabel":[32],"isVisible":[32],"svgContent":[32]},null,{"size":["updateStyles"],"color":["updateStyles"],"name":["
|
|
20
|
+
return bootstrapLazy([["pds-icon",[[1,"pds-icon",{"color":[1],"flipRtl":[4,"flip-rtl"],"icon":[8],"name":[513],"size":[513],"src":[1],"ariaLabel":[32],"isVisible":[32],"svgContent":[32]},null,{"size":["updateStyles"],"color":["updateStyles"],"name":["onIconPropertyChange"],"src":["onIconPropertyChange"],"icon":["onIconPropertyChange"]}]]]], options);
|
|
21
21
|
});
|
|
22
22
|
//# sourceMappingURL=pds-icons.js.map
|
|
23
23
|
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,h as i,H as s,g as e}from"./p-BtVkVfWm.js";import{i as n,a as o,g as r,b as h,s as l,c}from"./p-6DkR999u.js";const a=t=>{const i=document.createElement("div");i.innerHTML=t;for(let t=i.childNodes.length-1;t>=0;t--){if(i.childNodes[t].nodeName.toLowerCase()!=="svg"){i.removeChild(i.childNodes[t])}}const s=i.firstElementChild;if(s&&s.nodeName.toLowerCase()==="svg"){const t=s.getAttribute("class")||"";s.setAttribute("class",(t+" s-pds-icon").trim());if(d(s)){return i.innerHTML}}return""};const d=t=>{if(t.nodeType===1){if(t.nodeName.toLowerCase()==="script"){return false}for(let i=0;i<t.attributes.length;i++){const s=t.attributes[i].name;if(n(s)&&s.toLowerCase().indexOf("on")===0){return false}}for(let i=0;i<t.childNodes.length;i++){if(!d(t.childNodes[i])){return false}}}return true};const f=t=>t.startsWith("data:image/svg+xml");const u=t=>t.indexOf(";utf8,")!==-1;const p=new Map;const m=new Map;let g;const w=(t,i=false)=>{let s=m.get(t);if(!s){if(typeof fetch!="undefined"&&typeof document!=="undefined"){if(f(t)&&u(t)){if(!g){g=new DOMParser}try{const i=g.parseFromString(t,"text/html");const s=i.querySelector("svg");if(s){p.set(t,s.outerHTML)}else{p.set(t,"")}}catch(i){p.set(t,"")}return Promise.resolve()}else{s=fetch(t).then((s=>{if(s.ok){return s.text().then((s=>{if(s&&i!==false){try{s=a(s)}catch(t){s=""}}p.set(t,s||"")}))}else{throw new Error(`Failed to load SVG: ${s.status} ${s.statusText}`)}})).catch((i=>{console.warn("Failed to load SVG:",t,i);p.set(t,"")}));m.set(t,s)}}else{p.set(t,"");return Promise.resolve()}}return s};const b=":host{--dimension-icon-height:16px;--dimension-icon-width:16px;--color-icon-fill:currentColor;contain:strict;display:inline-block;fill:var(--color-icon-fill);flex-shrink:0;height:var(--dimension-icon-height);width:var(--dimension-icon-width)}:host .pdsicon{fill:var(--color-icon-fill)}.pds-icon-fill-none{fill:none}.icon-inner,.pds-icon,svg{display:block;height:100%;width:100%}:host(.flip-rtl):host-context([dir=rtl]) .icon-inner{transform:scaleX(-1)}:host(.flip-rtl:dir(rtl)) .icon-inner{transform:scaleX(-1)}:host(.flip-rtl:dir(ltr)) .icon-inner{transform:scaleX(1)}";const v=class{constructor(i){t(this,i);this.didLoadIcon=false;this.iconName=null;this.inheritedAttributes={};this.isVisible=false;this.size="regular";this.hasAriaHidden=()=>{const{el:t}=this;return t.hasAttribute("aria-hidden")&&t.getAttribute("aria-hidden")==="true"}}iconSize(){const t={small:"12px",regular:"16px",medium:"20px",large:"24px"};if(t[this.size]){return t[this.size]}else{return this.size}}componentDidLoad(){this.setCSSVariables();if(!this.didLoadIcon){this.loadIcon()}setTimeout((()=>{if(!this.svgContent&&!this.isVisible){this.isVisible=true;this.loadIcon()}}),100);setTimeout((()=>{if(!this.svgContent&&!this.isVisible){this.isVisible=true;this.loadIcon()}}),500)}componentWillLoad(){this.inheritedAttributes=o(this.el,["aria-label"]);this.setCSSVariables();this.setupInitialAriaLabel()}setCSSVariables(){this.el.style.setProperty(`--dimension-icon-height`,this.iconSize());this.el.style.setProperty(`--dimension-icon-width`,this.iconSize());this.el.style.setProperty(`--color-icon-fill`,typeof this.color!=="undefined"?this.color:"currentColor")}connectedCallback(){if(!this.isVisible&&!this.svgContent){this.waitUntilVisible(this.el,"50px",(()=>{this.isVisible=true;this.loadIcon()}))}if(this.isElementInViewport(this.el)){this.isVisible=true;this.loadIcon()}}disconnectedCallback(){if(this.io){this.io.disconnect();this.io=undefined}}updateStyles(){this.setCSSVariables()}onIconPropertyChange(){this.loadIcon();this.setupInitialAriaLabel()}loadIcon(){this.didLoadIcon=false;this.svgContent=undefined;if(this.isVisible){const t=r(this);if(t){if(p.has(t)){this.svgContent=p.get(t)}else{w(t).then((()=>{setTimeout((()=>{this.svgContent=p.get(t)}),0)})).catch((()=>{this.svgContent=""}))}this.didLoadIcon=true}}this.iconName=h(this.name,this.icon)}render(){const{ariaLabel:t,flipRtl:e,iconName:n,inheritedAttributes:o}=this;const r=n?l(n,this.el)&&e!==false:false;const h=e||r;const a=o["aria-label"]||t;return i(s,Object.assign({key:"43aa73531314e6529a887468e69362430d006229","aria-label":a!==undefined&&!this.hasAriaHidden()?a:null,alt:"",role:"img",class:Object.assign(Object.assign({},y(this.color)),{"flip-rtl":h,"icon-rtl":h&&c(this.el)})},o),this.svgContent?i("div",{class:"icon-inner",innerHTML:this.svgContent}):i("div",{class:"icon-inner"}))}setupInitialAriaLabel(){if(!this.inheritedAttributes["aria-label"]){const t=h(this.name,this.icon);if(t){this.ariaLabel=t.replace(/\-/g," ")}}}waitUntilVisible(t,i,s){if(typeof window!=="undefined"&&window.IntersectionObserver){const e=this.io=new window.IntersectionObserver((t=>{if(t[0].isIntersecting){e.disconnect();this.io=undefined;s()}}),{rootMargin:i});e.observe(t);setTimeout((()=>{if(this.io&&!this.isVisible){if(this.isElementInViewport(t)){this.io.disconnect();this.io=undefined;s()}}}),1e3)}else{s()}}isElementInViewport(t){if(!t||!t.isConnected)return false;const i=t.getBoundingClientRect();const s=window.innerHeight||document.documentElement.clientHeight;const e=window.innerWidth||document.documentElement.clientWidth;return i.top>=0&&i.left>=0&&i.bottom<=s&&i.right<=e||i.top<s&&i.bottom>0&&i.left<e&&i.right>0}debugIconState(){var t;const i=r(this);const s=this.el.getBoundingClientRect();console.log("PdsIcon Debug State:",{name:this.name,src:this.src,icon:this.icon,iconName:this.iconName,url:i,isVisible:this.isVisible,didLoadIcon:this.didLoadIcon,hasSvgContent:!!this.svgContent,svgContentLength:((t=this.svgContent)===null||t===void 0?void 0:t.length)||0,isInCache:i?p.has(i):false,cachedContent:i?p.get(i):null,element:this.el,isConnected:this.el.isConnected,isInViewport:this.isElementInViewport(this.el),hasIntersectionObserver:!!this.io,boundingClientRect:s,windowDimensions:{width:window.innerWidth||document.documentElement.clientWidth,height:window.innerHeight||document.documentElement.clientHeight}})}static get assetsDirs(){return["svg"]}get el(){return e(this)}static get watchers(){return{size:["updateStyles"],color:["updateStyles"],name:["onIconPropertyChange"],src:["onIconPropertyChange"],icon:["onIconPropertyChange"]}}};const y=t=>t?{"pds-color":true,[`pds-color-${t}`]:true}:null;v.style=b;export{v as pds_icon};
|
|
2
|
+
//# sourceMappingURL=p-5ea9f963.entry.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["validateContent","svgContent","div","document","createElement","innerHTML","i","childNodes","length","nodeName","toLowerCase","removeChild","svgElm","firstElementChild","svgClass","getAttribute","setAttribute","trim","isValid","elm","nodeType","attributes","name","isStr","indexOf","isSvgDataUrl","url","startsWith","isEncodedDataUrl","pdsIconContent","Map","requests","parser","getSvgContent","sanitize","req","get","fetch","DOMParser","doc","parseFromString","svg","querySelector","set","outerHTML","error","Promise","resolve","then","rsp","ok","text","validationError","Error","status","statusText","catch","console","warn","pdsIconCss","PdsIcon","constructor","hostRef","this","didLoadIcon","iconName","inheritedAttributes","isVisible","size","hasAriaHidden","el","hasAttribute","iconSize","sizes","small","regular","medium","large","componentDidLoad","setCSSVariables","loadIcon","setTimeout","componentWillLoad","inheritAttributes","setupInitialAriaLabel","style","setProperty","color","connectedCallback","waitUntilVisible","isElementInViewport","disconnectedCallback","io","disconnect","undefined","updateStyles","onIconPropertyChange","getUrl","has","getName","icon","render","ariaLabel","flipRtl","shouldIconAutoFlip","shouldRtlFlipIcon","shouldFlip","finalAriaLabel","h","Host","Object","assign","key","alt","role","class","createColorClasses","isRTL","replace","rootMargin","cb","window","IntersectionObserver","data","isIntersecting","observe","isConnected","rect","getBoundingClientRect","windowHeight","innerHeight","documentElement","clientHeight","windowWidth","innerWidth","clientWidth","top","left","bottom","right","debugIconState","log","src","hasSvgContent","svgContentLength","_a","isInCache","cachedContent","element","isInViewport","hasIntersectionObserver","boundingClientRect","windowDimensions","width","height"],"sources":["src/components/pds-icon/validate.ts","src/components/pds-icon/request.ts","src/components/pds-icon/pds-icon.scss?tag=pds-icon&encapsulation=shadow","src/components/pds-icon/pds-icon.tsx"],"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-pds-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\nexport const isSvgDataUrl = (url: string) => url.startsWith('data:image/svg+xml');\nexport const isEncodedDataUrl = (url: string) => url.indexOf(';utf8,') !== -1;\n","import { isEncodedDataUrl, isSvgDataUrl, validateContent } from './validate';\n\nexport const pdsIconContent = new Map<string, string>();\nconst requests = new Map<string, Promise<any>>(); // eslint-disable-line @typescript-eslint/no-explicit-any\n\nlet parser: DOMParser;\n\nexport const getSvgContent = (url: string, sanitize = false) => {\n let req = requests.get(url);\n\n if(!req) {\n if (typeof fetch != 'undefined' && typeof document !== 'undefined') {\n if (isSvgDataUrl(url) && isEncodedDataUrl(url)) {\n if (!parser) {\n parser = new DOMParser();\n }\n\n try {\n const doc = parser.parseFromString(url, 'text/html');\n const svg = doc.querySelector('svg');\n\n if (svg) {\n pdsIconContent.set(url, svg.outerHTML);\n } else {\n pdsIconContent.set(url, '');\n }\n } catch (error) {\n pdsIconContent.set(url, '');\n }\n\n return Promise.resolve();\n } else {\n // we don't have a request\n req = fetch(url).then((rsp) => {\n if (rsp.ok) {\n return rsp.text().then((svgContent) => {\n if (svgContent && sanitize !== false) {\n try {\n svgContent = validateContent(svgContent);\n } catch (validationError) {\n svgContent = '';\n }\n }\n pdsIconContent.set(url, svgContent || '');\n });\n } else {\n // Handle HTTP errors\n throw new Error(`Failed to load SVG: ${rsp.status} ${rsp.statusText}`);\n }\n }).catch((error) => {\n // Handle all fetch errors gracefully\n console.warn('Failed to load SVG:', url, error);\n pdsIconContent.set(url, '');\n // Don't re-throw to prevent unhandled promise rejections\n });\n\n requests.set(url, req);\n }\n } else {\n pdsIconContent.set(url, '');\n return Promise.resolve();\n }\n }\n\n return req;\n}\n",":host {\n --dimension-icon-height: 16px;\n --dimension-icon-width: 16px;\n --color-icon-fill: currentColor;\n\n contain: strict;\n display: inline-block;\n fill: var(--color-icon-fill);\n flex-shrink: 0;\n height: var(--dimension-icon-height);\n width: var(--dimension-icon-width);\n\n .pdsicon {\n fill: var(--color-icon-fill);\n }\n}\n\n.pds-icon-fill-none {\n fill: none;\n}\n\n.icon-inner,\n.pds-icon,\nsvg {\n display: block;\n height: 100%;\n width: 100%;\n}\n\n/* :host-context is supported in chromium; :dir is supported in safari & firefox */\n:host(.flip-rtl):host-context([dir='rtl']) .icon-inner {\n transform: scaleX(-1);\n}\n\n:host(.flip-rtl:dir(rtl)) .icon-inner {\n transform: scaleX(-1);\n}\n\n/**\n * This is needed for WebKit otherwise the fallback\n * will always cause the icon to be flipped if the document\n * loads in RTL.\n */\n:host(.flip-rtl:dir(ltr)) .icon-inner {\n transform: scaleX(1);\n}\n\n","import { Build, Component, Element, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { getSvgContent, pdsIconContent } from './request';\nimport { getName, getUrl, inheritAttributes, isRTL, shouldRtlFlipIcon } from './utils';\n\n@Component({\n tag: 'pds-icon',\n assetsDirs: ['svg'],\n styleUrl: 'pds-icon.scss',\n shadow: true,\n})\nexport class PdsIcon {\n private didLoadIcon = false;\n private iconName: string | null = null;\n private io?: IntersectionObserver;\n private inheritedAttributes: { [k: string]: any } = {}; // eslint-disable-line @typescript-eslint/no-explicit-any\n\n @Element() el!: HTMLPdsIconElement;\n\n @State() private ariaLabel?: string;\n @State() private isVisible = false;\n @State() private svgContent?: string;\n\n /**\n *\n * The color of the icon\n *\n */\n @Prop() color?: string;\n\n /**\n * Determines if the icon should be flipped when the `dir` is right-to-left (`\"rtl\"`).\n * This is automatically enabled for icons that are in the `ICONS_TO_FLIP` list and\n * when the `dir` is `\"rtl\"`. If `flipRtl` is set to `false`, the icon will not be flipped\n * even if the `dir` is `\"rtl\"`.\n */\n @Prop() flipRtl?: boolean;\n\n /**\n * This is a combination of both `name` and `src`. If a `src` URL is detected,\n * it will set the `src` property. Otherwise it assumes it's a built-in named\n * SVG and sets the `name` property.\n */\n @Prop() icon?: any;\n\n /**\n * The name of the icon to use from\n * the built-in set.\n */\n @Prop({ reflect: true }) name?: string;\n\n /**\n * The size of the icon. This can be\n * 'small', 'regular', 'medium', 'large', or a\n * custom value (40px, 1rem, etc)\n *\n */\n @Prop({ reflect: true }) size?:\n | 'small' // 12px\n | 'regular' // 16px\n | 'medium' // 20px\n | 'large' // 24px\n | 'auto'\n | string = 'regular'\n\n /**\n *\n * Specifies the exact `src` of an SVG file to use.\n */\n @Prop() src?: string;\n\n private iconSize() {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const sizes: { [key: string]: any } = {\n small: '12px',\n regular: '16px',\n medium: '20px',\n large: '24px',\n }\n\n if (sizes[this.size]) {\n return sizes[this.size];\n } else {\n return this.size;\n }\n }\n\n componentDidLoad() {\n this.setCSSVariables();\n\n if (!this.didLoadIcon) {\n this.loadIcon();\n }\n\n // Fallback: Ensure icon loads even if IntersectionObserver doesn't fire\n setTimeout(() => {\n if (!this.svgContent && !this.isVisible) {\n this.isVisible = true;\n this.loadIcon();\n }\n }, 100);\n\n // Additional fallback for client-side navigation (React Router, etc.)\n // React's useLayoutEffect and rendering cycles can delay visibility detection\n setTimeout(() => {\n if (!this.svgContent && !this.isVisible) {\n this.isVisible = true;\n this.loadIcon();\n }\n }, 500);\n }\n\n componentWillLoad() {\n this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);\n this.setCSSVariables();\n this.setupInitialAriaLabel();\n }\n\n setCSSVariables() {\n this.el.style.setProperty(`--dimension-icon-height`, this.iconSize());\n this.el.style.setProperty(`--dimension-icon-width`, this.iconSize());\n this.el.style.setProperty(`--color-icon-fill`, typeof this.color !== 'undefined' ? this.color : 'currentColor');\n }\n\n connectedCallback() {\n // Handle re-connection during client-side navigation\n if (!this.isVisible && !this.svgContent) {\n this.waitUntilVisible(this.el, '50px', () => {\n this.isVisible = true;\n this.loadIcon();\n });\n }\n\n // Immediate load attempt if already visible (e.g., during React navigation)\n if (this.isElementInViewport(this.el)) {\n this.isVisible = true;\n this.loadIcon();\n }\n }\n\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n }\n\n @Watch('size')\n @Watch('color')\n updateStyles() {\n this.setCSSVariables();\n }\n\n @Watch('name')\n @Watch('src')\n @Watch('icon')\n onIconPropertyChange() {\n this.loadIcon();\n // Update aria-label when icon properties change\n this.setupInitialAriaLabel();\n }\n\n loadIcon() {\n // Reset load state when URL changes\n this.didLoadIcon = false;\n\n // Clear existing content to prevent stale content when switching icons\n this.svgContent = undefined;\n\n if (Build.isBrowser && this.isVisible) {\n const url = getUrl(this);\n if (url) {\n if (pdsIconContent.has(url)) {\n this.svgContent = pdsIconContent.get(url);\n } else {\n // Fix: Ensure promise callback triggers re-render and handle errors\n getSvgContent(url)\n .then(() => {\n // Force re-render by setting state in next tick\n setTimeout(() => {\n this.svgContent = pdsIconContent.get(url);\n }, 0);\n })\n .catch(() => {\n // Handle fetch errors gracefully\n this.svgContent = '';\n });\n }\n this.didLoadIcon = true;\n }\n }\n\n this.iconName = getName(this.name, this.icon);\n }\n\n render() {\n const { ariaLabel, flipRtl, iconName,inheritedAttributes } = this;\n const shouldIconAutoFlip = iconName\n ? shouldRtlFlipIcon(iconName, this.el) && flipRtl !== false\n : false;\n const shouldFlip = flipRtl || shouldIconAutoFlip;\n\n // Use inherited aria-label if provided, otherwise fall back to auto-generated one\n const finalAriaLabel = inheritedAttributes['aria-label'] || ariaLabel;\n\n return (\n\n <Host\n aria-label={finalAriaLabel !== undefined && !this.hasAriaHidden() ? finalAriaLabel : null }\n alt=\"\"\n role=\"img\"\n class={{\n ...createColorClasses(this.color),\n 'flip-rtl': shouldFlip,\n 'icon-rtl': shouldFlip && isRTL(this.el)\n }}\n {...inheritedAttributes}\n >\n {Build.isBrowser && this.svgContent ? (\n <div class=\"icon-inner\" innerHTML={this.svgContent}></div>\n ) : (\n <div class=\"icon-inner\"></div>\n )}\n </Host>\n )\n }\n\n /*****\n * Private Methods\n ****/\n\n private setupInitialAriaLabel() {\n // Only set aria-label during initial load if one isn't already provided\n if (!this.inheritedAttributes['aria-label']) {\n const iconName = getName(this.name, this.icon);\n if (iconName) {\n this.ariaLabel = iconName.replace(/\\-/g, ' ');\n }\n }\n }\n\n private waitUntilVisible(el: HTMLElement, rootMargin: string, cb: () => void) {\n if (Build.isBrowser && typeof window !== 'undefined' && (window).IntersectionObserver) {\n const io = (this.io = new (window).IntersectionObserver(\n (data: IntersectionObserverEntry[]) => {\n if (data[0].isIntersecting) {\n io.disconnect();\n this.io = undefined;\n cb();\n }\n },\n { rootMargin },\n ));\n\n io.observe(el);\n\n // Safety timeout for client-side navigation scenarios\n // Sometimes IntersectionObserver doesn't fire during React navigation\n setTimeout(() => {\n if (this.io && !this.isVisible) {\n // Check if element is actually visible in viewport\n if (this.isElementInViewport(el)) {\n this.io.disconnect();\n this.io = undefined;\n cb();\n }\n }\n }, 1000);\n } else {\n // browser doesn't support IntersectionObserver\n // so just fallback to always show it\n cb();\n }\n }\n\n private isElementInViewport(el: HTMLElement): boolean {\n if (!el || !el.isConnected) return false;\n\n const rect = el.getBoundingClientRect();\n const windowHeight = window.innerHeight || document.documentElement.clientHeight;\n const windowWidth = window.innerWidth || document.documentElement.clientWidth;\n\n return (\n rect.top >= 0 &&\n rect.left >= 0 &&\n rect.bottom <= windowHeight &&\n rect.right <= windowWidth\n ) || (\n // Also consider partially visible elements\n rect.top < windowHeight &&\n rect.bottom > 0 &&\n rect.left < windowWidth &&\n rect.right > 0\n );\n }\n\n private hasAriaHidden = () => {\n const { el } = this;\n\n return el.hasAttribute('aria-hidden') && el.getAttribute('aria-hidden') === 'true';\n }\n\n /**\n * Debug method to help diagnose loading issues\n * Call from browser console: document.querySelector('pds-icon').debugIconState()\n */\n debugIconState() {\n const url = getUrl(this);\n const rect = this.el.getBoundingClientRect();\n\n console.log('PdsIcon Debug State:', {\n name: this.name,\n src: this.src,\n icon: this.icon,\n iconName: this.iconName,\n url,\n isVisible: this.isVisible,\n didLoadIcon: this.didLoadIcon,\n hasSvgContent: !!this.svgContent,\n svgContentLength: this.svgContent?.length || 0,\n isInCache: url ? pdsIconContent.has(url) : false,\n cachedContent: url ? pdsIconContent.get(url) : null,\n element: this.el,\n // Client-side navigation specific debug info\n isConnected: this.el.isConnected,\n isInViewport: this.isElementInViewport(this.el),\n hasIntersectionObserver: !!this.io,\n boundingClientRect: rect,\n windowDimensions: {\n width: window.innerWidth || document.documentElement.clientWidth,\n height: window.innerHeight || document.documentElement.clientHeight\n }\n });\n }\n}\n\nconst createColorClasses = (color: string | undefined) => {\n return color\n ? {\n 'pds-color': true,\n [`pds-color-${color}`]: true,\n }\n : null;\n };\n"],"mappings":"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","ignoreList":[]}
|