@redvars/peacock 3.0.0 → 3.1.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.
Files changed (120) hide show
  1. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/LoaderUtils.d.ts +23 -0
  2. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/LoaderUtils.js +81 -0
  3. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/LoaderUtils.js.map +1 -0
  4. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/avatar/avatar.css.d.ts +1 -0
  5. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/avatar/avatar.css.js +41 -0
  6. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/avatar/avatar.css.js.map +1 -0
  7. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/avatar/avatar.d.ts +14 -0
  8. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/avatar/avatar.js +44 -0
  9. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/avatar/avatar.js.map +1 -0
  10. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/avatar/index.d.ts +1 -0
  11. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/avatar/index.js +2 -0
  12. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/avatar/index.js.map +1 -0
  13. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/icon/datasource.d.ts +2 -0
  14. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/icon/datasource.js +20 -0
  15. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/icon/datasource.js.map +1 -0
  16. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/icon/icon.css.d.ts +1 -0
  17. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/icon/icon.css.js +22 -0
  18. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/icon/icon.css.js.map +1 -0
  19. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/icon/icon.d.ts +26 -0
  20. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/icon/icon.js +119 -0
  21. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/icon/icon.js.map +1 -0
  22. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/icon/index.d.ts +1 -0
  23. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/icon/index.js +2 -0
  24. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/icon/index.js.map +1 -0
  25. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/icon/p-icon.d.ts +3 -0
  26. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/icon/p-icon.js +10 -0
  27. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/icon/p-icon.js.map +1 -0
  28. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/index.d.ts +2 -0
  29. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/index.js +3 -0
  30. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/index.js.map +1 -0
  31. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/peacock-loader.d.ts +1 -0
  32. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/peacock-loader.js +16 -0
  33. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/peacock-loader.js.map +1 -0
  34. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/utils.d.ts +3 -0
  35. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/utils.js +101 -0
  36. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/src/utils.js.map +1 -0
  37. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/test/icon.test.d.ts +1 -0
  38. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/test/icon.test.js +14 -0
  39. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/test/icon.test.js.map +1 -0
  40. package/.rollup.cache/E/git/redvars/peacock/components/dist/components/tsconfig.tsbuildinfo +1 -0
  41. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/LoaderUtils.d.ts +23 -0
  42. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/LoaderUtils.js +81 -0
  43. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/LoaderUtils.js.map +1 -0
  44. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/avatar/avatar.css.d.ts +1 -0
  45. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/avatar/avatar.css.js +41 -0
  46. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/avatar/avatar.css.js.map +1 -0
  47. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/avatar/avatar.d.ts +14 -0
  48. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/avatar/avatar.js +44 -0
  49. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/avatar/avatar.js.map +1 -0
  50. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/avatar/index.d.ts +1 -0
  51. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/avatar/index.js +2 -0
  52. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/avatar/index.js.map +1 -0
  53. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/datasource.d.ts +2 -0
  54. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/datasource.js +20 -0
  55. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/datasource.js.map +1 -0
  56. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/icon.css.d.ts +1 -0
  57. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/icon.css.js +22 -0
  58. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/icon.css.js.map +1 -0
  59. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/icon.d.ts +26 -0
  60. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/icon.js +119 -0
  61. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/icon.js.map +1 -0
  62. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/index.d.ts +1 -0
  63. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/index.js +2 -0
  64. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/index.js.map +1 -0
  65. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/p-icon.d.ts +3 -0
  66. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/p-icon.js +10 -0
  67. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/icon/p-icon.js.map +1 -0
  68. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/index.d.ts +2 -0
  69. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/index.js +3 -0
  70. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/index.js.map +1 -0
  71. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/peacock-loader.d.ts +1 -0
  72. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/peacock-loader.js +16 -0
  73. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/peacock-loader.js.map +1 -0
  74. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/utils.d.ts +3 -0
  75. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/utils.js +101 -0
  76. package/.rollup.cache/E/git/redvars/peacock/components/dist/src/utils.js.map +1 -0
  77. package/.rollup.cache/E/git/redvars/peacock/components/dist/test/icon.test.d.ts +1 -0
  78. package/.rollup.cache/E/git/redvars/peacock/components/dist/test/icon.test.js +14 -0
  79. package/.rollup.cache/E/git/redvars/peacock/components/dist/test/icon.test.js.map +1 -0
  80. package/.rollup.cache/E/git/redvars/peacock/components/dist/tsconfig.tsbuildinfo +1 -0
  81. package/custom-elements.md +16 -0
  82. package/demo/index.html +6 -1
  83. package/demo/int.html +29 -0
  84. package/dist/assets/styles/tokens.css +515 -0
  85. package/dist/component/Icon.js +174 -0
  86. package/dist/component/Icon.js.map +1 -0
  87. package/dist/component/avatar.js +88 -0
  88. package/dist/component/avatar.js.map +1 -0
  89. package/dist/icon-1wpxQtrZ.js +341 -0
  90. package/dist/icon-1wpxQtrZ.js.map +1 -0
  91. package/dist/index.js +89 -0
  92. package/dist/index.js.map +1 -0
  93. package/dist/peacock-loader.js +97 -0
  94. package/dist/peacock-loader.js.map +1 -0
  95. package/dist/src/LoaderUtils.js.map +1 -1
  96. package/dist/src/avatar/avatar.js +6 -1
  97. package/dist/src/avatar/avatar.js.map +1 -1
  98. package/dist/src/avatar/index.d.ts +1 -0
  99. package/dist/src/avatar/index.js +2 -0
  100. package/dist/src/avatar/index.js.map +1 -0
  101. package/dist/src/icon/icon.js +6 -1
  102. package/dist/src/icon/icon.js.map +1 -1
  103. package/dist/src/icon/index.d.ts +1 -0
  104. package/dist/src/icon/index.js +2 -0
  105. package/dist/src/icon/index.js.map +1 -0
  106. package/dist/src/icon/p-icon.js +6 -1
  107. package/dist/src/icon/p-icon.js.map +1 -1
  108. package/dist/src/peacock-loader.js +1 -1
  109. package/dist/src/peacock-loader.js.map +1 -1
  110. package/dist/tsconfig.tsbuildinfo +1 -1
  111. package/dist/utils-CSwoJIcG.js +171 -0
  112. package/dist/utils-CSwoJIcG.js.map +1 -0
  113. package/package.json +13 -4
  114. package/rollup.config.js +35 -15
  115. package/src/LoaderUtils.ts +1 -0
  116. package/src/avatar/demo/index.html +2 -2
  117. package/src/avatar/index.ts +1 -0
  118. package/src/icon/index.ts +1 -0
  119. package/src/peacock-loader.ts +1 -1
  120. package/tsconfig.json +1 -1
@@ -0,0 +1,23 @@
1
+ interface ComponentConfig {
2
+ CustomElementClass?: any;
3
+ importPath?: string;
4
+ dependencies?: string[];
5
+ }
6
+ interface LoaderConfig {
7
+ prefix?: string;
8
+ components?: Record<string, ComponentConfig>;
9
+ }
10
+ export { LoaderConfig };
11
+ export declare class LoaderUtils {
12
+ private loaderConfig;
13
+ private _loaderConfig;
14
+ private _observer;
15
+ constructor(loaderConfig: LoaderConfig);
16
+ static registerComponent(tagName: string, CustomElementClass: any): void;
17
+ start(): void;
18
+ eagerLoadComponents(): void;
19
+ getFullTagName(name: string): string;
20
+ registerAsync(tagName: string): Promise<void>;
21
+ load(root: Element | Document): Promise<void>;
22
+ lazyLoadComponents(root: any): void;
23
+ }
@@ -0,0 +1,81 @@
1
+ export class LoaderUtils {
2
+ constructor(loaderConfig) {
3
+ this.loaderConfig = loaderConfig;
4
+ this._loaderConfig = loaderConfig;
5
+ }
6
+ static registerComponent(tagName, CustomElementClass) {
7
+ if (CustomElementClass && !customElements.get(tagName)) {
8
+ customElements.define(tagName, CustomElementClass);
9
+ }
10
+ }
11
+ start() {
12
+ this.eagerLoadComponents();
13
+ this.lazyLoadComponents(document);
14
+ }
15
+ eagerLoadComponents() {
16
+ if (!this._loaderConfig.components)
17
+ return;
18
+ for (const [name, value] of Object.entries(this._loaderConfig.components)) {
19
+ if (value.CustomElementClass)
20
+ LoaderUtils.registerComponent(this.getFullTagName(name), value.CustomElementClass);
21
+ }
22
+ }
23
+ getFullTagName(name) {
24
+ return `${this._loaderConfig.prefix}-${name}`;
25
+ }
26
+ async registerAsync(tagName) {
27
+ if (customElements.get(tagName))
28
+ return;
29
+ const baseName = tagName.replace(`${this._loaderConfig.prefix}-`, '');
30
+ if (!this._loaderConfig.components)
31
+ return;
32
+ const config = this._loaderConfig.components[baseName];
33
+ if (!config || !config.importPath)
34
+ return;
35
+ try {
36
+ const module = await import(config.importPath);
37
+ // Runtime definition: grabbing the class from the module
38
+ const CustomElementClass = module.default || module[Object.keys(module)[0]];
39
+ if (CustomElementClass && !customElements.get(tagName)) {
40
+ customElements.define(tagName, CustomElementClass);
41
+ }
42
+ // Handle dependencies recursively
43
+ if (config.dependencies) {
44
+ for (const dep of config.dependencies) {
45
+ // eslint-disable-next-line no-await-in-loop
46
+ await this.registerAsync(this.getFullTagName(dep));
47
+ }
48
+ }
49
+ }
50
+ catch (error) {
51
+ console.error(`Unable to load <${tagName}> from ${config.importPath}`, error);
52
+ }
53
+ }
54
+ async load(root) {
55
+ const rootTagName = root instanceof Element ? root.tagName.toLowerCase() : '';
56
+ const tags = Array.from(root.querySelectorAll(':not(:defined)')).map(el => el.tagName.toLowerCase());
57
+ if (rootTagName.includes('-') && !customElements.get(rootTagName)) {
58
+ tags.push(rootTagName);
59
+ }
60
+ const tagsToRegister = [...new Set(tags)];
61
+ await Promise.allSettled(tagsToRegister.map(tagName => this.registerAsync(tagName)));
62
+ }
63
+ lazyLoadComponents(root) {
64
+ this._observer = new MutationObserver(mutations => {
65
+ for (const { addedNodes } of mutations) {
66
+ for (const node of addedNodes) {
67
+ if (node.nodeType === Node.ELEMENT_NODE) {
68
+ this.load(node);
69
+ }
70
+ }
71
+ }
72
+ });
73
+ const target = root instanceof Document ? root.documentElement : root;
74
+ this.load(target);
75
+ this._observer.observe(target, {
76
+ subtree: true,
77
+ childList: true,
78
+ });
79
+ }
80
+ }
81
+ //# sourceMappingURL=LoaderUtils.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"LoaderUtils.js","sourceRoot":"","sources":["../../../src/LoaderUtils.ts"],"names":[],"mappings":"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","sourcesContent":["interface ComponentConfig {\n CustomElementClass?: any; // earger load\n importPath?: string; // lazy load\n dependencies?: string[];\n}\n\ninterface LoaderConfig {\n prefix?: string;\n components?: Record<string, ComponentConfig>;\n}\n\nexport { LoaderConfig };\n\nexport class LoaderUtils {\n private _loaderConfig: LoaderConfig;\n private _observer: MutationObserver | undefined;\n\n constructor(private loaderConfig: LoaderConfig) {\n this._loaderConfig = loaderConfig;\n }\n\n static registerComponent(tagName: string, CustomElementClass: any) {\n if (CustomElementClass && !customElements.get(tagName)) {\n customElements.define(tagName, CustomElementClass);\n }\n }\n\n start() {\n this.eagerLoadComponents();\n this.lazyLoadComponents(document);\n }\n\n eagerLoadComponents() {\n if (!this._loaderConfig.components) return;\n for (const [name, value] of Object.entries(this._loaderConfig.components)) {\n if (value.CustomElementClass)\n LoaderUtils.registerComponent(\n this.getFullTagName(name),\n value.CustomElementClass,\n );\n }\n }\n\n getFullTagName(name: string) {\n return `${this._loaderConfig.prefix}-${name}`;\n }\n\n async registerAsync(tagName: string): Promise<void> {\n if (customElements.get(tagName)) return;\n\n const baseName = tagName.replace(`${this._loaderConfig.prefix}-`, '');\n\n if (!this._loaderConfig.components) return;\n\n const config = this._loaderConfig.components[baseName];\n if (!config || !config.importPath) return;\n\n try {\n const module = await import(config.importPath);\n\n // Runtime definition: grabbing the class from the module\n const CustomElementClass =\n module.default || module[Object.keys(module)[0]];\n\n if (CustomElementClass && !customElements.get(tagName)) {\n customElements.define(tagName, CustomElementClass);\n }\n\n // Handle dependencies recursively\n if (config.dependencies) {\n for (const dep of config.dependencies) {\n // eslint-disable-next-line no-await-in-loop\n await this.registerAsync(this.getFullTagName(dep));\n }\n }\n } catch (error) {\n console.error(\n `Unable to load <${tagName}> from ${config.importPath}`,\n error,\n );\n }\n }\n\n async load(root: Element | Document): Promise<void> {\n const rootTagName =\n root instanceof Element ? root.tagName.toLowerCase() : '';\n\n const tags = Array.from(root.querySelectorAll(':not(:defined)')).map(el =>\n el.tagName.toLowerCase(),\n );\n\n if (rootTagName.includes('-') && !customElements.get(rootTagName)) {\n tags.push(rootTagName);\n }\n\n const tagsToRegister = [...new Set(tags)];\n await Promise.allSettled(\n tagsToRegister.map(tagName => this.registerAsync(tagName)),\n );\n }\n\n lazyLoadComponents(root: any) {\n this._observer = new MutationObserver(mutations => {\n for (const { addedNodes } of mutations) {\n for (const node of addedNodes) {\n if (node.nodeType === Node.ELEMENT_NODE) {\n this.load(node as Element);\n }\n }\n }\n });\n\n const target = root instanceof Document ? root.documentElement : root;\n this.load(target);\n\n this._observer.observe(target, {\n subtree: true,\n childList: true,\n });\n }\n}\n"]}
@@ -0,0 +1 @@
1
+ export declare const styles: import("lit").CSSResult;
@@ -0,0 +1,41 @@
1
+ import { css, unsafeCSS } from 'lit';
2
+ import { getTypography } from '../utils.js';
3
+ export const styles = css `
4
+ :host {
5
+ display: inline-block;
6
+ pointer-events: none;
7
+ --avatar-size: 2rem;
8
+ --avatar-background-color: var(--color-primary);
9
+ --avatar-text-color: var(--color-on-primary);
10
+ --avatar-border-radius: var(--global-avatar-border-radius);
11
+ }
12
+
13
+ .avatar-container {
14
+ display: flex;
15
+ align-items: center;
16
+ gap: var(--spacing-050);
17
+ line-height: 0;
18
+ }
19
+
20
+ .avatar {
21
+ border-radius: var(--avatar-border-radius);
22
+ display: flex;
23
+ justify-content: center;
24
+ align-items: center;
25
+ color: var(--avatar-text-color);
26
+ width: var(--avatar-size);
27
+ height: var(--avatar-size);
28
+ ${unsafeCSS(getTypography('body-large-emphasized'))}
29
+ background-color: var(--avatar-background-color);
30
+
31
+ font-size: calc(var(--avatar-size) * 0.4);
32
+
33
+ .image {
34
+ width: 100%;
35
+ height: 100%;
36
+ overflow: hidden;
37
+ border-radius: inherit;
38
+ }
39
+ }
40
+ `;
41
+ //# sourceMappingURL=avatar.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"avatar.css.js","sourceRoot":"","sources":["../../../../src/avatar/avatar.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;MAyBnB,SAAS,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;;;;;;;;;;;;CAYtD,CAAC","sourcesContent":["import { css, unsafeCSS } from 'lit';\nimport { getTypography } from '../utils.js';\n\nexport const styles = css`\n :host {\n display: inline-block;\n pointer-events: none;\n --avatar-size: 2rem;\n --avatar-background-color: var(--color-primary);\n --avatar-text-color: var(--color-on-primary);\n --avatar-border-radius: var(--global-avatar-border-radius);\n }\n\n .avatar-container {\n display: flex;\n align-items: center;\n gap: var(--spacing-050);\n line-height: 0;\n }\n\n .avatar {\n border-radius: var(--avatar-border-radius);\n display: flex;\n justify-content: center;\n align-items: center;\n color: var(--avatar-text-color);\n width: var(--avatar-size);\n height: var(--avatar-size);\n ${unsafeCSS(getTypography('body-large-emphasized'))}\n background-color: var(--avatar-background-color);\n\n font-size: calc(var(--avatar-size) * 0.4);\n\n .image {\n width: 100%;\n height: 100%;\n overflow: hidden;\n border-radius: inherit;\n }\n }\n`;\n"]}
@@ -0,0 +1,14 @@
1
+ import { LitElement } from 'lit';
2
+ /**
3
+ * @summary Icons are visual symbols used to represent ideas, objects, or actions.
4
+ *
5
+ * @cssprop --icon-color - Controls the color of the icon.
6
+ * @cssprop --icon-size - Controls the size of the icon.
7
+ */
8
+ export declare class Avatar extends LitElement {
9
+ static styles: import("lit").CSSResult[];
10
+ name: string;
11
+ src?: string;
12
+ render(): import("lit-html").TemplateResult<1>;
13
+ private __getInitials;
14
+ }
@@ -0,0 +1,44 @@
1
+ import { __decorate } from "tslib";
2
+ import { html, LitElement } from 'lit';
3
+ import { property } from 'lit/decorators.js';
4
+ import { classMap } from 'lit/directives/class-map.js';
5
+ import { styles } from './avatar.css.js';
6
+ /**
7
+ * @summary Icons are visual symbols used to represent ideas, objects, or actions.
8
+ *
9
+ * @cssprop --icon-color - Controls the color of the icon.
10
+ * @cssprop --icon-size - Controls the size of the icon.
11
+ */
12
+ export class Avatar extends LitElement {
13
+ constructor() {
14
+ super(...arguments);
15
+ this.name = '';
16
+ }
17
+ render() {
18
+ return html `<div class="avatar-container">
19
+ <div
20
+ class=${classMap({
21
+ avatar: true,
22
+ initials: !this.src,
23
+ image: !!this.src,
24
+ })}
25
+ >
26
+ ${this.src
27
+ ? html `<img class="image" src=${this.src} alt=${this.name} />`
28
+ : html `<div class="initials">${this.__getInitials()}</div>`}
29
+ </div>
30
+ </div>`;
31
+ }
32
+ __getInitials() {
33
+ const [first = '', last = ''] = this.name.split(' ');
34
+ return `${first.charAt(0)}${last.charAt(0)}`.toUpperCase();
35
+ }
36
+ }
37
+ Avatar.styles = [styles];
38
+ __decorate([
39
+ property({ type: String, reflect: true })
40
+ ], Avatar.prototype, "name", void 0);
41
+ __decorate([
42
+ property({ type: String, reflect: true })
43
+ ], Avatar.prototype, "src", void 0);
44
+ //# sourceMappingURL=avatar.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"avatar.js","sourceRoot":"","sources":["../../../../src/avatar/avatar.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC;;;;;GAKG;AACH,MAAM,OAAO,MAAO,SAAQ,UAAU;IAAtC;;QAG6C,SAAI,GAAW,EAAE,CAAC;IAwB/D,CAAC;IApBC,MAAM;QACJ,OAAO,IAAI,CAAA;;gBAEC,QAAQ,CAAC;YACf,MAAM,EAAE,IAAI;YACZ,QAAQ,EAAE,CAAC,IAAI,CAAC,GAAG;YACnB,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG;SAClB,CAAC;;UAEA,IAAI,CAAC,GAAG;YACR,CAAC,CAAC,IAAI,CAAA,0BAA0B,IAAI,CAAC,GAAG,QAAQ,IAAI,CAAC,IAAI,KAAK;YAC9D,CAAC,CAAC,IAAI,CAAA,yBAAyB,IAAI,CAAC,aAAa,EAAE,QAAQ;;WAE1D,CAAC;IACV,CAAC;IAEO,aAAa;QACnB,MAAM,CAAC,KAAK,GAAG,EAAE,EAAE,IAAI,GAAG,EAAE,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACrD,OAAO,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,WAAW,EAAE,CAAC;IAC7D,CAAC;;AAzBM,aAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAEkB;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;oCAAmB;AAElB;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mCAAc","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './avatar.css.js';\n\n/**\n * @summary Icons are visual symbols used to represent ideas, objects, or actions.\n *\n * @cssprop --icon-color - Controls the color of the icon.\n * @cssprop --icon-size - Controls the size of the icon.\n */\nexport class Avatar extends LitElement {\n static styles = [styles];\n\n @property({ type: String, reflect: true }) name: string = '';\n\n @property({ type: String, reflect: true }) src?: string;\n\n render() {\n return html`<div class=\"avatar-container\">\n <div\n class=${classMap({\n avatar: true,\n initials: !this.src,\n image: !!this.src,\n })}\n >\n ${this.src\n ? html`<img class=\"image\" src=${this.src} alt=${this.name} />`\n : html`<div class=\"initials\">${this.__getInitials()}</div>`}\n </div>\n </div>`;\n }\n\n private __getInitials() {\n const [first = '', last = ''] = this.name.split(' ');\n return `${first.charAt(0)}${last.charAt(0)}`.toUpperCase();\n }\n}\n"]}
@@ -0,0 +1 @@
1
+ export { Avatar } from './avatar.js';
@@ -0,0 +1,2 @@
1
+ export { Avatar } from './avatar.js';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/avatar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC","sourcesContent":["export { Avatar } from './avatar.js';\n"]}
@@ -0,0 +1,2 @@
1
+ export declare function fetchSVG(url: string): Promise<string>;
2
+ export declare function fetchIcon(name: string, provider?: string): Promise<string>;
@@ -0,0 +1,20 @@
1
+ import { createCacheFetch } from '../utils.js';
2
+ const PROVIDERS = {
3
+ 'material-symbols': (name) => `https://cdn.jsdelivr.net/npm/@material-symbols/svg-500@0.40.1/outlined/${name}.svg`,
4
+ carbon: (name) => `https://cdn.jsdelivr.net/npm/@carbon/icons@11.41.0/svg/32/${name}.svg`,
5
+ };
6
+ const cacheFetch = await createCacheFetch('svg-cache');
7
+ export async function fetchSVG(url) {
8
+ if (!url)
9
+ return '';
10
+ return cacheFetch(url);
11
+ }
12
+ export async function fetchIcon(name, provider = 'material-symbols') {
13
+ if (!name)
14
+ return '';
15
+ if (!PROVIDERS[provider]) {
16
+ throw new Error(`Provider '${provider}' not found`);
17
+ }
18
+ return fetchSVG(PROVIDERS[provider](name));
19
+ }
20
+ //# sourceMappingURL=datasource.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"datasource.js","sourceRoot":"","sources":["../../../../src/icon/datasource.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,MAAM,SAAS,GAA6C;IAC1D,kBAAkB,EAAE,CAAC,IAAY,EAAE,EAAE,CACnC,0EAA0E,IAAI,MAAM;IACtF,MAAM,EAAE,CAAC,IAAY,EAAE,EAAE,CACvB,6DAA6D,IAAI,MAAM;CAC1E,CAAC;AAEF,MAAM,UAAU,GAAG,MAAM,gBAAgB,CAAC,WAAW,CAAC,CAAC;AAEvD,MAAM,CAAC,KAAK,UAAU,QAAQ,CAAC,GAAW;IACxC,IAAI,CAAC,GAAG;QAAE,OAAO,EAAE,CAAC;IACpB,OAAO,UAAU,CAAC,GAAG,CAAC,CAAC;AACzB,CAAC;AAED,MAAM,CAAC,KAAK,UAAU,SAAS,CAC7B,IAAY,EACZ,WAAmB,kBAAkB;IAErC,IAAI,CAAC,IAAI;QAAE,OAAO,EAAE,CAAC;IAErB,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,EAAE,CAAC;QACzB,MAAM,IAAI,KAAK,CAAC,aAAa,QAAQ,aAAa,CAAC,CAAC;IACtD,CAAC;IAED,OAAO,QAAQ,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;AAC7C,CAAC","sourcesContent":["import { createCacheFetch } from '../utils.js';\n\nconst PROVIDERS: Record<string, (name: string) => string> = {\n 'material-symbols': (name: string) =>\n `https://cdn.jsdelivr.net/npm/@material-symbols/svg-500@0.40.1/outlined/${name}.svg`,\n carbon: (name: string) =>\n `https://cdn.jsdelivr.net/npm/@carbon/icons@11.41.0/svg/32/${name}.svg`,\n};\n\nconst cacheFetch = await createCacheFetch('svg-cache');\n\nexport async function fetchSVG(url: string) {\n if (!url) return '';\n return cacheFetch(url);\n}\n\nexport async function fetchIcon(\n name: string,\n provider: string = 'material-symbols',\n) {\n if (!name) return '';\n\n if (!PROVIDERS[provider]) {\n throw new Error(`Provider '${provider}' not found`);\n }\n\n return fetchSVG(PROVIDERS[provider](name));\n}\n"]}
@@ -0,0 +1 @@
1
+ export declare const styles: import("lit").CSSResult;
@@ -0,0 +1,22 @@
1
+ import { css } from 'lit';
2
+ export const styles = css `
3
+ :host {
4
+ display: inline-block;
5
+ line-height: 0;
6
+ --icon-size: inherit;
7
+ --icon-color: inherit;
8
+ }
9
+
10
+ .icon {
11
+ display: inline-block;
12
+ height: var(--icon-size, 1rem);
13
+ width: var(--icon-size, 1rem);
14
+
15
+ svg {
16
+ fill: var(--icon-color);
17
+ height: 100%;
18
+ width: 100%;
19
+ }
20
+ }
21
+ `;
22
+ //# sourceMappingURL=icon.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"icon.css.js","sourceRoot":"","sources":["../../../../src/icon/icon.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;CAmBxB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`\n :host {\n display: inline-block;\n line-height: 0;\n --icon-size: inherit;\n --icon-color: inherit;\n }\n\n .icon {\n display: inline-block;\n height: var(--icon-size, 1rem);\n width: var(--icon-size, 1rem);\n\n svg {\n fill: var(--icon-color);\n height: 100%;\n width: 100%;\n }\n }\n`;\n"]}
@@ -0,0 +1,26 @@
1
+ import { LitElement } from 'lit';
2
+ /**
3
+ * @summary Icons are visual symbols used to represent ideas, objects, or actions.
4
+ *
5
+ * @cssprop --icon-color - Controls the color of the icon.
6
+ * @cssprop [--icon-size=1rem] - Controls the size of the icon. Defaults to "1rem"
7
+ */
8
+ export declare class Icon extends LitElement {
9
+ static styles: import("lit").CSSResult[];
10
+ name?: string;
11
+ src?: string;
12
+ provider?: 'material-symbols' | 'carbon';
13
+ private svgContent;
14
+ private loading;
15
+ private error;
16
+ private _fetchId;
17
+ private _debounceTimer;
18
+ firstUpdated(): void;
19
+ updated(changedProperties: any): void;
20
+ render(): import("lit-html").TemplateResult<1>;
21
+ private __scheduleUpdate;
22
+ /**
23
+ * @internal
24
+ */
25
+ private __updateSvg;
26
+ }
@@ -0,0 +1,119 @@
1
+ import { __decorate } from "tslib";
2
+ import { html, LitElement } from 'lit';
3
+ import { property, state } from 'lit/decorators.js';
4
+ import { unsafeSVG } from 'lit/directives/unsafe-svg.js';
5
+ import { fetchIcon, fetchSVG } from './datasource.js';
6
+ import { sanitizeSvg } from '../utils.js';
7
+ import { styles } from './icon.css.js';
8
+ /**
9
+ * @summary Icons are visual symbols used to represent ideas, objects, or actions.
10
+ *
11
+ * @cssprop --icon-color - Controls the color of the icon.
12
+ * @cssprop [--icon-size=1rem] - Controls the size of the icon. Defaults to "1rem"
13
+ */
14
+ export class Icon extends LitElement {
15
+ constructor() {
16
+ super(...arguments);
17
+ this.name = 'home';
18
+ this.provider = 'material-symbols';
19
+ this.svgContent = '';
20
+ // loading + error states for consumers/tests
21
+ this.loading = false;
22
+ this.error = null;
23
+ // token to avoid race conditions when multiple fetches overlap
24
+ this._fetchId = 0;
25
+ }
26
+ firstUpdated() {
27
+ // perform initial fetch once component is connected and rendered
28
+ this.__scheduleUpdate();
29
+ }
30
+ updated(changedProperties) {
31
+ // only refetch when name or src changed
32
+ if (changedProperties.has('name') || changedProperties.has('src')) {
33
+ this.__scheduleUpdate();
34
+ }
35
+ }
36
+ render() {
37
+ // accessible wrapper; consumers can provide a fallback via <slot name="fallback">.
38
+ return html ` <div class="icon">
39
+ ${this.svgContent
40
+ ? unsafeSVG(this.svgContent)
41
+ : html `<slot name="fallback"></slot>`}
42
+ </div>`;
43
+ }
44
+ // small debounce to coalesce rapid changes (50ms)
45
+ __scheduleUpdate() {
46
+ if (this._debounceTimer) {
47
+ clearTimeout(this._debounceTimer);
48
+ }
49
+ // @ts-ignore - setTimeout in DOM returns number
50
+ this._debounceTimer = window.setTimeout(() => this.__updateSvg(), 50);
51
+ }
52
+ /**
53
+ * @internal
54
+ */
55
+ async __updateSvg() {
56
+ this._fetchId += 1;
57
+ const currentId = this._fetchId;
58
+ this.loading = true;
59
+ this.error = null;
60
+ try {
61
+ let raw;
62
+ if (this.name) {
63
+ raw = await fetchIcon(this.name, this.provider);
64
+ }
65
+ else if (this.src) {
66
+ raw = await fetchSVG(this.src);
67
+ }
68
+ else {
69
+ raw = '';
70
+ }
71
+ // If another fetch started after this one, ignore this result
72
+ if (currentId !== this._fetchId)
73
+ return;
74
+ if (raw) {
75
+ this.svgContent = sanitizeSvg(raw);
76
+ }
77
+ else {
78
+ this.svgContent = '';
79
+ }
80
+ }
81
+ catch (err) {
82
+ // capture and surface error, but avoid throwing
83
+ this.error = err instanceof Error ? err : new Error(String(err));
84
+ this.svgContent = '';
85
+ // bubble an event so consumers can react
86
+ this.dispatchEvent(new CustomEvent('icon-error', {
87
+ detail: { name: this.name, src: this.src, error: this.error },
88
+ bubbles: true,
89
+ composed: true,
90
+ }));
91
+ }
92
+ finally {
93
+ // ensure loading is cleared unless another fetch started
94
+ if (currentId === this._fetchId) {
95
+ this.loading = false;
96
+ }
97
+ }
98
+ }
99
+ }
100
+ Icon.styles = [styles];
101
+ __decorate([
102
+ property({ type: String, reflect: true })
103
+ ], Icon.prototype, "name", void 0);
104
+ __decorate([
105
+ property({ type: String, reflect: true })
106
+ ], Icon.prototype, "src", void 0);
107
+ __decorate([
108
+ property({ type: String })
109
+ ], Icon.prototype, "provider", void 0);
110
+ __decorate([
111
+ state()
112
+ ], Icon.prototype, "svgContent", void 0);
113
+ __decorate([
114
+ state()
115
+ ], Icon.prototype, "loading", void 0);
116
+ __decorate([
117
+ state()
118
+ ], Icon.prototype, "error", void 0);
119
+ //# sourceMappingURL=icon.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"icon.js","sourceRoot":"","sources":["../../../../src/icon/icon.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { fetchIcon, fetchSVG } from './datasource.js';\nimport { sanitizeSvg } from '../utils.js';\nimport { styles } from './icon.css.js';\n\n/**\n * @summary Icons are visual symbols used to represent ideas, objects, or actions.\n *\n * @cssprop --icon-color - Controls the color of the icon.\n * @cssprop [--icon-size=1rem] - Controls the size of the icon. Defaults to \"1rem\"\n */\nexport class Icon extends LitElement {\n static styles = [styles];\n\n @property({ type: String, reflect: true }) name?: string = 'home';\n\n @property({ type: String, reflect: true }) src?: string;\n\n @property({ type: String }) provider?: 'material-symbols' | 'carbon' =\n 'material-symbols';\n\n @state()\n private svgContent: string = '';\n\n // loading + error states for consumers/tests\n @state()\n private loading: boolean = false;\n\n @state()\n private error: Error | null = null;\n\n // token to avoid race conditions when multiple fetches overlap\n private _fetchId = 0;\n\n // optional debounce for rapid property changes\n private _debounceTimer: number | undefined;\n\n firstUpdated() {\n // perform initial fetch once component is connected and rendered\n this.__scheduleUpdate();\n }\n\n updated(changedProperties: any) {\n // only refetch when name or src changed\n if (changedProperties.has('name') || changedProperties.has('src')) {\n this.__scheduleUpdate();\n }\n }\n\n render() {\n // accessible wrapper; consumers can provide a fallback via <slot name=\"fallback\">.\n return html` <div class=\"icon\">\n ${this.svgContent\n ? unsafeSVG(this.svgContent)\n : html`<slot name=\"fallback\"></slot>`}\n </div>`;\n }\n\n // small debounce to coalesce rapid changes (50ms)\n private __scheduleUpdate() {\n if (this._debounceTimer) {\n clearTimeout(this._debounceTimer as any);\n }\n // @ts-ignore - setTimeout in DOM returns number\n this._debounceTimer = window.setTimeout(() => this.__updateSvg(), 50);\n }\n\n /**\n * @internal\n */\n private async __updateSvg() {\n this._fetchId += 1;\n const currentId = this._fetchId;\n this.loading = true;\n this.error = null;\n\n try {\n let raw: string | undefined;\n\n if (this.name) {\n raw = await fetchIcon(this.name, this.provider);\n } else if (this.src) {\n raw = await fetchSVG(this.src);\n } else {\n raw = '';\n }\n\n // If another fetch started after this one, ignore this result\n if (currentId !== this._fetchId) return;\n\n if (raw) {\n this.svgContent = sanitizeSvg(raw);\n } else {\n this.svgContent = '';\n }\n } catch (err: any) {\n // capture and surface error, but avoid throwing\n this.error = err instanceof Error ? err : new Error(String(err));\n this.svgContent = '';\n // bubble an event so consumers can react\n this.dispatchEvent(\n new CustomEvent('icon-error', {\n detail: { name: this.name, src: this.src, error: this.error },\n bubbles: true,\n composed: true,\n }),\n );\n } finally {\n // ensure loading is cleared unless another fetch started\n if (currentId === this._fetchId) {\n this.loading = false;\n }\n }\n }\n}\n"]}
@@ -0,0 +1 @@
1
+ export { Icon } from './icon.js';
@@ -0,0 +1,2 @@
1
+ export { Icon } from './icon.js';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/icon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC","sourcesContent":["export { Icon } from './icon.js';\n"]}
@@ -0,0 +1,3 @@
1
+ import { Icon } from './icon.js';
2
+ export declare class IconComponent extends Icon {
3
+ }
@@ -0,0 +1,10 @@
1
+ import { __decorate } from "tslib";
2
+ import { customElement } from 'lit/decorators.js';
3
+ import { Icon } from './icon.js';
4
+ let IconComponent = class IconComponent extends Icon {
5
+ };
6
+ IconComponent = __decorate([
7
+ customElement('p-icon')
8
+ ], IconComponent);
9
+ export { IconComponent };
10
+ //# sourceMappingURL=p-icon.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"p-icon.js","sourceRoot":"","sources":["../../../../src/icon/p-icon.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAG1B,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,IAAI;CAAG,CAAA;AAA7B,aAAa;IADzB,aAAa,CAAC,QAAQ,CAAC;GACX,aAAa,CAAgB","sourcesContent":["import { customElement } from 'lit/decorators.js';\nimport { Icon } from './icon.js';\n\n@customElement('p-icon')\nexport class IconComponent extends Icon {}\n"]}
@@ -0,0 +1,2 @@
1
+ export { Icon } from './icon/icon.js';
2
+ export { Avatar } from './avatar/avatar.js';
@@ -0,0 +1,3 @@
1
+ export { Icon } from './icon/icon.js';
2
+ export { Avatar } from './avatar/avatar.js';
3
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC","sourcesContent":["export { Icon } from './icon/icon.js';\nexport { Avatar } from './avatar/avatar.js';\n"]}
@@ -0,0 +1,16 @@
1
+ // Eager loaded
2
+ import { Icon } from './icon/icon.js';
3
+ import { LoaderUtils } from './LoaderUtils.js';
4
+ const loaderConfig = {
5
+ prefix: 'p',
6
+ components: {
7
+ icon: {
8
+ CustomElementClass: Icon,
9
+ },
10
+ avatar: {
11
+ importPath: './avatar/avatar.js',
12
+ },
13
+ },
14
+ };
15
+ new LoaderUtils(loaderConfig).start();
16
+ //# sourceMappingURL=peacock-loader.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"peacock-loader.js","sourceRoot":"","sources":["../../../src/peacock-loader.ts"],"names":[],"mappings":"AAAA,eAAe;AACf,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AACtC,OAAO,EAAgB,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAE7D,MAAM,YAAY,GAAiB;IACjC,MAAM,EAAE,GAAG;IACX,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,kBAAkB,EAAE,IAAI;SACzB;QACD,MAAM,EAAE;YACN,UAAU,EAAE,oBAAoB;SACjC;KACF;CACF,CAAC;AAEF,IAAI,WAAW,CAAC,YAAY,CAAC,CAAC,KAAK,EAAE,CAAC","sourcesContent":["// Eager loaded\nimport { Icon } from './icon/icon.js';\nimport { LoaderConfig, LoaderUtils } from './LoaderUtils.js';\n\nconst loaderConfig: LoaderConfig = {\n prefix: 'p',\n components: {\n icon: {\n CustomElementClass: Icon,\n },\n avatar: {\n importPath: './avatar/avatar.js',\n },\n },\n};\n\nnew LoaderUtils(loaderConfig).start();\n"]}
@@ -0,0 +1,3 @@
1
+ export declare function createCacheFetch(name: string): Promise<(url: string) => Promise<string>>;
2
+ export declare function sanitizeSvg(rawSvg: string): string;
3
+ export declare const getTypography: (name: string) => string;