@tylertech/forge-core 2.4.0-dev.2 → 3.0.0-next.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 (140) hide show
  1. package/README.md +11 -14
  2. package/{esm → dist}/a11y/a11y.js +1 -0
  3. package/dist/a11y/a11y.js.map +1 -0
  4. package/dist/a11y/index.js +2 -0
  5. package/dist/a11y/index.js.map +1 -0
  6. package/{esm → dist}/constants/date-constants.js +2 -1
  7. package/dist/constants/date-constants.js.map +1 -0
  8. package/{esm → dist}/constants/index.js +1 -0
  9. package/dist/constants/index.js.map +1 -0
  10. package/{typings → dist}/custom-elements/component-utils.d.ts +16 -11
  11. package/{esm → dist}/custom-elements/component-utils.js +72 -41
  12. package/dist/custom-elements/component-utils.js.map +1 -0
  13. package/dist/custom-elements/constants.d.ts +6 -0
  14. package/dist/custom-elements/constants.js +10 -0
  15. package/dist/custom-elements/constants.js.map +1 -0
  16. package/dist/custom-elements/decorators/core-property.d.ts +27 -0
  17. package/{esm/custom-elements/decorators/foundation-property.js → dist/custom-elements/decorators/core-property.js} +39 -34
  18. package/dist/custom-elements/decorators/core-property.js.map +1 -0
  19. package/{typings → dist}/custom-elements/decorators/custom-element.d.ts +9 -4
  20. package/{esm → dist}/custom-elements/decorators/custom-element.js +6 -8
  21. package/dist/custom-elements/decorators/custom-element.js.map +1 -0
  22. package/dist/custom-elements/decorators/index.d.ts +2 -0
  23. package/dist/custom-elements/decorators/index.js +3 -0
  24. package/dist/custom-elements/decorators/index.js.map +1 -0
  25. package/{typings → dist}/custom-elements/index.d.ts +3 -1
  26. package/{esm → dist}/custom-elements/index.js +2 -0
  27. package/dist/custom-elements/index.js.map +1 -0
  28. package/{esm → dist}/events/event-aware.js +1 -0
  29. package/dist/events/event-aware.js.map +1 -0
  30. package/dist/events/index.js +2 -0
  31. package/dist/events/index.js.map +1 -0
  32. package/{esm → dist}/index.js +1 -0
  33. package/dist/index.js.map +1 -0
  34. package/{esm → dist}/media-observer/index.js +1 -0
  35. package/dist/media-observer/index.js.map +1 -0
  36. package/{esm → dist}/media-observer/media-observer-utils.js +1 -0
  37. package/dist/media-observer/media-observer-utils.js.map +1 -0
  38. package/{esm → dist}/media-observer/media-observer.js +31 -38
  39. package/dist/media-observer/media-observer.js.map +1 -0
  40. package/{typings → dist}/media-observer/types.d.ts +26 -26
  41. package/{esm → dist}/media-observer/types.js +1 -0
  42. package/dist/media-observer/types.js.map +1 -0
  43. package/{esm → dist}/message-list/index.js +1 -0
  44. package/dist/message-list/index.js.map +1 -0
  45. package/{esm → dist}/message-list/message-list-entry.js +1 -0
  46. package/dist/message-list/message-list-entry.js.map +1 -0
  47. package/{esm → dist}/message-list/message-list.js +6 -5
  48. package/dist/message-list/message-list.js.map +1 -0
  49. package/{esm → dist}/observable/index.js +1 -0
  50. package/dist/observable/index.js.map +1 -0
  51. package/{esm → dist}/observable/observable.js +10 -10
  52. package/dist/observable/observable.js.map +1 -0
  53. package/dist/observable/types.d.ts +1 -0
  54. package/dist/observable/types.js +2 -0
  55. package/dist/observable/types.js.map +1 -0
  56. package/{esm → dist}/resize/index.js +1 -0
  57. package/dist/resize/index.js.map +1 -0
  58. package/{esm → dist}/resize/resize-observer.js +5 -7
  59. package/dist/resize/resize-observer.js.map +1 -0
  60. package/{typings → dist}/resize/resize-types.d.ts +1 -1
  61. package/dist/resize/resize-types.js +2 -0
  62. package/dist/resize/resize-types.js.map +1 -0
  63. package/{esm → dist}/scroll/index.js +1 -0
  64. package/dist/scroll/index.js.map +1 -0
  65. package/{esm → dist}/scroll/scroll-axis-observer.js +1 -0
  66. package/dist/scroll/scroll-axis-observer.js.map +1 -0
  67. package/{esm → dist}/scroll/scroll-types.js +1 -0
  68. package/dist/scroll/scroll-types.js.map +1 -0
  69. package/{esm → dist}/services/index.js +1 -0
  70. package/dist/services/index.js.map +1 -0
  71. package/{esm → dist}/services/service-adapter.js +1 -0
  72. package/dist/services/service-adapter.js.map +1 -0
  73. package/{esm → dist}/utils/a11y.js +1 -0
  74. package/dist/utils/a11y.js.map +1 -0
  75. package/{esm → dist}/utils/clipboard.js +2 -2
  76. package/dist/utils/clipboard.js.map +1 -0
  77. package/{esm → dist}/utils/dom-utils.js +2 -1
  78. package/dist/utils/dom-utils.js.map +1 -0
  79. package/{esm → dist}/utils/event-utils.js +1 -0
  80. package/dist/utils/event-utils.js.map +1 -0
  81. package/{esm → dist}/utils/http-utils.js +1 -0
  82. package/dist/utils/http-utils.js.map +1 -0
  83. package/{typings → dist}/utils/index.d.ts +0 -1
  84. package/{esm → dist}/utils/index.js +1 -1
  85. package/dist/utils/index.js.map +1 -0
  86. package/{esm → dist}/utils/item-manager.js +1 -0
  87. package/dist/utils/item-manager.js.map +1 -0
  88. package/{typings → dist}/utils/object-utils.d.ts +17 -0
  89. package/{esm → dist}/utils/object-utils.js +52 -0
  90. package/dist/utils/object-utils.js.map +1 -0
  91. package/{esm → dist}/utils/platform.js +1 -0
  92. package/dist/utils/platform.js.map +1 -0
  93. package/{esm → dist}/utils/string-utils.js +1 -0
  94. package/dist/utils/string-utils.js.map +1 -0
  95. package/{typings → dist}/utils/utils.d.ts +1 -1
  96. package/{esm → dist}/utils/utils.js +2 -1
  97. package/dist/utils/utils.js.map +1 -0
  98. package/package.json +52 -10
  99. package/esm/a11y/index.js +0 -1
  100. package/esm/custom-elements/decorators/index.js +0 -2
  101. package/esm/events/index.js +0 -1
  102. package/esm/observable/types.js +0 -1
  103. package/esm/resize/resize-types.js +0 -1
  104. package/esm/utils/position-utils.js +0 -62
  105. package/esm/utils/top-layer-middleware.js +0 -43
  106. package/typings/custom-elements/decorators/foundation-property.d.ts +0 -20
  107. package/typings/custom-elements/decorators/index.d.ts +0 -2
  108. package/typings/observable/types.d.ts +0 -1
  109. package/typings/utils/position-utils.d.ts +0 -58
  110. package/typings/utils/top-layer-middleware.d.ts +0 -2
  111. /package/{typings → dist}/a11y/a11y.d.ts +0 -0
  112. /package/{typings → dist}/a11y/index.d.ts +0 -0
  113. /package/{typings → dist}/constants/date-constants.d.ts +0 -0
  114. /package/{typings → dist}/constants/index.d.ts +0 -0
  115. /package/{typings → dist}/events/event-aware.d.ts +0 -0
  116. /package/{typings → dist}/events/index.d.ts +0 -0
  117. /package/{typings → dist}/index.d.ts +0 -0
  118. /package/{typings → dist}/media-observer/index.d.ts +0 -0
  119. /package/{typings → dist}/media-observer/media-observer-utils.d.ts +0 -0
  120. /package/{typings → dist}/media-observer/media-observer.d.ts +0 -0
  121. /package/{typings → dist}/message-list/index.d.ts +0 -0
  122. /package/{typings → dist}/message-list/message-list-entry.d.ts +0 -0
  123. /package/{typings → dist}/message-list/message-list.d.ts +0 -0
  124. /package/{typings → dist}/observable/index.d.ts +0 -0
  125. /package/{typings → dist}/observable/observable.d.ts +0 -0
  126. /package/{typings → dist}/resize/index.d.ts +0 -0
  127. /package/{typings → dist}/resize/resize-observer.d.ts +0 -0
  128. /package/{typings → dist}/scroll/index.d.ts +0 -0
  129. /package/{typings → dist}/scroll/scroll-axis-observer.d.ts +0 -0
  130. /package/{typings → dist}/scroll/scroll-types.d.ts +0 -0
  131. /package/{typings → dist}/services/index.d.ts +0 -0
  132. /package/{typings → dist}/services/service-adapter.d.ts +0 -0
  133. /package/{typings → dist}/utils/a11y.d.ts +0 -0
  134. /package/{typings → dist}/utils/clipboard.d.ts +0 -0
  135. /package/{typings → dist}/utils/dom-utils.d.ts +0 -0
  136. /package/{typings → dist}/utils/event-utils.d.ts +0 -0
  137. /package/{typings → dist}/utils/http-utils.d.ts +0 -0
  138. /package/{typings → dist}/utils/item-manager.d.ts +0 -0
  139. /package/{typings → dist}/utils/platform.d.ts +0 -0
  140. /package/{typings → dist}/utils/string-utils.d.ts +0 -0
package/README.md CHANGED
@@ -1,32 +1,29 @@
1
- # Forge Core
1
+ # Tyler Forge Core
2
2
 
3
- This library contains the core building blocks and utilities that are used when building Forge Web Components.
4
-
5
- This package is intended to be used directly with projects built using the Forge CLI, but there are many useful
6
- generic utilities that can be used directly within any web application.
3
+ This library contains the core building blocks and utilities that are used when building Tyler Forge based Web Component libraries.
7
4
 
8
5
  ## Usage
9
6
 
10
- ```shell
11
- $ npm install @tylertech/forge-core
7
+ ```bash
8
+ npm i @tylertech/forge-core
12
9
  ```
13
10
 
14
11
  ## Development
15
12
 
16
13
  Install dependencies:
17
14
 
18
- ```shell
19
- $ npm install
15
+ ```bash
16
+ npm i
20
17
  ```
21
18
 
22
- Build npm package:
19
+ Build library:
23
20
 
24
- ```shell
25
- $ npm run build
21
+ ```bash
22
+ npm run build
26
23
  ```
27
24
 
28
25
  Run tests:
29
26
 
30
- ```shell
31
- $ npm test
27
+ ```bash
28
+ npm test
32
29
  ```
@@ -15,3 +15,4 @@ export function hideElementVisually(element) {
15
15
  element.style.setProperty('-webkit-appearance', 'none');
16
16
  element.style.setProperty('-moz-appearance', 'none');
17
17
  }
18
+ //# sourceMappingURL=a11y.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"a11y.js","sourceRoot":"","sources":["../../src/a11y/a11y.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,MAAM,UAAU,mBAAmB,CAAC,OAAoB;IACtD,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,CAAC;IAC3B,OAAO,CAAC,KAAK,CAAC,IAAI,GAAG,eAAe,CAAC;IACrC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC;IAC7B,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;IAC9B,OAAO,CAAC,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAC;IAClC,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG,CAAC;IAC5B,OAAO,CAAC,KAAK,CAAC,QAAQ,GAAG,UAAU,CAAC;IACpC,OAAO,CAAC,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC;IAC5B,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG,CAAC;IAC5B,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC,oBAAoB,EAAE,MAAM,CAAC,CAAC;IACxD,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC,iBAAiB,EAAE,MAAM,CAAC,CAAC;AACvD,CAAC"}
@@ -0,0 +1,2 @@
1
+ export * from './a11y';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/a11y/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC"}
@@ -11,7 +11,7 @@ const daysLong = [
11
11
  'Sunday',
12
12
  'Monday',
13
13
  'Tuesday',
14
- 'Wedensday',
14
+ 'Wednesday',
15
15
  'Thursday',
16
16
  'Friday',
17
17
  'Saturday'
@@ -50,3 +50,4 @@ export const DATE_CONSTANTS = {
50
50
  months,
51
51
  monthsLong
52
52
  };
53
+ //# sourceMappingURL=date-constants.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"date-constants.js","sourceRoot":"","sources":["../../src/constants/date-constants.ts"],"names":[],"mappings":"AAAA,MAAM,IAAI,GAAG;IACX,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI;CACL,CAAC;AAEF,MAAM,QAAQ,GAAG;IACf,QAAQ;IACR,QAAQ;IACR,SAAS;IACT,WAAW;IACX,UAAU;IACV,QAAQ;IACR,UAAU;CACX,CAAC;AAEF,MAAM,MAAM,GAAG;IACb,KAAK;IACL,KAAK;IACL,KAAK;IACL,KAAK;IACL,KAAK;IACL,KAAK;IACL,KAAK;IACL,KAAK;IACL,KAAK;IACL,KAAK;IACL,KAAK;IACL,KAAK;CACN,CAAC;AAEF,MAAM,UAAU,GAAG;IACjB,SAAS;IACT,UAAU;IACV,OAAO;IACP,OAAO;IACP,KAAK;IACL,MAAM;IACN,MAAM;IACN,QAAQ;IACR,WAAW;IACX,SAAS;IACT,UAAU;IACV,UAAU;CACX,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG;IAC5B,IAAI;IACJ,QAAQ;IACR,MAAM;IACN,UAAU;CACX,CAAC"}
@@ -1 +1,2 @@
1
1
  export * from './date-constants';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/constants/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC"}
@@ -46,7 +46,7 @@ export declare function attachLightTemplate<T extends HTMLElement>(componentInst
46
46
  * @param {string} elementName The name of the element the shadow root is to be attached to.
47
47
  * @param {string} template The shadow root template HTML string.
48
48
  * @param {string | string[]} styles The shadow root styles string to be encapsulated by this shadow root.
49
- * @param {boolean} [delegatesFocus=false] Should the component delagate focus.
49
+ * @param {boolean} [delegatesFocus=false] Should the component delegate focus.
50
50
  */
51
51
  export declare function attachShadowTemplate<T extends HTMLElement>(componentInstance: T, template: string, styles?: string | string[], delegatesFocus?: boolean): void;
52
52
  /**
@@ -71,13 +71,22 @@ export declare function prepareShadowTemplate(template: string, styles?: string
71
71
  */
72
72
  export declare function setShadowTemplate<T extends HTMLElement>(componentInstance: T, templateElement: HTMLTemplateElement): void;
73
73
  /**
74
- * Copies style rules from the provided document stylesheets collection to the provided shadow root stylesheet.
75
- * @param {Document} fromDocument The document to find the style sheets in.
76
- * @param {ShadowRoot} shadowRoot The shadow root that contains the stylesheet to copy the rules to.
77
- * @param {IStyleSheetDescriptor[]} styleSheetDescriptors A collection of style sheet predicates.
78
- * @param {CSSStyleSheet} shadowStyleSheet The shadow root stylesheet to copy the style rules to.
74
+ * Applies styles to the shadow root of the provided element instance.
75
+ * @param {T} componentInstance A component instance.
76
+ * @param {string | string[]} styles The styles to be applied to the shadow root.
77
+ * @param options Options for setting the styles.
78
+ */
79
+ export declare function setShadowStyles<T extends HTMLElement>(componentInstance: T, styles: string | string[], { force }?: {
80
+ force: boolean;
81
+ }): void;
82
+ /**
83
+ * Reapplies styles to the shadow root of the provided element instance. This function was
84
+ * intended to be called after an element has been adopted by a new document to reconstruct the
85
+ * adopted stylesheet instances within the context of the new document.
86
+ *
87
+ * @param componentInstance The component instance to reapply styles to.
79
88
  */
80
- export declare function provideDocumentStyles(fromDocument: Document, shadowRoot: ShadowRoot, documentStyleSheets: Array<string | IStyleSheetDescriptor>, shadowStyleSheet: CSSStyleSheet): void;
89
+ export declare function readoptStyles<T extends HTMLElement>(componentInstance: T): void;
81
90
  /**
82
91
  * Gets an HTML element using a query selector from the provided components` shadow root.
83
92
  * @param {HTMLElement} componentInstance The component instance that contains a shadow root.
@@ -119,7 +128,3 @@ export declare function getClosestShadowRoot(node: Node): ShadowRoot | null;
119
128
  * @param startElement The element to start finding from.
120
129
  */
121
130
  export declare function closestElement(selector: string, startElement: Element): Element | null;
122
- export interface IStyleSheetDescriptor {
123
- name: string;
124
- selectorFilter?: string;
125
- }
@@ -1,12 +1,13 @@
1
1
  import { replaceElement, isArray, removeAllChildren, walkUpUntil } from '../utils';
2
+ import { CUSTOM_ELEMENT_CSS_PROPERTY, CUSTOM_ELEMENT_DEPENDENCIES_PROPERTY, CUSTOM_ELEMENT_NAME_PROPERTY, CUSTOM_ELEMENT_STYLESHEETS_PROPERTY, supportsConstructableStyleSheets } from './constants';
2
3
  /**
3
4
  * Recursively defines a component as a custom elements and all of its dependencies.
4
5
  * @param component The component to import.
5
6
  */
6
7
  export function defineCustomElement(component) {
7
- tryDefine(component._customElementName, component);
8
- if (isArray(component._customElementDependencies)) {
9
- defineCustomElements(component._customElementDependencies);
8
+ tryDefine(component[CUSTOM_ELEMENT_NAME_PROPERTY], component);
9
+ if (isArray(component[CUSTOM_ELEMENT_DEPENDENCIES_PROPERTY])) {
10
+ defineCustomElements(component[CUSTOM_ELEMENT_DEPENDENCIES_PROPERTY]);
10
11
  }
11
12
  }
12
13
  /**
@@ -22,8 +23,7 @@ export function defineCustomElements(components) {
22
23
  * @param ctor The custom element constructor.
23
24
  */
24
25
  export function tryDefine(name, ctor, options) {
25
- var _a;
26
- if ((_a = window === null || window === void 0 ? void 0 : window.customElements) === null || _a === void 0 ? void 0 : _a.get(name)) {
26
+ if (window?.customElements?.get(name)) {
27
27
  return;
28
28
  }
29
29
  window.customElements.define(name, ctor, options);
@@ -83,11 +83,14 @@ export function attachLightTemplate(componentInstance, template) {
83
83
  * @param {string} elementName The name of the element the shadow root is to be attached to.
84
84
  * @param {string} template The shadow root template HTML string.
85
85
  * @param {string | string[]} styles The shadow root styles string to be encapsulated by this shadow root.
86
- * @param {boolean} [delegatesFocus=false] Should the component delagate focus.
86
+ * @param {boolean} [delegatesFocus=false] Should the component delegate focus.
87
87
  */
88
88
  export function attachShadowTemplate(componentInstance, template, styles, delegatesFocus = false) {
89
- const templateElement = prepareShadowTemplate(template, styles);
89
+ const templateElement = prepareShadowTemplate(template);
90
90
  componentInstance.attachShadow({ mode: 'open', delegatesFocus });
91
+ if (styles) {
92
+ setShadowStyles(componentInstance, styles);
93
+ }
91
94
  setShadowTemplate(componentInstance, templateElement);
92
95
  }
93
96
  /**
@@ -101,10 +104,13 @@ export function replaceShadowTemplate(componentInstance, template, styles) {
101
104
  if (!componentInstance.shadowRoot) {
102
105
  throw new Error('This element does not contain a shadow root. Did you mean to call `attachShadowTemplate`?');
103
106
  }
104
- const templateElement = prepareShadowTemplate(template, styles);
107
+ const templateElement = prepareShadowTemplate(template);
105
108
  if (componentInstance.shadowRoot.children.length) {
106
109
  removeAllChildren(componentInstance.shadowRoot);
107
110
  }
111
+ if (styles) {
112
+ setShadowStyles(componentInstance, styles, { force: true });
113
+ }
108
114
  setShadowTemplate(componentInstance, templateElement);
109
115
  }
110
116
  /**
@@ -115,10 +121,16 @@ export function replaceShadowTemplate(componentInstance, template, styles) {
115
121
  */
116
122
  export function prepareShadowTemplate(template, styles) {
117
123
  const templateElement = parseTemplateString(template);
124
+ // Deprecated in favor of `setShadowStyles()`, leaving for backwards compatibility
125
+ // TODO: remove this in next major version, and remove `styles` argument above
118
126
  if (styles) {
119
127
  styles = styles instanceof Array ? styles : [styles];
120
128
  const styleElement = document.createElement('style');
121
- styleElement.type = 'text/css';
129
+ // eslint-disable-next-line @typescript-eslint/dot-notation
130
+ const nonce = window['forgeNonce'];
131
+ if (nonce) {
132
+ styleElement.setAttribute('nonce', nonce);
133
+ }
122
134
  styleElement.textContent = styles.join(' ');
123
135
  templateElement.content.appendChild(styleElement);
124
136
  }
@@ -133,47 +145,65 @@ export function setShadowTemplate(componentInstance, templateElement) {
133
145
  componentInstance.shadowRoot.appendChild(templateElement.content.cloneNode(true));
134
146
  }
135
147
  /**
136
- * Copies style rules from the provided document stylesheets collection to the provided shadow root stylesheet.
137
- * @param {Document} fromDocument The document to find the style sheets in.
138
- * @param {ShadowRoot} shadowRoot The shadow root that contains the stylesheet to copy the rules to.
139
- * @param {IStyleSheetDescriptor[]} styleSheetDescriptors A collection of style sheet predicates.
140
- * @param {CSSStyleSheet} shadowStyleSheet The shadow root stylesheet to copy the style rules to.
148
+ * Applies styles to the shadow root of the provided element instance.
149
+ * @param {T} componentInstance A component instance.
150
+ * @param {string | string[]} styles The styles to be applied to the shadow root.
151
+ * @param options Options for setting the styles.
141
152
  */
142
- export function provideDocumentStyles(fromDocument, shadowRoot, documentStyleSheets, shadowStyleSheet) {
143
- if (!shadowStyleSheet) {
153
+ export function setShadowStyles(componentInstance, styles, { force } = { force: false }) {
154
+ const ctor = componentInstance.constructor;
155
+ if (!componentInstance.shadowRoot || !styles) {
156
+ if (supportsConstructableStyleSheets) {
157
+ if (ctor[CUSTOM_ELEMENT_STYLESHEETS_PROPERTY]) {
158
+ ctor[CUSTOM_ELEMENT_STYLESHEETS_PROPERTY] = [];
159
+ }
160
+ if (componentInstance.shadowRoot) {
161
+ componentInstance.shadowRoot.adoptedStyleSheets = [];
162
+ }
163
+ }
144
164
  return;
145
165
  }
146
- const documentSheets = [];
147
- documentStyleSheets.forEach(sheet => {
148
- const sheetName = typeof sheet === 'string' ? sheet : sheet.name;
149
- const sheetFilter = sheet.selectorFilter;
150
- const matchingStyleSheet = _findMatchingStyleSheet(fromDocument.styleSheets, sheetName);
151
- if (!matchingStyleSheet) {
152
- throw new Error(`Could not find stylesheet: ${sheetName}`);
166
+ styles = styles instanceof Array ? styles : [styles];
167
+ if (supportsConstructableStyleSheets) {
168
+ if (force || !ctor[CUSTOM_ELEMENT_STYLESHEETS_PROPERTY]) {
169
+ const context = componentInstance.ownerDocument.defaultView ?? window;
170
+ const sheet = new context.CSSStyleSheet();
171
+ const cssText = styles.join(' ');
172
+ sheet.replaceSync(cssText);
173
+ ctor[CUSTOM_ELEMENT_CSS_PROPERTY] = cssText;
174
+ ctor[CUSTOM_ELEMENT_STYLESHEETS_PROPERTY] = [sheet];
153
175
  }
154
- let startIndex = shadowStyleSheet.cssRules.length;
155
- for (const rule in matchingStyleSheet.cssRules) {
156
- if (matchingStyleSheet.cssRules.hasOwnProperty(rule) && matchingStyleSheet.cssRules[rule].cssText && (!sheetFilter || new RegExp(sheetFilter).test(matchingStyleSheet.cssRules[rule].selectorText))) {
157
- shadowStyleSheet.insertRule(matchingStyleSheet.cssRules[rule].cssText, startIndex++);
158
- }
176
+ componentInstance.shadowRoot.adoptedStyleSheets = ctor[CUSTOM_ELEMENT_STYLESHEETS_PROPERTY];
177
+ }
178
+ else {
179
+ const styleElement = document.createElement('style');
180
+ // eslint-disable-next-line @typescript-eslint/dot-notation
181
+ const nonce = window['forgeNonce'];
182
+ if (nonce) {
183
+ styleElement.setAttribute('nonce', nonce);
159
184
  }
160
- });
185
+ styleElement.textContent = styles.join(' ');
186
+ componentInstance.shadowRoot.appendChild(styleElement);
187
+ }
161
188
  }
162
189
  /**
163
- * Finds a stylesheet by name in the provided stylesheet list.
164
- * @param styleSheetList The stylesheet list to search.
165
- * @param sheetName The stylesheet name to find.
166
- * @returns {CSSStyleSheet | undefined}
190
+ * Reapplies styles to the shadow root of the provided element instance. This function was
191
+ * intended to be called after an element has been adopted by a new document to reconstruct the
192
+ * adopted stylesheet instances within the context of the new document.
193
+ *
194
+ * @param componentInstance The component instance to reapply styles to.
167
195
  */
168
- function _findMatchingStyleSheet(styleSheetList, sheetName) {
169
- for (const prop in styleSheetList) {
170
- if (styleSheetList.hasOwnProperty(prop) && styleSheetList[prop].href) {
171
- if (new RegExp(sheetName).test(styleSheetList[prop].href)) {
172
- return styleSheetList[prop];
173
- }
174
- }
196
+ export function readoptStyles(componentInstance) {
197
+ if (!supportsConstructableStyleSheets ||
198
+ !componentInstance.shadowRoot ||
199
+ !componentInstance.constructor[CUSTOM_ELEMENT_CSS_PROPERTY]) {
200
+ return;
175
201
  }
176
- return undefined;
202
+ const cssText = componentInstance.constructor[CUSTOM_ELEMENT_CSS_PROPERTY];
203
+ const context = componentInstance.ownerDocument.defaultView ?? window;
204
+ const sheet = new context.CSSStyleSheet();
205
+ sheet.replaceSync(cssText);
206
+ componentInstance.shadowRoot.adoptedStyleSheets = [sheet];
177
207
  }
178
208
  /**
179
209
  * Gets an HTML element using a query selector from the provided components` shadow root.
@@ -260,3 +290,4 @@ export function closestElement(selector, startElement) {
260
290
  }
261
291
  return __closestFrom(startElement);
262
292
  }
293
+ //# sourceMappingURL=component-utils.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"component-utils.js","sourceRoot":"","sources":["../../src/custom-elements/component-utils.ts"],"names":[],"mappings":"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"}
@@ -0,0 +1,6 @@
1
+ export declare const CUSTOM_ELEMENT_NAME_PROPERTY: unique symbol;
2
+ export declare const CUSTOM_ELEMENT_DEPENDENCIES_PROPERTY: unique symbol;
3
+ export declare const CUSTOM_ELEMENT_CSS_PROPERTY: unique symbol;
4
+ export declare const CUSTOM_ELEMENT_STYLESHEETS_PROPERTY: unique symbol;
5
+ /** Whether the browser supports constructable stylesheets */
6
+ export declare const supportsConstructableStyleSheets: boolean;
@@ -0,0 +1,10 @@
1
+ export const CUSTOM_ELEMENT_NAME_PROPERTY = Symbol('Forge custom element tag name');
2
+ export const CUSTOM_ELEMENT_DEPENDENCIES_PROPERTY = Symbol('Forge custom element dependencies');
3
+ export const CUSTOM_ELEMENT_CSS_PROPERTY = Symbol('Forge custom element CSS text');
4
+ export const CUSTOM_ELEMENT_STYLESHEETS_PROPERTY = Symbol('Forge custom element CSSStyleSheet instances');
5
+ /** Whether the browser supports constructable stylesheets */
6
+ export const supportsConstructableStyleSheets = window.__forgeFlags__useConstructableStyleSheets !== false &&
7
+ window.ShadowRoot &&
8
+ 'adoptedStyleSheets' in Document.prototype &&
9
+ 'replace' in CSSStyleSheet.prototype;
10
+ //# sourceMappingURL=constants.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"constants.js","sourceRoot":"","sources":["../../src/custom-elements/constants.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,4BAA4B,GAAG,MAAM,CAAC,+BAA+B,CAAC,CAAC;AACpF,MAAM,CAAC,MAAM,oCAAoC,GAAG,MAAM,CAAC,mCAAmC,CAAC,CAAC;AAEhG,MAAM,CAAC,MAAM,2BAA2B,GAAG,MAAM,CAAC,+BAA+B,CAAC,CAAC;AACnF,MAAM,CAAC,MAAM,mCAAmC,GAAG,MAAM,CAAC,8CAA8C,CAAC,CAAC;AAE1G,6DAA6D;AAC7D,MAAM,CAAC,MAAM,gCAAgC,GAAG,MAAM,CAAC,yCAAyC,KAAK,KAAK;IAC1D,MAAM,CAAC,UAAU;IACjB,oBAAoB,IAAI,QAAQ,CAAC,SAAS;IAC1C,SAAS,IAAI,aAAa,CAAC,SAAS,CAAC"}
@@ -0,0 +1,27 @@
1
+ export interface ICorePropertyOptions {
2
+ /**
3
+ * Allow Binding to a different naming convention in the core
4
+ * @example coreProperty({name: '_foo'}) foo;
5
+ */
6
+ name?: string;
7
+ /**
8
+ * When false, skips calling the core property setter
9
+ * @default true
10
+ * @example coreProperty({set: true}) foo;
11
+ */
12
+ set?: boolean;
13
+ /**
14
+ * When false, skips calling the core property getter
15
+ * @default true
16
+ * @example coreProperty({get: true}) foo;
17
+ */
18
+ get?: boolean;
19
+ }
20
+ /**
21
+ * This decorator is intended to be used on properties of a class that extends `HTMLElement` to dynamically
22
+ * create getters and setters that interact with the `_core` member of the class.
23
+ *
24
+ * @param options The core property options.
25
+ * @returns
26
+ */
27
+ export declare function coreProperty(options?: ICorePropertyOptions): any;
@@ -1,4 +1,4 @@
1
- class FoundationPropertyOptions {
1
+ class CorePropertyOptions {
2
2
  constructor(options) {
3
3
  this.get = true;
4
4
  this.set = true;
@@ -7,30 +7,36 @@ class FoundationPropertyOptions {
7
7
  }
8
8
  }
9
9
  }
10
- // eslint-disable-next-line @typescript-eslint/explicit-function-return-type
11
- const foundationPropertyNotFoundMessage = (className, propertyName) => `${className}\'s foundation does not contain the property \"${propertyName}\"`;
12
- // eslint-disable-next-line @typescript-eslint/explicit-function-return-type
13
- const foundationNotFoundMessage = (className) => `${className} does not have a foundation`;
10
+ const CORE_PROPERTY_NAME = '_core';
11
+ const corePropertyNotFoundMessage = (className, propertyName) => `${className}\'s core does not contain the property \"${propertyName}\"`;
12
+ const coreNotFoundMessage = (className) => `${className} does not have a core`;
14
13
  function runIfVerified(target, propertyName, action) {
15
- if (target._foundation) {
16
- if (propertyName in target._foundation) {
14
+ if (target[CORE_PROPERTY_NAME]) {
15
+ if (propertyName in target[CORE_PROPERTY_NAME]) {
17
16
  return action();
18
17
  }
19
18
  else {
20
- throw new Error(foundationPropertyNotFoundMessage(target.localName, propertyName));
19
+ throw new Error(corePropertyNotFoundMessage(target.localName, propertyName));
21
20
  }
22
21
  }
23
22
  else {
24
- throw new Error(foundationNotFoundMessage(target.localName));
23
+ throw new Error(coreNotFoundMessage(target.localName));
25
24
  }
26
25
  }
27
- export function FoundationProperty(options) {
28
- const allOptions = new FoundationPropertyOptions(options);
26
+ /**
27
+ * This decorator is intended to be used on properties of a class that extends `HTMLElement` to dynamically
28
+ * create getters and setters that interact with the `_core` member of the class.
29
+ *
30
+ * @param options The core property options.
31
+ * @returns
32
+ */
33
+ export function coreProperty(options) {
34
+ const allOptions = new CorePropertyOptions(options);
29
35
  return (target, name, descriptor) => {
30
36
  let defaultGet;
31
37
  let defaultSet;
32
38
  const propertyName = name;
33
- const foundationPropertyName = ((options && options.name) || name).toString();
39
+ const corePropertyName = ((options && options.name) || name).toString();
34
40
  if (descriptor) {
35
41
  defaultGet = descriptor.get;
36
42
  defaultSet = descriptor.set;
@@ -38,8 +44,8 @@ export function FoundationProperty(options) {
38
44
  descriptor.enumerable = true;
39
45
  if (allOptions.set) {
40
46
  descriptor.set = function (value) {
41
- return wireDescriptorSet(this, foundationPropertyName, attributes => {
42
- const desc = Object.getOwnPropertyDescriptor(target, foundationPropertyName);
47
+ return wireDescriptorSet(this, corePropertyName, attributes => {
48
+ const desc = Object.getOwnPropertyDescriptor(target, corePropertyName);
43
49
  desc.set = attributes.set;
44
50
  Reflect.defineProperty(target, propertyName, desc);
45
51
  attributes.set(value);
@@ -48,8 +54,8 @@ export function FoundationProperty(options) {
48
54
  }
49
55
  if (allOptions.get) {
50
56
  descriptor.get = function () {
51
- return wireDescriptorGet(this, foundationPropertyName, attributes => {
52
- const desc = Object.getOwnPropertyDescriptor(target, foundationPropertyName);
57
+ return wireDescriptorGet(this, corePropertyName, attributes => {
58
+ const desc = Object.getOwnPropertyDescriptor(target, corePropertyName);
53
59
  desc.get = attributes.get;
54
60
  Reflect.defineProperty(target, propertyName, desc);
55
61
  return attributes.get();
@@ -63,13 +69,12 @@ export function FoundationProperty(options) {
63
69
  const get = {
64
70
  get() {
65
71
  const that = this;
66
- return wireDescriptorGet(that, foundationPropertyName, attrs => {
72
+ return wireDescriptorGet(that, corePropertyName, attrs => {
67
73
  let setter;
68
- // We have to wire the setter here as well
69
74
  if (allOptions.set) {
70
- setter = Object.assign({}, set);
75
+ setter = { ...set };
71
76
  }
72
- Reflect.defineProperty(that, foundationPropertyName, Object.assign(Object.assign({ configurable: true, enumerable: true }, attrs), setter));
77
+ Reflect.defineProperty(that, corePropertyName, { configurable: true, enumerable: true, ...attrs, ...setter });
73
78
  return attrs.get();
74
79
  });
75
80
  }
@@ -77,35 +82,34 @@ export function FoundationProperty(options) {
77
82
  const set = {
78
83
  set(value) {
79
84
  const that = this;
80
- return wireDescriptorSet(that, foundationPropertyName, attrs => {
85
+ return wireDescriptorSet(that, corePropertyName, attrs => {
81
86
  let getter;
82
- // We have to wire the getter here as well
83
87
  if (allOptions.get) {
84
- getter = Object.assign({}, get);
88
+ getter = { ...get };
85
89
  }
86
- Reflect.defineProperty(that, foundationPropertyName, Object.assign(Object.assign({ configurable: true, enumerable: true }, attrs), getter));
90
+ Reflect.defineProperty(that, corePropertyName, { configurable: true, enumerable: true, ...attrs, ...getter });
87
91
  attrs.set(value);
88
92
  });
89
93
  }
90
94
  };
91
95
  if (allOptions.get) {
92
- Object.assign(attributes, Object.assign({}, get));
96
+ Object.assign(attributes, { ...get });
93
97
  }
94
98
  if (allOptions.set) {
95
- Object.assign(attributes, Object.assign({}, set));
99
+ Object.assign(attributes, { ...set });
96
100
  }
97
101
  Reflect.defineProperty(target, propertyName, attributes);
98
102
  }
99
103
  }
100
104
  };
101
105
  }
102
- function setFoundation(target, value, propertyName) {
106
+ function setCoreProperty(target, value, propertyName) {
103
107
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
104
- target._foundation[propertyName] = value;
108
+ target[CORE_PROPERTY_NAME][propertyName] = value;
105
109
  }
106
- function getFoundation(target, propertyName) {
110
+ function getCoreProperty(target, propertyName) {
107
111
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
108
- return target._foundation[propertyName];
112
+ return target[CORE_PROPERTY_NAME][propertyName];
109
113
  }
110
114
  function wireDescriptorSet(target, propertyName, wireAction, defaultSet) {
111
115
  let attributes;
@@ -113,14 +117,14 @@ function wireDescriptorSet(target, propertyName, wireAction, defaultSet) {
113
117
  attributes = {
114
118
  set(value) {
115
119
  defaultSet.call(target, value);
116
- setFoundation(target, value, propertyName);
120
+ setCoreProperty(target, value, propertyName);
117
121
  }
118
122
  };
119
123
  }
120
124
  else {
121
125
  attributes = {
122
126
  set(value) {
123
- setFoundation(target, value, propertyName);
127
+ setCoreProperty(target, value, propertyName);
124
128
  }
125
129
  };
126
130
  }
@@ -132,16 +136,17 @@ function wireDescriptorGet(target, propertyName, wireAction, defaultGet) {
132
136
  attributes = {
133
137
  get() {
134
138
  defaultGet.call(target);
135
- return getFoundation(target, propertyName);
139
+ return getCoreProperty(target, propertyName);
136
140
  }
137
141
  };
138
142
  }
139
143
  else {
140
144
  attributes = {
141
145
  get() {
142
- return getFoundation(target, propertyName);
146
+ return getCoreProperty(target, propertyName);
143
147
  }
144
148
  };
145
149
  }
146
150
  return runIfVerified(target, propertyName, () => wireAction(attributes));
147
151
  }
152
+ //# sourceMappingURL=core-property.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"core-property.js","sourceRoot":"","sources":["../../../src/custom-elements/decorators/core-property.ts"],"names":[],"mappings":"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"}
@@ -1,6 +1,13 @@
1
1
  declare global {
2
2
  interface Window {
3
- __forgeFlags__autoDefine: any;
3
+ __forgeFlags__autoDefine: boolean | undefined;
4
+ __forgeFlags__useConstructableStyleSheets: boolean | undefined;
5
+ }
6
+ interface ShadowRoot {
7
+ adoptedStyleSheets: CSSStyleSheet[];
8
+ }
9
+ interface CSSStyleSheet {
10
+ replaceSync(cssText: string): void;
4
11
  }
5
12
  }
6
13
  export interface ICustomElementConfig {
@@ -11,11 +18,9 @@ export interface ICustomElementConfig {
11
18
  /** Configures if the element will be automatically defined in the custom element registry. Default is `true` */
12
19
  define?: boolean;
13
20
  }
14
- export declare const CUSTOM_ELEMENT_NAME_PROPERTY = "_customElementName";
15
- export declare const CUSTOM_ELEMENT_DEPENDENCIES_PROPERTY = "_customElementDependencies";
16
21
  /**
17
22
  * This decorator is intended to be used on classes that extend `HTMLElement` to
18
23
  * extend/modify the behavior of a custom element.
19
24
  * @param {ICustomElementConfig} [config={}] The custom element configuration.
20
25
  */
21
- export declare function CustomElement({ name, dependencies, define }: ICustomElementConfig): any;
26
+ export declare function customElement({ name, dependencies, define }: ICustomElementConfig): any;