@spectric/ui 0.0.6 → 0.0.8

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 (110) hide show
  1. package/dist/components/Button.d.ts +8 -3
  2. package/dist/components/index.d.ts +2 -0
  3. package/dist/components/input.d.ts +3 -1
  4. package/dist/components/pagination/index.d.ts +1 -0
  5. package/dist/components/pagination/pagination.d.ts +60 -0
  6. package/dist/components/query_bar/QueryBar.d.ts +2 -3
  7. package/dist/components/table/body.d.ts +44 -0
  8. package/dist/components/table/cell.d.ts +53 -0
  9. package/dist/components/table/header.d.ts +42 -0
  10. package/dist/components/table/index.d.ts +1 -0
  11. package/dist/components/table/table.d.ts +90 -0
  12. package/dist/custom-elements.json +105 -6
  13. package/dist/index.es.js +1454 -1144
  14. package/dist/index.es.js.map +1 -1
  15. package/dist/index.umd.js +178 -72
  16. package/dist/index.umd.js.map +1 -1
  17. package/dist/style.css +1 -1
  18. package/package.json +2 -2
  19. package/src/components/Button.ts +12 -4
  20. package/src/components/button.css.ts +66 -0
  21. package/src/components/index.ts +3 -1
  22. package/src/components/input.ts +19 -2
  23. package/src/components/pagination/index.ts +1 -0
  24. package/src/components/pagination/pagination.css +10 -0
  25. package/src/components/pagination/pagination.ts +133 -0
  26. package/src/components/query_bar/QueryBar.ts +7 -21
  27. package/src/components/table/body.ts +69 -0
  28. package/src/components/table/cell.ts +117 -0
  29. package/src/components/table/header.ts +68 -0
  30. package/src/components/table/index.ts +1 -0
  31. package/src/components/table/table.css +36 -0
  32. package/src/components/table/table.ts +131 -0
  33. package/src/stories/Button.stories.ts +3 -2
  34. package/src/stories/QueryBar.stories.ts +7 -0
  35. package/src/stories/fixtures/data.ts +3 -0
  36. package/src/stories/pagination.stories.ts +63 -0
  37. package/src/stories/table.stories.ts +74 -0
  38. package/dist/assets/Banner-CZ3qKIQC.js +0 -172
  39. package/dist/assets/Banner.stories-BMf4MBpI.js +0 -19
  40. package/dist/assets/BitDisplay.stories-wztXxpxe.js +0 -18
  41. package/dist/assets/Bits-C_TSTjST.js +0 -1
  42. package/dist/assets/Button.stories-gHxjWwVf.js +0 -142
  43. package/dist/assets/Color-F6OSRLHC-AjFOL-zN.js +0 -1
  44. package/dist/assets/DocsRenderer-CFRXHY34-CvW79YxE.js +0 -761
  45. package/dist/assets/Header.stories-Bc09U6g1.js +0 -25
  46. package/dist/assets/Page.stories-DNJKhAFs.js +0 -114
  47. package/dist/assets/QueryBar.stories-Da5C-SV4.js +0 -17
  48. package/dist/assets/_commonjsHelpers-Cpj98o6Y.js +0 -1
  49. package/dist/assets/chunk-L4EGOTBX-AI5g0G5Z.js +0 -2
  50. package/dist/assets/data-CwENMT7L.js +0 -3
  51. package/dist/assets/dialog-CFHXbUTQ.js +0 -611
  52. package/dist/assets/directive-helpers-IbK5tOA8.js +0 -5
  53. package/dist/assets/entry-preview-Di-j0SPB.js +0 -4
  54. package/dist/assets/entry-preview-docs-CUBRpM7y.js +0 -1
  55. package/dist/assets/iframe-BQFuVTVZ.js +0 -2
  56. package/dist/assets/index-BCiKWbv6.js +0 -1
  57. package/dist/assets/index-BHYIh-Xd.js +0 -8
  58. package/dist/assets/index-DBGhiA-l.js +0 -1
  59. package/dist/assets/index-DrFu-skq.js +0 -6
  60. package/dist/assets/index-oFsFREWh.js +0 -9
  61. package/dist/assets/input.stories-Cgdv-5bN.js +0 -58
  62. package/dist/assets/lit-element-UdLzEcH-.js +0 -19
  63. package/dist/assets/preview-BWzBA1C2.js +0 -396
  64. package/dist/assets/preview-CGiTbRot.js +0 -2
  65. package/dist/assets/preview-D77C14du.js +0 -34
  66. package/dist/assets/preview-DEMzn_yN.js +0 -1
  67. package/dist/assets/preview-DFmD0pui.js +0 -1
  68. package/dist/assets/preview-DGUiP6tS.js +0 -7
  69. package/dist/assets/preview-DQVTHjv1.js +0 -182
  70. package/dist/assets/preview-aVwhiz9X.js +0 -1
  71. package/dist/assets/tiny-invariant-CopsF_GD.js +0 -1
  72. package/dist/components/input.css.d.ts +0 -2
  73. package/dist/favicon.svg +0 -1
  74. package/dist/iframe.html +0 -639
  75. package/dist/index.html +0 -190
  76. package/dist/index.json +0 -1
  77. package/dist/nunito-sans-bold-italic.woff2 +0 -0
  78. package/dist/nunito-sans-bold.woff2 +0 -0
  79. package/dist/nunito-sans-italic.woff2 +0 -0
  80. package/dist/nunito-sans-regular.woff2 +0 -0
  81. package/dist/project.json +0 -1
  82. package/dist/sb-addons/chromatic-com-storybook-8/manager-bundle.js +0 -333
  83. package/dist/sb-addons/chromatic-com-storybook-8/manager-bundle.js.LEGAL.txt +0 -40
  84. package/dist/sb-addons/essentials-actions-2/manager-bundle.js +0 -3
  85. package/dist/sb-addons/essentials-actions-2/manager-bundle.js.LEGAL.txt +0 -0
  86. package/dist/sb-addons/essentials-backgrounds-3/manager-bundle.js +0 -12
  87. package/dist/sb-addons/essentials-backgrounds-3/manager-bundle.js.LEGAL.txt +0 -0
  88. package/dist/sb-addons/essentials-controls-1/manager-bundle.js +0 -391
  89. package/dist/sb-addons/essentials-controls-1/manager-bundle.js.LEGAL.txt +0 -0
  90. package/dist/sb-addons/essentials-measure-6/manager-bundle.js +0 -3
  91. package/dist/sb-addons/essentials-measure-6/manager-bundle.js.LEGAL.txt +0 -0
  92. package/dist/sb-addons/essentials-outline-7/manager-bundle.js +0 -3
  93. package/dist/sb-addons/essentials-outline-7/manager-bundle.js.LEGAL.txt +0 -0
  94. package/dist/sb-addons/essentials-toolbars-5/manager-bundle.js +0 -3
  95. package/dist/sb-addons/essentials-toolbars-5/manager-bundle.js.LEGAL.txt +0 -0
  96. package/dist/sb-addons/essentials-viewport-4/manager-bundle.js +0 -3
  97. package/dist/sb-addons/essentials-viewport-4/manager-bundle.js.LEGAL.txt +0 -0
  98. package/dist/sb-addons/storybook-core-core-server-presets-0/common-manager-bundle.js +0 -3
  99. package/dist/sb-addons/storybook-core-core-server-presets-0/common-manager-bundle.js.LEGAL.txt +0 -0
  100. package/dist/sb-common-assets/favicon.svg +0 -1
  101. package/dist/sb-common-assets/nunito-sans-bold-italic.woff2 +0 -0
  102. package/dist/sb-common-assets/nunito-sans-bold.woff2 +0 -0
  103. package/dist/sb-common-assets/nunito-sans-italic.woff2 +0 -0
  104. package/dist/sb-common-assets/nunito-sans-regular.woff2 +0 -0
  105. package/dist/sb-manager/globals-module-info.js +0 -1028
  106. package/dist/sb-manager/globals-runtime.js +0 -40861
  107. package/dist/sb-manager/globals.js +0 -48
  108. package/dist/sb-manager/runtime.js +0 -13338
  109. package/dist/sb-preview/globals.js +0 -33
  110. package/dist/sb-preview/runtime.js +0 -7174
@@ -1,396 +0,0 @@
1
- import{d as $}from"./index-DrFu-skq.js";const{useMemo:x,useEffect:f}=__STORYBOOK_MODULE_PREVIEW_API__,{global:p}=__STORYBOOK_MODULE_GLOBAL__;var m="outline",u=i=>{(Array.isArray(i)?i:[i]).forEach(r)},r=i=>{let t=typeof i=="string"?i:i.join(""),o=p.document.getElementById(t);o&&o.parentElement&&o.parentElement.removeChild(o)},b=(i,t)=>{let o=p.document.getElementById(i);if(o)o.innerHTML!==t&&(o.innerHTML=t);else{let n=p.document.createElement("style");n.setAttribute("id",i),n.innerHTML=t,p.document.head.appendChild(n)}};function s(i){return $`
2
- ${i} body {
3
- outline: 1px solid #2980b9 !important;
4
- }
5
-
6
- ${i} article {
7
- outline: 1px solid #3498db !important;
8
- }
9
-
10
- ${i} nav {
11
- outline: 1px solid #0088c3 !important;
12
- }
13
-
14
- ${i} aside {
15
- outline: 1px solid #33a0ce !important;
16
- }
17
-
18
- ${i} section {
19
- outline: 1px solid #66b8da !important;
20
- }
21
-
22
- ${i} header {
23
- outline: 1px solid #99cfe7 !important;
24
- }
25
-
26
- ${i} footer {
27
- outline: 1px solid #cce7f3 !important;
28
- }
29
-
30
- ${i} h1 {
31
- outline: 1px solid #162544 !important;
32
- }
33
-
34
- ${i} h2 {
35
- outline: 1px solid #314e6e !important;
36
- }
37
-
38
- ${i} h3 {
39
- outline: 1px solid #3e5e85 !important;
40
- }
41
-
42
- ${i} h4 {
43
- outline: 1px solid #449baf !important;
44
- }
45
-
46
- ${i} h5 {
47
- outline: 1px solid #c7d1cb !important;
48
- }
49
-
50
- ${i} h6 {
51
- outline: 1px solid #4371d0 !important;
52
- }
53
-
54
- ${i} main {
55
- outline: 1px solid #2f4f90 !important;
56
- }
57
-
58
- ${i} address {
59
- outline: 1px solid #1a2c51 !important;
60
- }
61
-
62
- ${i} div {
63
- outline: 1px solid #036cdb !important;
64
- }
65
-
66
- ${i} p {
67
- outline: 1px solid #ac050b !important;
68
- }
69
-
70
- ${i} hr {
71
- outline: 1px solid #ff063f !important;
72
- }
73
-
74
- ${i} pre {
75
- outline: 1px solid #850440 !important;
76
- }
77
-
78
- ${i} blockquote {
79
- outline: 1px solid #f1b8e7 !important;
80
- }
81
-
82
- ${i} ol {
83
- outline: 1px solid #ff050c !important;
84
- }
85
-
86
- ${i} ul {
87
- outline: 1px solid #d90416 !important;
88
- }
89
-
90
- ${i} li {
91
- outline: 1px solid #d90416 !important;
92
- }
93
-
94
- ${i} dl {
95
- outline: 1px solid #fd3427 !important;
96
- }
97
-
98
- ${i} dt {
99
- outline: 1px solid #ff0043 !important;
100
- }
101
-
102
- ${i} dd {
103
- outline: 1px solid #e80174 !important;
104
- }
105
-
106
- ${i} figure {
107
- outline: 1px solid #ff00bb !important;
108
- }
109
-
110
- ${i} figcaption {
111
- outline: 1px solid #bf0032 !important;
112
- }
113
-
114
- ${i} table {
115
- outline: 1px solid #00cc99 !important;
116
- }
117
-
118
- ${i} caption {
119
- outline: 1px solid #37ffc4 !important;
120
- }
121
-
122
- ${i} thead {
123
- outline: 1px solid #98daca !important;
124
- }
125
-
126
- ${i} tbody {
127
- outline: 1px solid #64a7a0 !important;
128
- }
129
-
130
- ${i} tfoot {
131
- outline: 1px solid #22746b !important;
132
- }
133
-
134
- ${i} tr {
135
- outline: 1px solid #86c0b2 !important;
136
- }
137
-
138
- ${i} th {
139
- outline: 1px solid #a1e7d6 !important;
140
- }
141
-
142
- ${i} td {
143
- outline: 1px solid #3f5a54 !important;
144
- }
145
-
146
- ${i} col {
147
- outline: 1px solid #6c9a8f !important;
148
- }
149
-
150
- ${i} colgroup {
151
- outline: 1px solid #6c9a9d !important;
152
- }
153
-
154
- ${i} button {
155
- outline: 1px solid #da8301 !important;
156
- }
157
-
158
- ${i} datalist {
159
- outline: 1px solid #c06000 !important;
160
- }
161
-
162
- ${i} fieldset {
163
- outline: 1px solid #d95100 !important;
164
- }
165
-
166
- ${i} form {
167
- outline: 1px solid #d23600 !important;
168
- }
169
-
170
- ${i} input {
171
- outline: 1px solid #fca600 !important;
172
- }
173
-
174
- ${i} keygen {
175
- outline: 1px solid #b31e00 !important;
176
- }
177
-
178
- ${i} label {
179
- outline: 1px solid #ee8900 !important;
180
- }
181
-
182
- ${i} legend {
183
- outline: 1px solid #de6d00 !important;
184
- }
185
-
186
- ${i} meter {
187
- outline: 1px solid #e8630c !important;
188
- }
189
-
190
- ${i} optgroup {
191
- outline: 1px solid #b33600 !important;
192
- }
193
-
194
- ${i} option {
195
- outline: 1px solid #ff8a00 !important;
196
- }
197
-
198
- ${i} output {
199
- outline: 1px solid #ff9619 !important;
200
- }
201
-
202
- ${i} progress {
203
- outline: 1px solid #e57c00 !important;
204
- }
205
-
206
- ${i} select {
207
- outline: 1px solid #e26e0f !important;
208
- }
209
-
210
- ${i} textarea {
211
- outline: 1px solid #cc5400 !important;
212
- }
213
-
214
- ${i} details {
215
- outline: 1px solid #33848f !important;
216
- }
217
-
218
- ${i} summary {
219
- outline: 1px solid #60a1a6 !important;
220
- }
221
-
222
- ${i} command {
223
- outline: 1px solid #438da1 !important;
224
- }
225
-
226
- ${i} menu {
227
- outline: 1px solid #449da6 !important;
228
- }
229
-
230
- ${i} del {
231
- outline: 1px solid #bf0000 !important;
232
- }
233
-
234
- ${i} ins {
235
- outline: 1px solid #400000 !important;
236
- }
237
-
238
- ${i} img {
239
- outline: 1px solid #22746b !important;
240
- }
241
-
242
- ${i} iframe {
243
- outline: 1px solid #64a7a0 !important;
244
- }
245
-
246
- ${i} embed {
247
- outline: 1px solid #98daca !important;
248
- }
249
-
250
- ${i} object {
251
- outline: 1px solid #00cc99 !important;
252
- }
253
-
254
- ${i} param {
255
- outline: 1px solid #37ffc4 !important;
256
- }
257
-
258
- ${i} video {
259
- outline: 1px solid #6ee866 !important;
260
- }
261
-
262
- ${i} audio {
263
- outline: 1px solid #027353 !important;
264
- }
265
-
266
- ${i} source {
267
- outline: 1px solid #012426 !important;
268
- }
269
-
270
- ${i} canvas {
271
- outline: 1px solid #a2f570 !important;
272
- }
273
-
274
- ${i} track {
275
- outline: 1px solid #59a600 !important;
276
- }
277
-
278
- ${i} map {
279
- outline: 1px solid #7be500 !important;
280
- }
281
-
282
- ${i} area {
283
- outline: 1px solid #305900 !important;
284
- }
285
-
286
- ${i} a {
287
- outline: 1px solid #ff62ab !important;
288
- }
289
-
290
- ${i} em {
291
- outline: 1px solid #800b41 !important;
292
- }
293
-
294
- ${i} strong {
295
- outline: 1px solid #ff1583 !important;
296
- }
297
-
298
- ${i} i {
299
- outline: 1px solid #803156 !important;
300
- }
301
-
302
- ${i} b {
303
- outline: 1px solid #cc1169 !important;
304
- }
305
-
306
- ${i} u {
307
- outline: 1px solid #ff0430 !important;
308
- }
309
-
310
- ${i} s {
311
- outline: 1px solid #f805e3 !important;
312
- }
313
-
314
- ${i} small {
315
- outline: 1px solid #d107b2 !important;
316
- }
317
-
318
- ${i} abbr {
319
- outline: 1px solid #4a0263 !important;
320
- }
321
-
322
- ${i} q {
323
- outline: 1px solid #240018 !important;
324
- }
325
-
326
- ${i} cite {
327
- outline: 1px solid #64003c !important;
328
- }
329
-
330
- ${i} dfn {
331
- outline: 1px solid #b4005a !important;
332
- }
333
-
334
- ${i} sub {
335
- outline: 1px solid #dba0c8 !important;
336
- }
337
-
338
- ${i} sup {
339
- outline: 1px solid #cc0256 !important;
340
- }
341
-
342
- ${i} time {
343
- outline: 1px solid #d6606d !important;
344
- }
345
-
346
- ${i} code {
347
- outline: 1px solid #e04251 !important;
348
- }
349
-
350
- ${i} kbd {
351
- outline: 1px solid #5e001f !important;
352
- }
353
-
354
- ${i} samp {
355
- outline: 1px solid #9c0033 !important;
356
- }
357
-
358
- ${i} var {
359
- outline: 1px solid #d90047 !important;
360
- }
361
-
362
- ${i} mark {
363
- outline: 1px solid #ff0053 !important;
364
- }
365
-
366
- ${i} bdi {
367
- outline: 1px solid #bf3668 !important;
368
- }
369
-
370
- ${i} bdo {
371
- outline: 1px solid #6f1400 !important;
372
- }
373
-
374
- ${i} ruby {
375
- outline: 1px solid #ff7b93 !important;
376
- }
377
-
378
- ${i} rt {
379
- outline: 1px solid #ff2f54 !important;
380
- }
381
-
382
- ${i} rp {
383
- outline: 1px solid #803e49 !important;
384
- }
385
-
386
- ${i} span {
387
- outline: 1px solid #cc2643 !important;
388
- }
389
-
390
- ${i} br {
391
- outline: 1px solid #db687d !important;
392
- }
393
-
394
- ${i} wbr {
395
- outline: 1px solid #db175b !important;
396
- }`}var e=(i,t)=>{let{globals:o}=t,n=[!0,"true"].includes(o[m]),d=t.viewMode==="docs",l=x(()=>s(d?'[data-story-block="true"]':".sb-show-main"),[t]);return f(()=>{let a=d?`addon-outline-docs-${t.id}`:"addon-outline";return n?b(a,l):u(a),()=>{u(a)}},[n,l,t]),i()},h=[e],g={[m]:!1};export{h as decorators,g as initialGlobals};
@@ -1,2 +0,0 @@
1
- const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["./DocsRenderer-CFRXHY34-CvW79YxE.js","./iframe-BQFuVTVZ.js","./index-oFsFREWh.js","./_commonjsHelpers-Cpj98o6Y.js","./index-BHYIh-Xd.js","./index-DrFu-skq.js"])))=>i.map(i=>d[i]);
2
- import{_ as a}from"./iframe-BQFuVTVZ.js";import"../sb-preview/runtime.js";var i=Object.entries(globalThis.TAGS_OPTIONS??{}).reduce((e,r)=>{let[t,o]=r;return o.excludeFromDocsStories&&(e[t]=!0),e},{}),d={docs:{renderer:async()=>{let{DocsRenderer:e}=await a(()=>import("./DocsRenderer-CFRXHY34-CvW79YxE.js").then(r=>r.ak),__vite__mapDeps([0,1,2,3,4,5]),import.meta.url);return new e},stories:{filter:e=>{var r;return(e.tags||[]).filter(t=>i[t]).length===0&&!((r=e.parameters.docs)!=null&&r.disable)}}}};export{d as parameters};
@@ -1,34 +0,0 @@
1
- import{d as Y}from"./index-DrFu-skq.js";const{useEffect:_,useMemo:h}=__STORYBOOK_MODULE_PREVIEW_API__,{global:H}=__STORYBOOK_MODULE_GLOBAL__,{logger:K}=__STORYBOOK_MODULE_CLIENT_LOGGER__;var g="backgrounds",C={light:{name:"light",value:"#F8F8F8"},dark:{name:"dark",value:"#333"}},{document:$,window:T}=H,I=()=>{var r;return!!((r=T==null?void 0:T.matchMedia("(prefers-reduced-motion: reduce)"))!=null&&r.matches)},A=r=>{(Array.isArray(r)?r:[r]).forEach(P)},P=r=>{var t;let e=$.getElementById(r);e&&((t=e.parentElement)==null||t.removeChild(e))},z=(r,e)=>{let t=$.getElementById(r);if(t)t.innerHTML!==e&&(t.innerHTML=e);else{let d=$.createElement("style");d.setAttribute("id",r),d.innerHTML=e,$.head.appendChild(d)}},U=(r,e,t)=>{var a;let d=$.getElementById(r);if(d)d.innerHTML!==e&&(d.innerHTML=e);else{let o=$.createElement("style");o.setAttribute("id",r),o.innerHTML=e;let i=`addon-backgrounds-grid${t?`-docs-${t}`:""}`,n=$.getElementById(i);n?(a=n.parentElement)==null||a.insertBefore(o,n):$.head.appendChild(o)}},j={cellSize:100,cellAmount:10,opacity:.8},w="addon-backgrounds",R="addon-backgrounds-grid",X=I()?"":"transition: background-color 0.3s;",N=(r,e)=>{let{globals:t,parameters:d,viewMode:a,id:o}=e,{options:i=C,disable:n,grid:s=j}=d[g]||{},c=t[g]||{},u=c.value,l=u?i[u]:void 0,b=(l==null?void 0:l.value)||"transparent",f=c.grid||!1,y=!!l&&!n,m=a==="docs"?`#anchor--${o} .docs-story`:".sb-show-main",E=a==="docs"?`#anchor--${o} .docs-story`:".sb-show-main",D=d.layout===void 0||d.layout==="padded",L=a==="docs"?20:D?16:0,{cellAmount:k,cellSize:p,opacity:x,offsetX:v=L,offsetY:S=L}=s,B=a==="docs"?`${w}-docs-${o}`:`${w}-color`,G=a==="docs"?o:null;_(()=>{let O=`
2
- ${m} {
3
- background: ${b} !important;
4
- ${X}
5
- }`;if(!y){A(B);return}U(B,O,G)},[m,B,G,y,b]);let M=a==="docs"?`${R}-docs-${o}`:`${R}`;return _(()=>{if(!f){A(M);return}let O=[`${p*k}px ${p*k}px`,`${p*k}px ${p*k}px`,`${p}px ${p}px`,`${p}px ${p}px`].join(", "),F=`
6
- ${E} {
7
- background-size: ${O} !important;
8
- background-position: ${v}px ${S}px, ${v}px ${S}px, ${v}px ${S}px, ${v}px ${S}px !important;
9
- background-blend-mode: difference !important;
10
- background-image: linear-gradient(rgba(130, 130, 130, ${x}) 1px, transparent 1px),
11
- linear-gradient(90deg, rgba(130, 130, 130, ${x}) 1px, transparent 1px),
12
- linear-gradient(rgba(130, 130, 130, ${x/2}) 1px, transparent 1px),
13
- linear-gradient(90deg, rgba(130, 130, 130, ${x/2}) 1px, transparent 1px) !important;
14
- }
15
- `;z(M,F)},[k,p,E,M,f,v,S,x]),r()},W=(r,e=[],t)=>{if(r==="transparent")return"transparent";if(e.find(a=>a.value===r)||r)return r;let d=e.find(a=>a.name===t);if(d)return d.value;if(t){let a=e.map(o=>o.name).join(", ");K.warn(Y`
16
- Backgrounds Addon: could not find the default color "${t}".
17
- These are the available colors for your story based on your configuration:
18
- ${a}.
19
- `)}return"transparent"},q=(r,e)=>{var u;let{globals:t,parameters:d}=e,a=(u=t[g])==null?void 0:u.value,o=d[g],i=h(()=>o.disable?"transparent":W(a,o.values,o.default),[o,a]),n=h(()=>i&&i!=="transparent",[i]),s=e.viewMode==="docs"?`#anchor--${e.id} .docs-story`:".sb-show-main",c=h(()=>`
20
- ${s} {
21
- background: ${i} !important;
22
- ${I()?"":"transition: background-color 0.3s;"}
23
- }
24
- `,[i,s]);return _(()=>{let l=e.viewMode==="docs"?`addon-backgrounds-docs-${e.id}`:"addon-backgrounds-color";if(!n){A(l);return}U(l,c,e.viewMode==="docs"?e.id:null)},[n,c,e]),r()},J=(r,e)=>{var y;let{globals:t,parameters:d}=e,a=d[g].grid,o=((y=t[g])==null?void 0:y.grid)===!0&&a.disable!==!0,{cellAmount:i,cellSize:n,opacity:s}=a,c=e.viewMode==="docs",u=d.layout===void 0||d.layout==="padded"?16:0,l=a.offsetX??(c?20:u),b=a.offsetY??(c?20:u),f=h(()=>{let m=e.viewMode==="docs"?`#anchor--${e.id} .docs-story`:".sb-show-main",E=[`${n*i}px ${n*i}px`,`${n*i}px ${n*i}px`,`${n}px ${n}px`,`${n}px ${n}px`].join(", ");return`
25
- ${m} {
26
- background-size: ${E} !important;
27
- background-position: ${l}px ${b}px, ${l}px ${b}px, ${l}px ${b}px, ${l}px ${b}px !important;
28
- background-blend-mode: difference !important;
29
- background-image: linear-gradient(rgba(130, 130, 130, ${s}) 1px, transparent 1px),
30
- linear-gradient(90deg, rgba(130, 130, 130, ${s}) 1px, transparent 1px),
31
- linear-gradient(rgba(130, 130, 130, ${s/2}) 1px, transparent 1px),
32
- linear-gradient(90deg, rgba(130, 130, 130, ${s/2}) 1px, transparent 1px) !important;
33
- }
34
- `},[n]);return _(()=>{let m=e.viewMode==="docs"?`addon-backgrounds-grid-docs-${e.id}`:"addon-backgrounds-grid";if(!o){A(m);return}z(m,f)},[o,f,e]),r()},V=FEATURES!=null&&FEATURES.backgroundsStoryGlobals?[N]:[J,q],ee={[g]:{grid:{cellSize:20,opacity:.5,cellAmount:5},disable:!1,...!(FEATURES!=null&&FEATURES.backgroundsStoryGlobals)&&{values:Object.values(C)}}},Q={[g]:{value:void 0,grid:!1}},re=FEATURES!=null&&FEATURES.backgroundsStoryGlobals?Q:{[g]:null};export{V as decorators,re as initialGlobals,ee as parameters};
@@ -1 +0,0 @@
1
- import{i as S}from"./tiny-invariant-CopsF_GD.js";const{useEffect:T}=__STORYBOOK_MODULE_PREVIEW_API__,{global:u}=__STORYBOOK_MODULE_GLOBAL__;var j="measureEnabled";function Y(){let e=u.document.documentElement,t=Math.max(e.scrollHeight,e.offsetHeight);return{width:Math.max(e.scrollWidth,e.offsetWidth),height:t}}function K(){let e=u.document.createElement("canvas");e.id="storybook-addon-measure";let t=e.getContext("2d");S(t!=null);let{width:o,height:l}=Y();return A(e,t,{width:o,height:l}),e.style.position="absolute",e.style.left="0",e.style.top="0",e.style.zIndex="2147483647",e.style.pointerEvents="none",u.document.body.appendChild(e),{canvas:e,context:t,width:o,height:l}}function A(e,t,{width:o,height:l}){e.style.width=`${o}px`,e.style.height=`${l}px`;let i=u.window.devicePixelRatio;e.width=Math.floor(o*i),e.height=Math.floor(l*i),t.scale(i,i)}var h={};function G(){h.canvas||(h=K())}function H(){h.context&&h.context.clearRect(0,0,h.width??0,h.height??0)}function U(e){H(),e(h.context)}function V(){S(h.canvas),S(h.context),A(h.canvas,h.context,{width:0,height:0});let{width:e,height:t}=Y();A(h.canvas,h.context,{width:e,height:t}),h.width=e,h.height=t}function Z(){var e;h.canvas&&(H(),(e=h.canvas.parentNode)==null||e.removeChild(h.canvas),h={})}var w={margin:"#f6b26b",border:"#ffe599",padding:"#93c47d",content:"#6fa8dc",text:"#232020"},c=6;function W(e,{x:t,y:o,w:l,h:i,r:n}){t=t-l/2,o=o-i/2,l<2*n&&(n=l/2),i<2*n&&(n=i/2),e.beginPath(),e.moveTo(t+n,o),e.arcTo(t+l,o,t+l,o+i,n),e.arcTo(t+l,o+i,t,o+i,n),e.arcTo(t,o+i,t,o,n),e.arcTo(t,o,t+l,o,n),e.closePath()}function J(e,{padding:t,border:o,width:l,height:i,top:n,left:r}){let f=l-o.left-o.right-t.left-t.right,a=i-t.top-t.bottom-o.top-o.bottom,s=r+o.left+t.left,m=n+o.top+t.top;return e==="top"?s+=f/2:e==="right"?(s+=f,m+=a/2):e==="bottom"?(s+=f/2,m+=a):e==="left"?m+=a/2:e==="center"&&(s+=f/2,m+=a/2),{x:s,y:m}}function Q(e,t,{margin:o,border:l,padding:i},n,r){let f=d=>0,a=0,s=0,m=r?1:.5,g=r?n*2:0;return e==="padding"?f=d=>i[d]*m+g:e==="border"?f=d=>i[d]+l[d]*m+g:e==="margin"&&(f=d=>i[d]+l[d]+o[d]*m+g),t==="top"?s=-f("top"):t==="right"?a=f("right"):t==="bottom"?s=f("bottom"):t==="left"&&(a=-f("left")),{offsetX:a,offsetY:s}}function x(e,t){return Math.abs(e.x-t.x)<Math.abs(e.w+t.w)/2&&Math.abs(e.y-t.y)<Math.abs(e.h+t.h)/2}function tt(e,t,o){return e==="top"?t.y=o.y-o.h-c:e==="right"?t.x=o.x+o.w/2+c+t.w/2:e==="bottom"?t.y=o.y+o.h+c:e==="left"&&(t.x=o.x-o.w/2-c-t.w/2),{x:t.x,y:t.y}}function X(e,t,{x:o,y:l,w:i,h:n},r){return W(e,{x:o,y:l,w:i,h:n,r:3}),e.fillStyle=`${w[t]}dd`,e.fill(),e.strokeStyle=w[t],e.stroke(),e.fillStyle=w.text,e.fillText(r,o,l),W(e,{x:o,y:l,w:i,h:n,r:3}),e.fillStyle=`${w[t]}dd`,e.fill(),e.strokeStyle=w[t],e.stroke(),e.fillStyle=w.text,e.fillText(r,o,l),{x:o,y:l,w:i,h:n}}function C(e,t){e.font="600 12px monospace",e.textBaseline="middle",e.textAlign="center";let o=e.measureText(t),l=o.actualBoundingBoxAscent+o.actualBoundingBoxDescent,i=o.width+c*2,n=l+c*2;return{w:i,h:n}}function et(e,t,{type:o,position:l="center",text:i},n,r=!1){let{x:f,y:a}=J(l,t),{offsetX:s,offsetY:m}=Q(o,l,t,c+1,r);f+=s,a+=m;let{w:g,h:d}=C(e,i);if(n&&x({x:f,y:a,w:g,h:d},n)){let M=tt(l,{x:f,y:a,w:g,h:d},n);f=M.x,a=M.y}return X(e,o,{x:f,y:a,w:g,h:d},i)}function ot(e,{w:t,h:o}){let l=t*.5+c,i=o*.5+c;return{offsetX:(e.x==="left"?-1:1)*l,offsetY:(e.y==="top"?-1:1)*i}}function it(e,t,{type:o,text:l}){let{floatingAlignment:i,extremities:n}=t,r=n[i.x],f=n[i.y],{w:a,h:s}=C(e,l),{offsetX:m,offsetY:g}=ot(i,{w:a,h:s});return r+=m,f+=g,X(e,o,{x:r,y:f,w:a,h:s},l)}function E(e,t,o,l){let i=[];o.forEach((n,r)=>{let f=l&&n.position==="center"?it(e,t,n):et(e,t,n,i[r-1],l);i[r]=f})}function lt(e,t,o,l){let i=o.reduce((n,r)=>{var f;return Object.prototype.hasOwnProperty.call(n,r.position)||(n[r.position]=[]),(f=n[r.position])==null||f.push(r),n},{});i.top&&E(e,t,i.top,l),i.right&&E(e,t,i.right,l),i.bottom&&E(e,t,i.bottom,l),i.left&&E(e,t,i.left,l),i.center&&E(e,t,i.center,l)}var L={margin:"#f6b26ba8",border:"#ffe599a8",padding:"#93c47d8c",content:"#6fa8dca8"},B=30;function p(e){return parseInt(e.replace("px",""),10)}function b(e){return Number.isInteger(e)?e:e.toFixed(2)}function P(e){return e.filter(t=>t.text!==0&&t.text!=="0")}function nt(e){let t={top:u.window.scrollY,bottom:u.window.scrollY+u.window.innerHeight,left:u.window.scrollX,right:u.window.scrollX+u.window.innerWidth},o={top:Math.abs(t.top-e.top),bottom:Math.abs(t.bottom-e.bottom),left:Math.abs(t.left-e.left),right:Math.abs(t.right-e.right)};return{x:o.left>o.right?"left":"right",y:o.top>o.bottom?"top":"bottom"}}function ft(e){let t=u.getComputedStyle(e),{top:o,left:l,right:i,bottom:n,width:r,height:f}=e.getBoundingClientRect(),{marginTop:a,marginBottom:s,marginLeft:m,marginRight:g,paddingTop:d,paddingBottom:M,paddingLeft:k,paddingRight:F,borderBottomWidth:D,borderTopWidth:I,borderLeftWidth:$,borderRightWidth:N}=t;o=o+u.window.scrollY,l=l+u.window.scrollX,n=n+u.window.scrollY,i=i+u.window.scrollX;let y={top:p(a),bottom:p(s),left:p(m),right:p(g)},q={top:p(d),bottom:p(M),left:p(k),right:p(F)},z={top:p(I),bottom:p(D),left:p($),right:p(N)},_={top:o-y.top,bottom:n+y.bottom,left:l-y.left,right:i+y.right};return{margin:y,padding:q,border:z,top:o,left:l,bottom:n,right:i,width:r,height:f,extremities:_,floatingAlignment:nt(_)}}function rt(e,{margin:t,width:o,height:l,top:i,left:n,bottom:r,right:f}){let a=l+t.bottom+t.top;e.fillStyle=L.margin,e.fillRect(n,i-t.top,o,t.top),e.fillRect(f,i-t.top,t.right,a),e.fillRect(n,r,o,t.bottom),e.fillRect(n-t.left,i-t.top,t.left,a);let s=[{type:"margin",text:b(t.top),position:"top"},{type:"margin",text:b(t.right),position:"right"},{type:"margin",text:b(t.bottom),position:"bottom"},{type:"margin",text:b(t.left),position:"left"}];return P(s)}function at(e,{padding:t,border:o,width:l,height:i,top:n,left:r,bottom:f,right:a}){let s=l-o.left-o.right,m=i-t.top-t.bottom-o.top-o.bottom;e.fillStyle=L.padding,e.fillRect(r+o.left,n+o.top,s,t.top),e.fillRect(a-t.right-o.right,n+t.top+o.top,t.right,m),e.fillRect(r+o.left,f-t.bottom-o.bottom,s,t.bottom),e.fillRect(r+o.left,n+t.top+o.top,t.left,m);let g=[{type:"padding",text:t.top,position:"top"},{type:"padding",text:t.right,position:"right"},{type:"padding",text:t.bottom,position:"bottom"},{type:"padding",text:t.left,position:"left"}];return P(g)}function st(e,{border:t,width:o,height:l,top:i,left:n,bottom:r,right:f}){let a=l-t.top-t.bottom;e.fillStyle=L.border,e.fillRect(n,i,o,t.top),e.fillRect(n,r-t.bottom,o,t.bottom),e.fillRect(n,i+t.top,t.left,a),e.fillRect(f-t.right,i+t.top,t.right,a);let s=[{type:"border",text:t.top,position:"top"},{type:"border",text:t.right,position:"right"},{type:"border",text:t.bottom,position:"bottom"},{type:"border",text:t.left,position:"left"}];return P(s)}function ht(e,{padding:t,border:o,width:l,height:i,top:n,left:r}){let f=l-o.left-o.right-t.left-t.right,a=i-t.top-t.bottom-o.top-o.bottom;return e.fillStyle=L.content,e.fillRect(r+o.left+t.left,n+o.top+t.top,f,a),[{type:"content",position:"center",text:`${b(f)} x ${b(a)}`}]}function mt(e){return t=>{if(e&&t){let o=ft(e),l=rt(t,o),i=at(t,o),n=st(t,o),r=ht(t,o),f=o.width<=B*3||o.height<=B;lt(t,o,[...r,...i,...n,...l],f)}}}function ut(e){U(mt(e))}var dt=(e,t)=>{let o=u.document.elementFromPoint(e,t),l=i=>{if(i&&i.shadowRoot){let n=i.shadowRoot.elementFromPoint(e,t);return i.isEqualNode(n)?i:n.shadowRoot?l(n):n}return i};return l(o)||o},O,v={x:0,y:0};function R(e,t){O=dt(e,t),ut(O)}var gt=(e,t)=>{let{measureEnabled:o}=t.globals;return T(()=>{let l=i=>{window.requestAnimationFrame(()=>{i.stopPropagation(),v.x=i.clientX,v.y=i.clientY})};return document.addEventListener("pointermove",l),()=>{document.removeEventListener("pointermove",l)}},[]),T(()=>{let l=n=>{window.requestAnimationFrame(()=>{n.stopPropagation(),R(n.clientX,n.clientY)})},i=()=>{window.requestAnimationFrame(()=>{V()})};return t.viewMode==="story"&&o&&(document.addEventListener("pointerover",l),G(),window.addEventListener("resize",i),R(v.x,v.y)),()=>{window.removeEventListener("resize",i),Z()}},[o,t.viewMode]),e()},ct=[gt],wt={[j]:!1};export{ct as decorators,wt as initialGlobals};
@@ -1 +0,0 @@
1
- var e="viewport",o={[e]:{value:void 0,isRotated:!1}},t={viewport:"reset",viewportRotated:!1},r=FEATURES!=null&&FEATURES.viewportStoryGlobals?o:t;export{r as initialGlobals};
@@ -1,7 +0,0 @@
1
- const{STORY_CHANGED:r}=__STORYBOOK_MODULE_CORE_EVENTS__,{addons:s}=__STORYBOOK_MODULE_PREVIEW_API__,{global:O}=__STORYBOOK_MODULE_GLOBAL__;var d="storybook/highlight",i="storybookHighlight",g=`${d}/add`,E=`${d}/reset`,{document:l}=O,H=(e="#FF4785",t="dashed")=>`
2
- outline: 2px ${t} ${e};
3
- outline-offset: 2px;
4
- box-shadow: 0 0 0 6px rgba(255,255,255,0.6);
5
- `,h=s.getChannel(),T=e=>{let t=i;n();let o=Array.from(new Set(e.elements)),_=l.createElement("style");_.setAttribute("id",t),_.innerHTML=o.map(a=>`${a}{
6
- ${H(e.color,e.style)}
7
- }`).join(" "),l.head.appendChild(_)},n=()=>{var o;let e=i,t=l.getElementById(e);t&&((o=t.parentNode)==null||o.removeChild(t))};h.on(r,n);h.on(E,n);h.on(g,T);