@pure-ds/core 0.3.19 → 0.4.1

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.
@@ -1,10 +1,20 @@
1
1
  /**
2
+ * A tab panel used as a child of `<pds-tabstrip>`. Each panel becomes a tab
3
+ * with its button label derived from the `label` attribute.
4
+ *
2
5
  * @element pds-tabpanel
3
6
  *
4
- * @attr {string} label - Label for the tab button
7
+ * @attr {string} label - Label text displayed on the tab button
5
8
  * @attr {string} id - Unique identifier for the panel (auto-generated if not provided)
6
9
  *
7
- * @slot - Content of the tab panel
10
+ * @slot - Content displayed when this tab is active
11
+ *
12
+ * @example
13
+ * ```html
14
+ * <pds-tabpanel label="Settings">
15
+ * <p>Settings content here.</p>
16
+ * </pds-tabpanel>
17
+ * ```
8
18
  */
9
19
  declare class TabPanel extends HTMLElement {
10
20
  connectedCallback(): void;
@@ -16,18 +26,39 @@ declare class TabPanel extends HTMLElement {
16
26
  get section(): HTMLElement | null;
17
27
  }
18
28
  /**
19
- * Tab navigation component that pairs anchors with `pds-tabpanel` children.
29
+ * Tab navigation component that displays content in switchable panels.
30
+ *
31
+ * Use `<pds-tabpanel>` children with a `label` attribute to define each tab.
32
+ * The component auto-generates navigation buttons and handles URL hash synchronization.
20
33
  *
21
34
  * @element pds-tabstrip
35
+ *
22
36
  * @fires tabchange - Fired when the active tab changes. Detail: `{ oldTab: string|null, newTab: string }`
23
37
  *
24
- * @attr {string} label - Accessible label announced for the tablist
38
+ * @attr {string} label - Accessible label announced for the tablist (default: "Tabs")
25
39
  * @attr {string} selected - Identifier of the currently active panel (synced with the location hash)
26
40
  *
27
- * @slot - Collection of `pds-tabpanel` nodes representing individual tab panels
41
+ * @slot - One or more `<pds-tabpanel>` elements, each with a `label` attribute
28
42
  *
29
43
  * @csspart tabs - Navigation container comprising the clickable tab buttons
30
44
  * @cssprop --color-accent-400 - Color of the active tab indicator underline
45
+ *
46
+ * @example
47
+ * ```html
48
+ * <pds-tabstrip label="Account settings">
49
+ * <pds-tabpanel label="General">
50
+ * <p>General settings content here.</p>
51
+ * </pds-tabpanel>
52
+ *
53
+ * <pds-tabpanel label="Security">
54
+ * <p>Security settings content here.</p>
55
+ * </pds-tabpanel>
56
+ *
57
+ * <pds-tabpanel label="Notifications">
58
+ * <p>Notification preferences here.</p>
59
+ * </pds-tabpanel>
60
+ * </pds-tabstrip>
61
+ * ```
31
62
  */
32
63
  declare class TabStrip extends HTMLElement {
33
64
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"pds-tabstrip.d.ts","sourceRoot":"","sources":["../../../../../../public/assets/pds/components/pds-tabstrip.js"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH;IACE,0BAiBC;IAFG,sBAAuB;IAG3B;;;OAGG;IACH,eAFa,WAAW,GAAC,IAAI,CAI5B;CACF;AAGD;;;;;;;;;;;;;GAaG;AACH;IAoCE;;OAEG;IACH,0BAmCC;;CA4HF"}
1
+ {"version":3,"file":"pds-tabstrip.d.ts","sourceRoot":"","sources":["../../../../../../public/assets/pds/components/pds-tabstrip.js"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH;IACE,0BAiBC;IAFG,sBAAuB;IAG3B;;;OAGG;IACH,eAFa,WAAW,GAAC,IAAI,CAI5B;CACF;AAGD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH;IAoCE;;OAEG;IACH,0BAmCC;;CA4HF"}
@@ -1 +1 @@
1
- {"version":3,"file":"pds-enhancers.d.ts","sourceRoot":"","sources":["../../../../../src/js/pds-core/pds-enhancers.js"],"names":[],"mappings":"AA+VA;;;;;IAGI;AAEJ;;;;IAA2D;AAlW3D,kDAiFC"}
1
+ {"version":3,"file":"pds-enhancers.d.ts","sourceRoot":"","sources":["../../../../../src/js/pds-core/pds-enhancers.js"],"names":[],"mappings":"AA6VA;;;;;IAGI;AAEJ;;;;IAA2D;AAhW3D,kDAiFC"}
@@ -1 +1 @@
1
- {"version":3,"file":"pds-generator.d.ts","sourceRoot":"","sources":["../../../../../src/js/pds-core/pds-generator.js"],"names":[],"mappings":"AAmmKA;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,4CAjBW,UAAU,qBACV,aAAa,EAAE,GACb,OAAO,CAAC,IAAI,CAAC,CAqCzB;AAED;;;;;;;;GAQG;AACH,wCALW,UAAU,WACV,MAAM,EAAE,qBACR,aAAa,EAAE,GACb,OAAO,CAAC,IAAI,CAAC,CAmDzB;AAED;;;;;;GAMG;AACH,sCAHW,MAAM,GACJ,aAAa,CAMzB;AArtKD;;;GAGG;AACH;IAEE,mCAAiB;IAEjB,2BAEC;IAy/JD;;;;OAIG;IACH,+BAFW,SAAS,QAgCnB;IAED;;;;OAIG;IACH,gDA6CC;IAzkKD,0BA6CC;IA5CC;;MAIC;IAaD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAAmC;IA6BrC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAgBC;IAycD;;;;OAIG;IACH,kDAyBC;IA0ED;;;;;;;;;;;;;;;;;;;;;;;;;;;;MA6DC;IAw4GD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAEC;IAGD,oBAEC;IAkrBD,qBAEC;IACD,yBAEC;IACD,yBAEC;IACD,wBAEC;IACD,yBAMC;IAED;;;;;;OAMG;IACH,oBA6JC;IAGD,4BAEC;IACD,gCAEC;IACD,gCAEC;IACD,+BAEC;IAmBD;;;OAGG;IACH;;;;;;MAoBC;;CA2GF"}
1
+ {"version":3,"file":"pds-generator.d.ts","sourceRoot":"","sources":["../../../../../src/js/pds-core/pds-generator.js"],"names":[],"mappings":"AA+qKA;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,4CAjBW,UAAU,qBACV,aAAa,EAAE,GACb,OAAO,CAAC,IAAI,CAAC,CAqCzB;AAED;;;;;;;;GAQG;AACH,wCALW,UAAU,WACV,MAAM,EAAE,qBACR,aAAa,EAAE,GACb,OAAO,CAAC,IAAI,CAAC,CAmDzB;AAED;;;;;;GAMG;AACH,sCAHW,MAAM,GACJ,aAAa,CAMzB;AAjyKD;;;GAGG;AACH;IAEE,mCAAiB;IAEjB,2BAEC;IAqkKD;;;;OAIG;IACH,+BAFW,SAAS,QAgCnB;IAED;;;;OAIG;IACH,gDA6CC;IArpKD,0BA6CC;IA5CC;;MAIC;IAaD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAAmC;IA6BrC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAgBC;IAycD;;;;OAIG;IACH,kDAyBC;IA0ED;;;;;;;;;;;;;;;;;;;;;;;;;;;;MA6DC;IAw7GD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAEC;IAGD,oBAEC;IA8sBD,qBAEC;IACD,yBAEC;IACD,yBAEC;IACD,wBAEC;IACD,yBAMC;IAED;;;;;;OAMG;IACH,oBA6JC;IAGD,4BAEC;IACD,gCAEC;IACD,gCAEC;IACD,+BAEC;IAmBD;;;OAGG;IACH;;;;;;MAoBC;;CA2GF"}
@@ -1,39 +1,212 @@
1
- export function findComponentForElement(startEl: any, { maxDepth }?: {
2
- maxDepth?: number;
3
- }): {
4
- element: any;
5
- componentType: string;
6
- displayName: any;
7
- };
8
- export function getAllSelectors(): any[];
1
+ /**
2
+ * Find component for an element using the ontology
3
+ * @param {HTMLElement} startEl - Starting element to search from
4
+ * @param {Object} options - Search options
5
+ * @param {number} options.maxDepth - Maximum depth to traverse (default: 5)
6
+ * @returns {Object|null} Component info or null
7
+ */
8
+ export function findComponentForElement(startEl: HTMLElement, { maxDepth }?: {
9
+ maxDepth: number;
10
+ }): any | null;
11
+ /**
12
+ * Get all CSS selectors from the ontology
13
+ * @returns {string[]} Array of all selectors
14
+ */
15
+ export function getAllSelectors(): string[];
16
+ /**
17
+ * Search the ontology by tag, name, or category
18
+ * @param {string} query - Search term
19
+ * @param {Object} options - Search options
20
+ * @returns {Object[]} Matching items
21
+ */
22
+ export function searchOntology(query: string, options?: any): any[];
23
+ /**
24
+ * Get items by category
25
+ * @param {string} category - Category name
26
+ * @returns {Object} Items grouped by type
27
+ */
28
+ export function getByCategory(category: string): any;
29
+ /**
30
+ * Get all available tags
31
+ * @returns {string[]} Sorted unique tags
32
+ */
33
+ export function getAllTags(): string[];
9
34
  export namespace ontology {
10
35
  namespace meta {
11
36
  let name: string;
12
37
  let version: string;
38
+ let description: string;
13
39
  }
14
40
  namespace tokens {
15
- let colors: string[];
16
- let spacing: string[];
17
- let typography: string[];
41
+ namespace colors {
42
+ let semantic: string[];
43
+ let neutral: string[];
44
+ let shades: number[];
45
+ let surface: string[];
46
+ let text: string[];
47
+ }
48
+ namespace spacing {
49
+ export let scale: string[];
50
+ let semantic_1: string[];
51
+ export { semantic_1 as semantic };
52
+ }
53
+ namespace typography {
54
+ let families: string[];
55
+ let sizes: string[];
56
+ let weights: string[];
57
+ }
58
+ namespace radius {
59
+ let scale_1: string[];
60
+ export { scale_1 as scale };
61
+ }
62
+ namespace shadows {
63
+ let scale_2: string[];
64
+ export { scale_2 as scale };
65
+ }
18
66
  let themes: string[];
67
+ namespace breakpoints {
68
+ let sm: number;
69
+ let md: number;
70
+ let lg: number;
71
+ let xl: number;
72
+ }
19
73
  }
20
74
  let primitives: {
21
75
  id: string;
22
76
  name: string;
77
+ description: string;
23
78
  selectors: string[];
79
+ tags: string[];
80
+ category: string;
24
81
  }[];
25
82
  let components: {
26
83
  id: string;
27
84
  name: string;
85
+ description: string;
28
86
  selectors: string[];
87
+ tags: string[];
88
+ category: string;
29
89
  }[];
30
90
  let layoutPatterns: {
31
91
  id: string;
32
92
  name: string;
93
+ description: string;
33
94
  selectors: string[];
95
+ tags: string[];
96
+ category: string;
97
+ }[];
98
+ namespace utilities {
99
+ export namespace text_1 {
100
+ let alignment: string[];
101
+ let color: string[];
102
+ let overflow: string[];
103
+ }
104
+ export { text_1 as text };
105
+ export namespace backdrop {
106
+ let base: string[];
107
+ let variants: string[];
108
+ let blur: string[];
109
+ }
110
+ export namespace shadow {
111
+ let scale_3: string[];
112
+ export { scale_3 as scale };
113
+ }
114
+ export namespace border {
115
+ let gradient: string[];
116
+ let glow: string[];
117
+ let combined: string[];
118
+ }
119
+ export namespace media {
120
+ let image: string[];
121
+ let video: string[];
122
+ let figure: string[];
123
+ }
124
+ export namespace effects {
125
+ let glass: string[];
126
+ }
127
+ }
128
+ namespace responsive {
129
+ export let prefixes: string[];
130
+ export namespace utilities_1 {
131
+ export let grid: string[];
132
+ export let flex: string[];
133
+ let text_2: string[];
134
+ export { text_2 as text };
135
+ let spacing_1: string[];
136
+ export { spacing_1 as spacing };
137
+ export let width: string[];
138
+ export let display: string[];
139
+ }
140
+ export { utilities_1 as utilities };
141
+ }
142
+ let enhancements: {
143
+ id: string;
144
+ selector: string;
34
145
  description: string;
146
+ tags: string[];
35
147
  }[];
36
- let utilities: string[];
148
+ namespace categories {
149
+ export namespace feedback {
150
+ let description_1: string;
151
+ export { description_1 as description };
152
+ let primitives_1: string[];
153
+ export { primitives_1 as primitives };
154
+ let components_1: string[];
155
+ export { components_1 as components };
156
+ }
157
+ export namespace form {
158
+ let description_2: string;
159
+ export { description_2 as description };
160
+ let primitives_2: string[];
161
+ export { primitives_2 as primitives };
162
+ let components_2: string[];
163
+ export { components_2 as components };
164
+ }
165
+ export namespace layout {
166
+ let description_3: string;
167
+ export { description_3 as description };
168
+ export let patterns: string[];
169
+ let components_3: string[];
170
+ export { components_3 as components };
171
+ }
172
+ export namespace navigation {
173
+ let description_4: string;
174
+ export { description_4 as description };
175
+ let primitives_3: string[];
176
+ export { primitives_3 as primitives };
177
+ let components_4: string[];
178
+ export { components_4 as components };
179
+ }
180
+ export namespace media_1 {
181
+ let description_5: string;
182
+ export { description_5 as description };
183
+ let primitives_4: string[];
184
+ export { primitives_4 as primitives };
185
+ let components_5: string[];
186
+ export { components_5 as components };
187
+ }
188
+ export { media_1 as media };
189
+ export namespace overlay {
190
+ let description_6: string;
191
+ export { description_6 as description };
192
+ let primitives_5: string[];
193
+ export { primitives_5 as primitives };
194
+ let components_6: string[];
195
+ export { components_6 as components };
196
+ }
197
+ export namespace data {
198
+ let description_7: string;
199
+ export { description_7 as description };
200
+ let primitives_6: string[];
201
+ export { primitives_6 as primitives };
202
+ }
203
+ export namespace theming {
204
+ let description_8: string;
205
+ export { description_8 as description };
206
+ let primitives_7: string[];
207
+ export { primitives_7 as primitives };
208
+ }
209
+ }
37
210
  namespace styles {
38
211
  let typography_1: string[];
39
212
  export { typography_1 as typography };
@@ -42,6 +215,7 @@ export namespace ontology {
42
215
  let sets: string[];
43
216
  }
44
217
  export let interactive: string[];
218
+ export let states: string[];
45
219
  }
46
220
  }
47
221
  export default ontology;
@@ -1 +1 @@
1
- {"version":3,"file":"pds-ontology.d.ts","sourceRoot":"","sources":["../../../../../src/js/pds-core/pds-ontology.js"],"names":[],"mappings":"AA8FA;;;;;;EAwJC;AAED,yCAKC"}
1
+ {"version":3,"file":"pds-ontology.d.ts","sourceRoot":"","sources":["../../../../../src/js/pds-core/pds-ontology.js"],"names":[],"mappings":"AAqiBA;;;;;;GAMG;AACH,iDALW,WAAW,iBAEnB;IAAwB,QAAQ,EAAxB,MAAM;CACd,GAAU,MAAO,IAAI,CAmKvB;AAED;;;GAGG;AACH,mCAFa,MAAM,EAAE,CAQpB;AAED;;;;;GAKG;AACH,sCAJW,MAAM,kBAEJ,KAAQ,CAoCpB;AAED;;;;GAIG;AACH,wCAHW,MAAM,OAUhB;AAED;;;GAGG;AACH,8BAFa,MAAM,EAAE,CAWpB"}
@@ -1 +1 @@
1
- {"version":3,"file":"pds-query.d.ts","sourceRoot":"","sources":["../../../../../src/js/pds-core/pds-query.js"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH;IACE,sBAoCC;IAnCC,SAAc;IAGd;;;;;;;;;;;;MAYC;IAGD;;;;;;;;;;;;;MAaC;IAGD,wBAAqG;IAGvG;;;;OAIG;IACH,cAHW,MAAM,GACJ,OAAO,OAAO,CA0D1B;IAED;;OAEG;IACH,yBAKC;IAED;;OAEG;IACH;;;;;;;MAkCC;IAED;;OAEG;IACH,6CA0FC;IAED;;OAEG;IACH,gDAiEC;IAED;;OAEG;IACH,iDAyDC;IAED;;OAEG;IACH,+CA8CC;IAED;;OAEG;IACH,iDAiCC;IAED;;OAEG;IACH,8CAwBC;IAED;;OAEG;IACH,4CAsBC;IAED;;OAEG;IACH,iDAcC;IAED;;OAEG;IACH,wVAWC;CACF"}
1
+ {"version":3,"file":"pds-query.d.ts","sourceRoot":"","sources":["../../../../../src/js/pds-core/pds-query.js"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH;IACE,sBAoCC;IAnCC,SAAc;IAGd;;;;;;;;;;;;MAYC;IAGD;;;;;;;;;;;;;MAaC;IAGD,wBAAqG;IAGvG;;;;OAIG;IACH,cAHW,MAAM,GACJ,OAAO,OAAO,CA0D1B;IAED;;OAEG;IACH,yBAKC;IAED;;OAEG;IACH;;;;;;;MAkCC;IAED;;OAEG;IACH,6CA0FC;IAED;;OAEG;IACH,gDA4EC;IAED;;OAEG;IACH,iDAyDC;IAED;;OAEG;IACH,+CA8CC;IAED;;OAEG;IACH,iDAiCC;IAED;;OAEG;IACH,8CAwBC;IAED;;OAEG;IACH,4CAsBC;IAED;;OAEG;IACH,iDAcC;IAED;;OAEG;IACH,wVAWC;CACF"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@pure-ds/core",
3
3
  "shortname": "pds",
4
- "version": "0.3.19",
4
+ "version": "0.4.1",
5
5
  "description": "Pure Design System - Why develop a Design System when you can generate one?",
6
6
  "repository": {
7
7
  "type": "git",