@sky.ui/core 0.0.7 → 0.0.20

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 (219) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/auto-import.js +1 -31
  3. package/dist/custom-elements.json +7115 -21498
  4. package/dist/helper/utils/color-resolver.d.ts +12 -0
  5. package/dist/helper/utils/color-resolver.js +1 -1
  6. package/dist/helper/utils/color-resolver.js.map +1 -1
  7. package/dist/index.d.ts +1 -31
  8. package/dist/index.js +1 -1
  9. package/dist/sky-alert/sky-alert.js +32 -42
  10. package/dist/sky-alert/sky-alert.js.map +1 -1
  11. package/dist/sky-appbar/sky-appbar.d.ts +5 -0
  12. package/dist/sky-appbar/sky-appbar.js +63 -21
  13. package/dist/sky-appbar/sky-appbar.js.map +1 -1
  14. package/dist/sky-avatar/sky-avatar.d.ts +2 -2
  15. package/dist/sky-avatar/sky-avatar.js +36 -28
  16. package/dist/sky-avatar/sky-avatar.js.map +1 -1
  17. package/dist/sky-badge/sky-badge.d.ts +2 -0
  18. package/dist/sky-badge/sky-badge.js +21 -19
  19. package/dist/sky-badge/sky-badge.js.map +1 -1
  20. package/dist/sky-button/sky-button.d.ts +4 -0
  21. package/dist/sky-button/sky-button.js +85 -26
  22. package/dist/sky-button/sky-button.js.map +1 -1
  23. package/dist/sky-card/sky-card.d.ts +7 -1
  24. package/dist/sky-card/sky-card.js +72 -40
  25. package/dist/sky-card/sky-card.js.map +1 -1
  26. package/dist/sky-checkbox/sky-checkbox.js +34 -23
  27. package/dist/sky-checkbox/sky-checkbox.js.map +1 -1
  28. package/dist/sky-chip/sky-chip.js +53 -35
  29. package/dist/sky-chip/sky-chip.js.map +1 -1
  30. package/dist/sky-combobox/sky-combobox.d.ts +6 -2
  31. package/dist/sky-combobox/sky-combobox.js +92 -262
  32. package/dist/sky-combobox/sky-combobox.js.map +1 -1
  33. package/dist/sky-dialog/sky-dialog.d.ts +4 -11
  34. package/dist/sky-dialog/sky-dialog.js +78 -131
  35. package/dist/sky-dialog/sky-dialog.js.map +1 -1
  36. package/dist/sky-flexbox/sky-flexbox.js.map +1 -1
  37. package/dist/sky-form/sky-form.js +21 -19
  38. package/dist/sky-form/sky-form.js.map +1 -1
  39. package/dist/sky-image/sky-image.d.ts +1 -0
  40. package/dist/sky-image/sky-image.js +14 -7
  41. package/dist/sky-image/sky-image.js.map +1 -1
  42. package/dist/sky-input/sky-input.d.ts +15 -2
  43. package/dist/sky-input/sky-input.js +188 -193
  44. package/dist/sky-input/sky-input.js.map +1 -1
  45. package/dist/sky-list/sky-list.d.ts +11 -2
  46. package/dist/sky-list/sky-list.js +15 -25
  47. package/dist/sky-list/sky-list.js.map +1 -1
  48. package/dist/sky-listitem/sky-listitem.js +62 -30
  49. package/dist/sky-listitem/sky-listitem.js.map +1 -1
  50. package/dist/sky-radio/sky-radio.d.ts +2 -0
  51. package/dist/sky-radio/sky-radio.js +29 -9
  52. package/dist/sky-radio/sky-radio.js.map +1 -1
  53. package/dist/sky-sheet/sky-sheet.d.ts +1 -1
  54. package/dist/sky-sheet/sky-sheet.js +68 -22
  55. package/dist/sky-sheet/sky-sheet.js.map +1 -1
  56. package/dist/sky-simple-table/index.d.ts +1 -0
  57. package/dist/sky-simple-table/index.js +1 -0
  58. package/dist/sky-simple-table/sky-simple-table.d.ts +68 -0
  59. package/dist/sky-simple-table/sky-simple-table.js +100 -0
  60. package/dist/sky-simple-table/sky-simple-table.js.map +1 -0
  61. package/dist/sky-theme-provider/sky-theme-provider.d.ts +10 -1
  62. package/dist/sky-theme-provider/sky-theme-provider.js +2 -2
  63. package/dist/sky-theme-provider/sky-theme-provider.js.map +1 -1
  64. package/package.json +39 -269
  65. package/dist/sky-accordion/index.d.ts +0 -1
  66. package/dist/sky-accordion/index.js +0 -1
  67. package/dist/sky-accordion/sky-accordion.d.ts +0 -201
  68. package/dist/sky-accordion/sky-accordion.js +0 -84
  69. package/dist/sky-accordion/sky-accordion.js.map +0 -1
  70. package/dist/sky-accordion-item/index.d.ts +0 -1
  71. package/dist/sky-accordion-item/index.js +0 -1
  72. package/dist/sky-accordion-item/sky-accordion-item.d.ts +0 -161
  73. package/dist/sky-accordion-item/sky-accordion-item.js +0 -191
  74. package/dist/sky-accordion-item/sky-accordion-item.js.map +0 -1
  75. package/dist/sky-breadcrumb/index.d.ts +0 -1
  76. package/dist/sky-breadcrumb/index.js +0 -1
  77. package/dist/sky-breadcrumb/sky-breadcrumb.d.ts +0 -111
  78. package/dist/sky-breadcrumb/sky-breadcrumb.js +0 -230
  79. package/dist/sky-breadcrumb/sky-breadcrumb.js.map +0 -1
  80. package/dist/sky-button-group/index.d.ts +0 -1
  81. package/dist/sky-button-group/index.js +0 -1
  82. package/dist/sky-button-group/sky-button-group.d.ts +0 -93
  83. package/dist/sky-button-group/sky-button-group.js +0 -281
  84. package/dist/sky-button-group/sky-button-group.js.map +0 -1
  85. package/dist/sky-carousel/index.d.ts +0 -1
  86. package/dist/sky-carousel/index.js +0 -1
  87. package/dist/sky-carousel/sky-carousel.d.ts +0 -265
  88. package/dist/sky-carousel/sky-carousel.js +0 -211
  89. package/dist/sky-carousel/sky-carousel.js.map +0 -1
  90. package/dist/sky-counter/index.d.ts +0 -1
  91. package/dist/sky-counter/index.js +0 -1
  92. package/dist/sky-counter/sky-counter.d.ts +0 -130
  93. package/dist/sky-counter/sky-counter.js +0 -101
  94. package/dist/sky-counter/sky-counter.js.map +0 -1
  95. package/dist/sky-drawer/index.d.ts +0 -1
  96. package/dist/sky-drawer/index.js +0 -1
  97. package/dist/sky-drawer/sky-drawer.d.ts +0 -161
  98. package/dist/sky-drawer/sky-drawer.js +0 -175
  99. package/dist/sky-drawer/sky-drawer.js.map +0 -1
  100. package/dist/sky-dropdown/index.d.ts +0 -1
  101. package/dist/sky-dropdown/index.js +0 -1
  102. package/dist/sky-dropdown/sky-dropdown.d.ts +0 -254
  103. package/dist/sky-dropdown/sky-dropdown.js +0 -61
  104. package/dist/sky-dropdown/sky-dropdown.js.map +0 -1
  105. package/dist/sky-dropdown-item/index.d.ts +0 -1
  106. package/dist/sky-dropdown-item/index.js +0 -1
  107. package/dist/sky-dropdown-item/sky-dropdown-item.d.ts +0 -207
  108. package/dist/sky-dropdown-item/sky-dropdown-item.js +0 -341
  109. package/dist/sky-dropdown-item/sky-dropdown-item.js.map +0 -1
  110. package/dist/sky-flexbar/index.d.ts +0 -1
  111. package/dist/sky-flexbar/index.js +0 -1
  112. package/dist/sky-flexbar/sky-flexbar.d.ts +0 -189
  113. package/dist/sky-flexbar/sky-flexbar.js +0 -157
  114. package/dist/sky-flexbar/sky-flexbar.js.map +0 -1
  115. package/dist/sky-flexitem/index.d.ts +0 -1
  116. package/dist/sky-flexitem/index.js +0 -1
  117. package/dist/sky-flexitem/sky-flexitem.d.ts +0 -114
  118. package/dist/sky-flexitem/sky-flexitem.js +0 -52
  119. package/dist/sky-flexitem/sky-flexitem.js.map +0 -1
  120. package/dist/sky-navbar/index.d.ts +0 -1
  121. package/dist/sky-navbar/index.js +0 -1
  122. package/dist/sky-navbar/sky-navbar.d.ts +0 -211
  123. package/dist/sky-navbar/sky-navbar.js +0 -521
  124. package/dist/sky-navbar/sky-navbar.js.map +0 -1
  125. package/dist/sky-navpanel/index.d.ts +0 -1
  126. package/dist/sky-navpanel/index.js +0 -1
  127. package/dist/sky-navpanel/sky-navpanel.d.ts +0 -187
  128. package/dist/sky-navpanel/sky-navpanel.js +0 -404
  129. package/dist/sky-navpanel/sky-navpanel.js.map +0 -1
  130. package/dist/sky-notification/index.d.ts +0 -1
  131. package/dist/sky-notification/index.js +0 -1
  132. package/dist/sky-notification/sky-notification.d.ts +0 -152
  133. package/dist/sky-notification/sky-notification.js +0 -456
  134. package/dist/sky-notification/sky-notification.js.map +0 -1
  135. package/dist/sky-otp/index.d.ts +0 -1
  136. package/dist/sky-otp/index.js +0 -1
  137. package/dist/sky-otp/sky-otp.d.ts +0 -101
  138. package/dist/sky-otp/sky-otp.js +0 -96
  139. package/dist/sky-otp/sky-otp.js.map +0 -1
  140. package/dist/sky-overlay/index.d.ts +0 -1
  141. package/dist/sky-overlay/index.js +0 -1
  142. package/dist/sky-overlay/sky-overlay.d.ts +0 -71
  143. package/dist/sky-overlay/sky-overlay.js +0 -26
  144. package/dist/sky-overlay/sky-overlay.js.map +0 -1
  145. package/dist/sky-pagination/index.d.ts +0 -1
  146. package/dist/sky-pagination/index.js +0 -1
  147. package/dist/sky-pagination/sky-pagination.d.ts +0 -167
  148. package/dist/sky-pagination/sky-pagination.js +0 -453
  149. package/dist/sky-pagination/sky-pagination.js.map +0 -1
  150. package/dist/sky-progress/index.d.ts +0 -1
  151. package/dist/sky-progress/index.js +0 -1
  152. package/dist/sky-progress/sky-progress.d.ts +0 -70
  153. package/dist/sky-progress/sky-progress.js +0 -87
  154. package/dist/sky-progress/sky-progress.js.map +0 -1
  155. package/dist/sky-radio-group/index.d.ts +0 -1
  156. package/dist/sky-radio-group/index.js +0 -1
  157. package/dist/sky-radio-group/sky-radio-group.d.ts +0 -186
  158. package/dist/sky-radio-group/sky-radio-group.js +0 -239
  159. package/dist/sky-radio-group/sky-radio-group.js.map +0 -1
  160. package/dist/sky-range/index.d.ts +0 -1
  161. package/dist/sky-range/index.js +0 -1
  162. package/dist/sky-range/sky-range.d.ts +0 -110
  163. package/dist/sky-range/sky-range.js +0 -196
  164. package/dist/sky-range/sky-range.js.map +0 -1
  165. package/dist/sky-serial/index.d.ts +0 -1
  166. package/dist/sky-serial/index.js +0 -1
  167. package/dist/sky-serial/sky-serial.d.ts +0 -127
  168. package/dist/sky-serial/sky-serial.js +0 -133
  169. package/dist/sky-serial/sky-serial.js.map +0 -1
  170. package/dist/sky-skeleton/index.d.ts +0 -1
  171. package/dist/sky-skeleton/index.js +0 -1
  172. package/dist/sky-skeleton/sky-skeleton.d.ts +0 -80
  173. package/dist/sky-skeleton/sky-skeleton.js +0 -233
  174. package/dist/sky-skeleton/sky-skeleton.js.map +0 -1
  175. package/dist/sky-slider/index.d.ts +0 -1
  176. package/dist/sky-slider/index.js +0 -1
  177. package/dist/sky-slider/sky-slider.d.ts +0 -96
  178. package/dist/sky-slider/sky-slider.js +0 -139
  179. package/dist/sky-slider/sky-slider.js.map +0 -1
  180. package/dist/sky-speeddial/index.d.ts +0 -1
  181. package/dist/sky-speeddial/index.js +0 -1
  182. package/dist/sky-speeddial/sky-speeddial.d.ts +0 -86
  183. package/dist/sky-speeddial/sky-speeddial.js +0 -154
  184. package/dist/sky-speeddial/sky-speeddial.js.map +0 -1
  185. package/dist/sky-spinner/index.d.ts +0 -1
  186. package/dist/sky-spinner/index.js +0 -1
  187. package/dist/sky-spinner/sky-spinner.d.ts +0 -87
  188. package/dist/sky-spinner/sky-spinner.js +0 -334
  189. package/dist/sky-spinner/sky-spinner.js.map +0 -1
  190. package/dist/sky-steps/index.d.ts +0 -1
  191. package/dist/sky-steps/index.js +0 -1
  192. package/dist/sky-steps/sky-steps.d.ts +0 -170
  193. package/dist/sky-steps/sky-steps.js +0 -455
  194. package/dist/sky-steps/sky-steps.js.map +0 -1
  195. package/dist/sky-switch/index.d.ts +0 -1
  196. package/dist/sky-switch/index.js +0 -1
  197. package/dist/sky-switch/sky-switch.d.ts +0 -116
  198. package/dist/sky-switch/sky-switch.js +0 -191
  199. package/dist/sky-switch/sky-switch.js.map +0 -1
  200. package/dist/sky-tab/index.d.ts +0 -1
  201. package/dist/sky-tab/index.js +0 -1
  202. package/dist/sky-tab/sky-tab.d.ts +0 -188
  203. package/dist/sky-tab/sky-tab.js +0 -390
  204. package/dist/sky-tab/sky-tab.js.map +0 -1
  205. package/dist/sky-tab-button/index.d.ts +0 -1
  206. package/dist/sky-tab-button/index.js +0 -1
  207. package/dist/sky-tab-button/sky-tab-button.d.ts +0 -114
  208. package/dist/sky-tab-button/sky-tab-button.js +0 -167
  209. package/dist/sky-tab-button/sky-tab-button.js.map +0 -1
  210. package/dist/sky-theme-switcher/index.d.ts +0 -1
  211. package/dist/sky-theme-switcher/index.js +0 -1
  212. package/dist/sky-theme-switcher/sky-theme-switcher.d.ts +0 -92
  213. package/dist/sky-theme-switcher/sky-theme-switcher.js +0 -43
  214. package/dist/sky-theme-switcher/sky-theme-switcher.js.map +0 -1
  215. package/dist/sky-tooltip/index.d.ts +0 -1
  216. package/dist/sky-tooltip/index.js +0 -1
  217. package/dist/sky-tooltip/sky-tooltip.d.ts +0 -156
  218. package/dist/sky-tooltip/sky-tooltip.js +0 -242
  219. package/dist/sky-tooltip/sky-tooltip.js.map +0 -1
@@ -1,196 +0,0 @@
1
- import{__decorate as t,__metadata as i}from"tslib";import{LitElement as e,css as s,html as r}from"lit";import{property as a,customElement as o}from"lit/decorators.js";import{when as n}from"lit/directives/when.js";import{styleMap as h}from"lit/directives/style-map.js";let p=class extends e{constructor(){super(...arguments),this.from=20,this.to=80,this.min=0,this.max=100,this.step=10,this.label="",this.disabled=!1,this.prefix="",this.suffix="",this.shadow=!1,this.commitOnly=!1,this.showValue=!0,this._lastCommittedFrom=this.from,this._lastCommittedTo=this.to}static{this.styles=s`
2
- :host {
3
- display: flex;
4
- flex-direction: column;
5
- align-items: center;
6
- width: 100%;
7
- font-family: var(--sky-font);
8
- font-weight: 400;
9
- }
10
-
11
- .range-container {
12
- display: flex;
13
- flex-direction: column;
14
- align-items: flex-start;
15
- width: 100%;
16
- padding: 8px;
17
- gap: 4px;
18
- box-sizing: border-box;
19
- position: relative;
20
- border-radius: var(--sky-radius-primary);
21
- }
22
-
23
- /* Only apply glass/shadow if shadow prop is set */
24
- .range-container[shadow] {
25
- background: var(--sky-glass-primary);
26
- box-shadow: var(--sky-box-shadow-primary);
27
- border: var(--sky-border-primary);
28
-
29
- }
30
-
31
- .range-container[shadow]::before {
32
- content: "";
33
- position: absolute;
34
- inset: 0;
35
- z-index: -1;
36
- border-radius: inherit;
37
- backdrop-filter: var(--sky-blur-primary) var(--sky-brightness-primary)
38
- var(--sky-saturation-primary);
39
- -webkit-backdrop-filter: var(--sky-blur-primary)
40
- var(--sky-brightness-primary) var(--sky-saturation-primary);
41
- }
42
-
43
- .range-label {
44
- font-size: 14px;
45
- font-weight: inherit;
46
- color: var(--sky-text-primary);
47
- text-align: center;
48
- }
49
-
50
- .slider-container {
51
- position: relative;
52
- width: 100%;
53
- height: 14px;
54
- }
55
-
56
- .track {
57
- position: absolute;
58
- width: 100%;
59
- height: 3px;
60
- background: var(--sky-hover-primary);
61
- top: 50%;
62
- transform: translateY(-50%);
63
- border-radius: 6px;
64
- }
65
-
66
- .range-highlight {
67
- position: absolute;
68
- height: 3px;
69
- background: var(--sky-active-primary);
70
- border-radius: 6px;
71
- top: 50%;
72
- transform: translateY(-50%);
73
- }
74
-
75
- .range-value {
76
- font-size: 14px;
77
- color: var(--sky-text-primary);
78
- font-weight: inherit;
79
- }
80
-
81
- sky-icon {
82
- display: inline-block;
83
- width: 1em;
84
- height: 1em;
85
- }
86
-
87
- input[type="range"] {
88
- position: absolute;
89
- width: 100%;
90
- left: 0;
91
- height: 14px;
92
- -webkit-appearance: none;
93
- appearance: none;
94
- background: transparent;
95
- pointer-events: none; /* thumbs capture events */
96
- margin: 0;
97
- }
98
-
99
- .prefix,
100
- .suffix {
101
- color: var(--sky-text-secondary);
102
- font-size: 14px;
103
- font-weight: inherit;
104
- }
105
-
106
- input[type="range"]::-webkit-slider-thumb {
107
- pointer-events: auto;
108
- -webkit-appearance: none;
109
- appearance: none;
110
- width: 14px;
111
- height: 14px;
112
- background: var(--sky-glass-solid);
113
- border: 5px solid var(--sky-active-primary-dark);
114
- border-radius: 50%;
115
- cursor: pointer;
116
- box-shadow: var(--sky-box-shadow-primary);
117
- transition:
118
- transform 0.3s ease,
119
- box-shadow 0.3s ease;
120
- }
121
-
122
- input[type="range"]::-moz-range-thumb {
123
- pointer-events: auto;
124
- width: 14px;
125
- height: 14px;
126
- background: var(--sky-active-primary-dark);
127
- border-radius: 50%;
128
- cursor: pointer;
129
- }
130
-
131
- .range-container[disabled] {
132
- pointer-events: none;
133
- opacity: 0.6;
134
- }
135
- `}roundToStep(t){const i=this.step>0?this.step:1;return Math.round(t/i)*i}clamp(t){return Math.min(this.max,Math.max(this.min,t))}onFromInput(t){const i=t.target,e=Number(i.value),s=this.clamp(e);if(s>=this.to)return;if(this.commitOnly)return void(this.from=s);const r=this.roundToStep(s);r>=this.to||r!==this.from&&(this.from=r,this._lastCommittedFrom=r,this.dispatchRangeChange())}onFromChange(t){const i=t.target,e=Number(i.value),s=this.clamp(e),r=this.roundToStep(s);r>=this.to?i.value=String(this.from):(this.from=r,i.value=String(this.from),this.commitOnly&&r!==this._lastCommittedFrom&&(this._lastCommittedFrom=r,this.dispatchRangeChange()))}onToInput(t){const i=t.target,e=Number(i.value),s=this.clamp(e);if(s<=this.from)return;if(this.commitOnly)return void(this.to=s);const r=this.roundToStep(s);r<=this.from||r!==this.to&&(this.to=r,this._lastCommittedTo=r,this.dispatchRangeChange())}onToChange(t){const i=t.target,e=Number(i.value),s=this.clamp(e),r=this.roundToStep(s);r<=this.from?i.value=String(this.to):(this.to=r,i.value=String(this.to),this.commitOnly&&r!==this._lastCommittedTo&&(this._lastCommittedTo=r,this.dispatchRangeChange()))}dispatchRangeChange(){this.dispatchEvent(new CustomEvent("range-changed",{detail:{from:this.from,to:this.to},bubbles:!0,composed:!0}))}setRange(t,i){const e=this.roundToStep(this.clamp(t)),s=this.roundToStep(this.clamp(i));e>=s||(this.from=e,this.to=s,this._lastCommittedFrom=e,this._lastCommittedTo=s,this.dispatchRangeChange())}render(){const t=this.closest('[dir="rtl"]')||"rtl"===document.dir,i=Math.max(1,this.max-this.min),e=(this.from-this.min)/i*100,s=(this.to-this.min)/i*100,a=Math.max(0,s-e);return r`
136
- <div
137
- class="range-container"
138
- part="container"
139
- ?disabled="${this.disabled}"
140
- ?shadow="${this.shadow}"
141
- aria-disabled="${this.disabled?"true":"false"}"
142
- >
143
- ${n(this.showValue||""!==this.label,()=>r`
144
- <div
145
- style="display:flex;align-items:center;gap:5px;justify-content:space-between;width:100%;"
146
- >
147
- ${n(this.label,()=>r`<div class="range-label" part="label">${this.label}</div>`)}
148
- ${n(this.showValue,()=>r`
149
- <div class="range-value" part="value">
150
- <span class="prefix">${this.prefix}</span>
151
- ${this.from.toFixed(2)}<span class="suffix">${this.suffix}</span>
152
- -
153
- <span class="prefix">${this.prefix}</span>
154
- ${this.to.toFixed(2)}<span class="suffix">${this.suffix}</span>
155
- </div>
156
- `)}
157
- </div>
158
- `)}
159
-
160
- <div class="slider-container" part="slider-container">
161
- <div class="track" part="track"></div>
162
- <div
163
- class="range-highlight"
164
- part="highlight"
165
- style=${h(t?{right:`${e}%`,width:`${a}%`}:{left:`${e}%`,width:`${a}%`})}
166
- ></div>
167
-
168
- <input
169
- part="slider-from"
170
- type="range"
171
- ?disabled="${this.disabled}"
172
- min="${this.min}"
173
- max="${this.max}"
174
- step="${this.step}"
175
- .value="${String(this.from)}"
176
- @input="${this.onFromInput}"
177
- @change="${this.onFromChange}"
178
- aria-label="${this.label?`${this.label} from`:"From"}"
179
- />
180
-
181
- <input
182
- part="slider-to"
183
- type="range"
184
- ?disabled="${this.disabled}"
185
- min="${this.min}"
186
- max="${this.max}"
187
- step="${this.step}"
188
- .value="${String(this.to)}"
189
- @input="${this.onToInput}"
190
- @change="${this.onToChange}"
191
- aria-label="${this.label?`${this.label} to`:"To"}"
192
- />
193
- </div>
194
- </div>
195
- `}};t([a({type:Number}),i("design:type",Object)],p.prototype,"from",void 0),t([a({type:Number}),i("design:type",Object)],p.prototype,"to",void 0),t([a({type:Number}),i("design:type",Object)],p.prototype,"min",void 0),t([a({type:Number}),i("design:type",Object)],p.prototype,"max",void 0),t([a({type:Number}),i("design:type",Object)],p.prototype,"step",void 0),t([a({type:String}),i("design:type",Object)],p.prototype,"label",void 0),t([a({type:Boolean,reflect:!0}),i("design:type",Object)],p.prototype,"disabled",void 0),t([a({type:String}),i("design:type",Object)],p.prototype,"prefix",void 0),t([a({type:String}),i("design:type",Object)],p.prototype,"suffix",void 0),t([a({type:Boolean,reflect:!0}),i("design:type",Object)],p.prototype,"shadow",void 0),t([a({type:Boolean,reflect:!0}),i("design:type",Object)],p.prototype,"commitOnly",void 0),t([a({type:Boolean,reflect:!0}),i("design:type",Object)],p.prototype,"showValue",void 0),p=t([o("sky-range")],p);export{p as SkyRange};
196
- //# sourceMappingURL=sky-range.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"sky-range.js","sources":["../../src/sky-range/sky-range.ts"],"sourcesContent":[null],"names":["SkyRange","LitElement","constructor","this","from","to","min","max","step","label","disabled","prefix","suffix","shadow","commitOnly","showValue","_lastCommittedFrom","_lastCommittedTo","styles","css","roundToStep","value","Math","round","clamp","onFromInput","event","input","target","raw","Number","clamped","snapped","dispatchRangeChange","onFromChange","String","onToInput","onToChange","dispatchEvent","CustomEvent","detail","bubbles","composed","setRange","nextFrom","nextTo","render","isRTL","closest","document","dir","range","fromOffset","toOffset","width","html","when","toFixed","styleMap","right","left","__decorate","property","type","prototype","Boolean","reflect","customElement"],"mappings":"4QAoEO,IAAMA,EAAN,cAAuBC,EAAvB,WAAAC,uBAEuBC,KAAAC,KAAO,GAEPD,KAAAE,GAAK,GAELF,KAAAG,IAAM,EAENH,KAAAI,IAAM,IAENJ,KAAAK,KAAO,GAEPL,KAAAM,MAAQ,GAEQN,KAAAO,UAAW,EAE3BP,KAAAQ,OAAS,GAETR,KAAAS,OAAS,GAEOT,KAAAU,QAAS,EAETV,KAAAW,YAAa,EAEbX,KAAAY,WAAY,EAEhDZ,KAAAa,mBAAqBb,KAAKC,KAC1BD,KAAAc,iBAAmBd,KAAKE,EAqWlC,QAnWkBF,KAAAe,OAASC,CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsI1B,CAGM,WAAAC,CAAYC,GAClB,MAAMb,EAAOL,KAAKK,KAAO,EAAIL,KAAKK,KAAO,EACzC,OAAOc,KAAKC,MAAMF,EAAQb,GAAQA,CACpC,CAGQ,KAAAgB,CAAMH,GACZ,OAAOC,KAAKhB,IAAIH,KAAKI,IAAKe,KAAKf,IAAIJ,KAAKG,IAAKe,GAC/C,CAGQ,WAAAI,CAAYC,GAClB,MAAMC,EAAQD,EAAME,OACdC,EAAMC,OAAOH,EAAMN,OACnBU,EAAU5B,KAAKqB,MAAMK,GAG3B,GAAIE,GAAW5B,KAAKE,GAAI,OAExB,GAAIF,KAAKW,WAGP,YADAX,KAAKC,KAAO2B,GAId,MAAMC,EAAU7B,KAAKiB,YAAYW,GAC7BC,GAAW7B,KAAKE,IAEhB2B,IAAY7B,KAAKC,OACnBD,KAAKC,KAAO4B,EAEZ7B,KAAKa,mBAAqBgB,EAC1B7B,KAAK8B,sBAET,CAGQ,YAAAC,CAAaR,GACnB,MAAMC,EAAQD,EAAME,OACdC,EAAMC,OAAOH,EAAMN,OACnBU,EAAU5B,KAAKqB,MAAMK,GACrBG,EAAU7B,KAAKiB,YAAYW,GAE7BC,GAAW7B,KAAKE,GAElBsB,EAAMN,MAAQc,OAAOhC,KAAKC,OAI5BD,KAAKC,KAAO4B,EACZL,EAAMN,MAAQc,OAAOhC,KAAKC,MAErBD,KAAKW,YAKNkB,IAAY7B,KAAKa,qBACnBb,KAAKa,mBAAqBgB,EAC1B7B,KAAK8B,uBAET,CAGQ,SAAAG,CAAUV,GAChB,MAAMC,EAAQD,EAAME,OACdC,EAAMC,OAAOH,EAAMN,OACnBU,EAAU5B,KAAKqB,MAAMK,GAG3B,GAAIE,GAAW5B,KAAKC,KAAM,OAE1B,GAAID,KAAKW,WAEP,YADAX,KAAKE,GAAK0B,GAIZ,MAAMC,EAAU7B,KAAKiB,YAAYW,GAC7BC,GAAW7B,KAAKC,MAEhB4B,IAAY7B,KAAKE,KACnBF,KAAKE,GAAK2B,EAEV7B,KAAKc,iBAAmBe,EACxB7B,KAAK8B,sBAET,CAGQ,UAAAI,CAAWX,GACjB,MAAMC,EAAQD,EAAME,OACdC,EAAMC,OAAOH,EAAMN,OACnBU,EAAU5B,KAAKqB,MAAMK,GACrBG,EAAU7B,KAAKiB,YAAYW,GAE7BC,GAAW7B,KAAKC,KAClBuB,EAAMN,MAAQc,OAAOhC,KAAKE,KAI5BF,KAAKE,GAAK2B,EACVL,EAAMN,MAAQc,OAAOhC,KAAKE,IAErBF,KAAKW,YAKNkB,IAAY7B,KAAKc,mBACnBd,KAAKc,iBAAmBe,EACxB7B,KAAK8B,uBAET,CAGQ,mBAAAA,GACN9B,KAAKmC,cACH,IAAIC,YAAmC,gBAAiB,CACtDC,OAAQ,CAAEpC,KAAMD,KAAKC,KAAMC,GAAIF,KAAKE,IACpCoC,SAAS,EACTC,UAAU,IAGhB,CAEO,QAAAC,CAASvC,EAAcC,GAC5B,MAAMuC,EAAWzC,KAAKiB,YAAYjB,KAAKqB,MAAMpB,IACvCyC,EAAS1C,KAAKiB,YAAYjB,KAAKqB,MAAMnB,IACvCuC,GAAYC,IAChB1C,KAAKC,KAAOwC,EACZzC,KAAKE,GAAKwC,EACV1C,KAAKa,mBAAqB4B,EAC1BzC,KAAKc,iBAAmB4B,EACxB1C,KAAK8B,sBACP,CAES,MAAAa,GACP,MAAMC,EAAQ5C,KAAK6C,QAAQ,gBAAmC,QAAjBC,SAASC,IAChDC,EAAQ7B,KAAKf,IAAI,EAAGJ,KAAKI,IAAMJ,KAAKG,KACpC8C,GAAejD,KAAKC,KAAOD,KAAKG,KAAO6C,EAAS,IAChDE,GAAalD,KAAKE,GAAKF,KAAKG,KAAO6C,EAAS,IAC5CG,EAAQhC,KAAKf,IAAI,EAAG8C,EAAWD,GAErC,OAAOG,CAAI;;;;qBAIMpD,KAAKO;mBACPP,KAAKU;yBACCV,KAAKO,SAAW,OAAS;;UAExC8C,EACArD,KAAKY,WAA4B,KAAfZ,KAAKM,MACvB,IAAM8C,CAAI;;;;gBAIJC,EACArD,KAAKM,MACL,IAAM8C,CAAI,yCAAyCpD,KAAKM;gBAExD+C,EACArD,KAAKY,UACL,IAAMwC,CAAI;;2CAEiBpD,KAAKQ;sBAC1BR,KAAKC,KAAKqD,QAAQ,0BAA0BtD,KAAKS;;2CAE5BT,KAAKQ;sBAC1BR,KAAKE,GAAGoD,QAAQ,0BAA0BtD,KAAKS;;;;;;;;;;;oBAajD8C,EACNX,EACI,CAAEY,MAAO,GAAGP,KAAeE,MAAO,GAAGA,MACrC,CAAEM,KAAM,GAAGR,KAAeE,MAAO,GAAGA;;;;;;yBAO7BnD,KAAKO;mBACXP,KAAKG;mBACLH,KAAKI;oBACJJ,KAAKK;sBACH2B,OAAOhC,KAAKC;sBACZD,KAAKsB;uBACJtB,KAAK+B;0BACF/B,KAAKM,MAAQ,GAAGN,KAAKM,aAAe;;;;;;yBAMrCN,KAAKO;mBACXP,KAAKG;mBACLH,KAAKI;oBACJJ,KAAKK;sBACH2B,OAAOhC,KAAKE;sBACZF,KAAKiC;uBACJjC,KAAKkC;0BACFlC,KAAKM,MAAQ,GAAGN,KAAKM,WAAa;;;;KAK1D,GA7X4BoD,EAAA,CAA3BC,EAAS,CAAEC,KAAMjC,kCAAoB9B,EAAAgE,UAAA,eAEVH,EAAA,CAA3BC,EAAS,CAAEC,KAAMjC,kCAAkB9B,EAAAgE,UAAA,aAERH,EAAA,CAA3BC,EAAS,CAAEC,KAAMjC,kCAAkB9B,EAAAgE,UAAA,cAERH,EAAA,CAA3BC,EAAS,CAAEC,KAAMjC,kCAAoB9B,EAAAgE,UAAA,cAEVH,EAAA,CAA3BC,EAAS,CAAEC,KAAMjC,kCAAoB9B,EAAAgE,UAAA,eAEVH,EAAA,CAA3BC,EAAS,CAAEC,KAAM5B,kCAAqBnC,EAAAgE,UAAA,gBAEKH,EAAA,CAA3CC,EAAS,CAAEC,KAAME,QAASC,SAAS,6BAAyBlE,EAAAgE,UAAA,mBAEjCH,EAAA,CAA3BC,EAAS,CAAEC,KAAM5B,kCAAsBnC,EAAAgE,UAAA,iBAEZH,EAAA,CAA3BC,EAAS,CAAEC,KAAM5B,kCAAsBnC,EAAAgE,UAAA,iBAEIH,EAAA,CAA3CC,EAAS,CAAEC,KAAME,QAASC,SAAS,6BAAuBlE,EAAAgE,UAAA,iBAEfH,EAAA,CAA3CC,EAAS,CAAEC,KAAME,QAASC,SAAS,6BAA2BlE,EAAAgE,UAAA,qBAEnBH,EAAA,CAA3CC,EAAS,CAAEC,KAAME,QAASC,SAAS,6BAAyBlE,EAAAgE,UAAA,oBAxBlDhE,EAAQ6D,EAAA,CADpBM,EAAc,cACFnE"}
@@ -1 +0,0 @@
1
- export * from "./sky-serial";
@@ -1 +0,0 @@
1
- export * from './sky-serial.js';
@@ -1,127 +0,0 @@
1
- import { PropertyValues } from "lit";
2
- import { FormControlBase, FormState } from "../helper/internals/form-control-base";
3
- export type SkySerialValidation = (value: string) => true | string;
4
- export type SkySerialValueChangedDetail = {
5
- value: string;
6
- };
7
- export type SkySerialValueClearedDetail = {
8
- value: "";
9
- };
10
- export type SkySerialValidationErrorDetail = {
11
- errors: string[];
12
- };
13
- /**
14
- * @element sky-serial
15
- *
16
- * @summary Segmented serial/OTP input with separators, masking, and validation support.
17
- *
18
- * @status stable
19
- * @since 1.0.0
20
- *
21
- * @documentation https://library.sky-ui.com/components/serial
22
- *
23
- * @uiVModel value value-changed
24
- *
25
- * @slot - (No slots) — Content is internally rendered.
26
- *
27
- * @csspart wrapper - The flex wrapper around groups and separators.
28
- * @csspart group - A group of input boxes between separators.
29
- * @csspart input - An individual digit/char input.
30
- * @csspart separator - The visual separator between groups.
31
- * @csspart error - The validation error text element.
32
- *
33
- * @property {number} length - Total number of character boxes.
34
- * @property {string} separator - Separator character inserted between groups.
35
- * @property {number[]} separatorPositions - Indices after which separators are inserted.
36
- * @property {boolean} alphanumeric - Allows alphanumeric characters instead of digits only.
37
- * @property {string} value - Canonical component value.
38
- * @property {SkySerialValidation[]} validations - Validation functions that return `true` or an error message.
39
- * @property {string[]} validationErrors - Collected validation messages.
40
- * @property {boolean} showErrors - Controls error text rendering.
41
- * @property {boolean} validationActive - Enables active validation state.
42
- * @property {boolean} withSeparator - Includes separators in emitted `value`.
43
- * @property {boolean} masked - Masks entered characters in input fields.
44
- *
45
- * @fires {CustomEvent<SkySerialValueChangedDetail>} value-changed - Fired when a committed value changes.
46
- * @fires {CustomEvent<SkySerialValueClearedDetail>} value-cleared - Fired when `reset()` clears the value.
47
- * @fires {CustomEvent<SkySerialValidationErrorDetail>} validation-error - Fired with current validation errors.
48
- *
49
- * @Behavior
50
- * - Updates UI live while typing and emits `value-changed` only on commit.
51
- * - Supports grouped input with optional separators in public value.
52
- * - Integrates with `FormControlBase` for form value and validity synchronization.
53
- *
54
- * @example
55
- * ```html
56
- * <sky-serial length="10" separator="-" separator-positions="[3,6]" with-separator show-errors validation-active></sky-serial>
57
- * ```
58
- * ```vue
59
- * <template>
60
- * <sky-serial :length="10" separator="-" :separator-positions="[3,6]" with-separator show-errors validation-active></sky-serial>
61
- * </template>
62
- * ```
63
- * ```jsx
64
- * export default function Demo() {
65
- * return <sky-serial length={10} separator="-" separator-positions={[3, 6]} with-separator show-errors validation-active></sky-serial>;
66
- * }
67
- * ```
68
- */
69
- export declare class SkySerial extends FormControlBase {
70
- length: number;
71
- separator: string;
72
- /** raw indices AFTER which separator is inserted (e.g. [3,6] => 4-3-... style) */
73
- separatorPositions: number[];
74
- alphanumeric: boolean;
75
- /**
76
- * Canonical value (with or without separators based on withSeparator).
77
- * NOTE: This is the "public" value string.
78
- */
79
- value: string;
80
- validations: SkySerialValidation[];
81
- validationErrors: string[];
82
- showErrors: boolean;
83
- validationActive: boolean;
84
- withSeparator: boolean;
85
- masked: boolean;
86
- invalid: boolean;
87
- /** Non-reactive buffer (unmasked chars only) */
88
- private displayValues;
89
- private _lastCommitted;
90
- constructor();
91
- static styles: import("lit").CSSResult;
92
- firstUpdated(): void;
93
- protected willUpdate(changed: PropertyValues<this>): void;
94
- protected getFormValue(): FormState;
95
- protected setValueFromFormState(state: FormState): void;
96
- protected getValidityAnchor(): HTMLElement | undefined;
97
- protected isEmpty(): boolean;
98
- protected getNativeControl(): HTMLElement | null;
99
- /**
100
- * IMPORTANT: PURE — do not mutate reactive state here.
101
- * Return first error string if any, else "".
102
- */
103
- protected validateForForm(): string;
104
- protected onFormReset(): void;
105
- /** Live typing updates display buffer + public value, but DOES NOT emit. */
106
- private handleInput;
107
- private handleKeydown;
108
- private handlePaste;
109
- /** Commit => validate, sync form value+validity, emit if changed */
110
- protected commit(): void;
111
- /** Clear all characters and emit once + form sync. */
112
- reset(): void;
113
- focus(): void;
114
- /** Keep your public validateInput() API (manual validation trigger) */
115
- validateInput(): boolean;
116
- private computeValidationErrors;
117
- /** Strip separators, enforce numeric/alphanumeric, clamp to length. */
118
- private normalizeRaw;
119
- private addSeparators;
120
- private ensureDisplayBuffer;
121
- private syncDisplayFromValue;
122
- private getRawFromDisplay;
123
- private applyInputsFromDisplay;
124
- private applyInvalidClass;
125
- private renderInputFields;
126
- render(): import("lit-html").TemplateResult<1>;
127
- }
@@ -1,133 +0,0 @@
1
- import{__decorate as t,__metadata as i}from"tslib";import{css as s,html as a}from"lit";import{property as e,customElement as r}from"lit/decorators.js";import{live as o}from"lit/directives/live.js";import{FormControlBase as l}from"../helper/internals/form-control-base.js";let n=class extends l{constructor(){super(),this.length=10,this.separator="-",this.separatorPositions=[3],this.alphanumeric=!1,this.value="",this.validations=[],this.validationErrors=[],this.showErrors=!1,this.validationActive=!1,this.withSeparator=!1,this.masked=!1,this.invalid=!1,this.displayValues=[],this._lastCommitted="",this.addEventListener("focusout",t=>{if(!this.shadowRoot)return;const i=t.relatedTarget;!!i&&this.shadowRoot.contains(i)||this.commit()})}static{this.styles=s`
2
- :host {
3
- display: block;
4
- font-family: var(--sky-font);
5
- position: relative;
6
- }
7
-
8
- .input-wrapper {
9
- display: flex;
10
- flex-wrap: wrap;
11
- gap: 8px;
12
- align-items: center;
13
- justify-content: center;
14
- }
15
-
16
- .input-wrapper.shake {
17
- animation: shake 0.3s ease-in-out 1;
18
- }
19
-
20
- @keyframes shake {
21
- 0% {
22
- transform: translateX(0);
23
- }
24
- 25% {
25
- transform: translateX(-3px);
26
- }
27
- 50% {
28
- transform: translateX(3px);
29
- }
30
- 75% {
31
- transform: translateX(-3px);
32
- }
33
- 100% {
34
- transform: translateX(0);
35
- }
36
- }
37
-
38
- .group {
39
- display: flex;
40
- gap: 8px;
41
- }
42
-
43
- input {
44
- width: 20px;
45
- height: 20px;
46
- text-align: center;
47
- font-size: var(--sky-font-size-md);
48
- border-radius: var(--sky-radius-primary);
49
- font-family: var(--sky-font);
50
- padding: 5px;
51
- border: var(--sky-border-primary);
52
- box-shadow: var(--sky-box-shadow-primary);
53
- backdrop-filter: var(--sky-blur-primary) var(--sky-brightness-primary)
54
- var(--sky-saturation-primary);
55
- -webkit-backdrop-filter: var(--sky-blur-primary)
56
- var(--sky-brightness-primary) var(--sky-saturation-primary);
57
- background: transparent;
58
- color: var(--sky-text-primary);
59
- transition: all 0.2s ease-in-out;
60
- vertical-align: middle;
61
-
62
- }
63
-
64
- input.invalid {
65
- box-shadow: 0 2px 12px
66
- color-mix(in srgb, var(--sky-danger-primary) 30%, transparent);
67
- }
68
-
69
- input:focus {
70
- outline: none;
71
- border-color: transparent;
72
- box-shadow: 0 2px 12px
73
- color-mix(in srgb, var(--sky-active-primary) 30%, transparent);
74
- }
75
-
76
- .separator {
77
- font-size: var(--sky-font-size-lg);
78
- padding: 0 5px;
79
- color: var(--sky-active-primary);
80
- }
81
-
82
- .error-message {
83
- position: absolute;
84
- font-size: var(--sky-font-size-xs);
85
- color: var(--sky-danger-primary);
86
- white-space: nowrap;
87
- overflow: hidden;
88
- text-overflow: ellipsis;
89
- pointer-events: none;
90
- margin-left: 5px;
91
- width: 100%;
92
- text-align: start;
93
- }
94
- :dir(rtl) .error-message {
95
- right: 0;
96
- margin-right: 5px;
97
- margin-left: unset;
98
- }
99
- `}firstUpdated(){this.captureDefaultValue(this.value??""),this.ensureDisplayBuffer(),this.syncDisplayFromValue(),this.syncFormValue(),this.syncValidity()}willUpdate(t){if(t.has("length")||t.has("separator")||t.has("separatorPositions")||t.has("alphanumeric")||t.has("withSeparator")||t.has("value")){this.ensureDisplayBuffer();const i=this.normalizeRaw(this.value??""),s=this.withSeparator?this.addSeparators(i):i;(this.value??"")!==s&&(this.value=s),this.displayValues=Array.from({length:this.length},(t,s)=>i[s]??""),t.has("value")&&(this._lastCommitted=s)}}getFormValue(){if(!this.name||this.disabled)return null;const t=this.getRawFromDisplay();return this.withSeparator?this.addSeparators(t):t}setValueFromFormState(t){const i="string"==typeof t?t:"",s=this.normalizeRaw(i??""),a=this.withSeparator?this.addSeparators(s):s;this.value=a,this.ensureDisplayBuffer(),this.displayValues=Array.from({length:this.length},(t,i)=>s[i]??""),this._lastCommitted=a,queueMicrotask(()=>this.applyInputsFromDisplay())}getValidityAnchor(){return this.shadowRoot?.querySelector(".digit-input")??void 0}isEmpty(){return this.getRawFromDisplay().trim().length<this.length}getNativeControl(){return this.shadowRoot?.querySelector(".digit-input")??null}validateForForm(){const t=this.getRawFromDisplay(),i=this.withSeparator?this.addSeparators(t):t;return this.computeValidationErrors(i)[0]??""}onFormReset(){const t=this.normalizeRaw(this.defaultValue??""),i=this.withSeparator?this.addSeparators(t):t;this.value=i,this.validationErrors=[],this.validationActive=!1,this.invalid=!1,this.ensureDisplayBuffer(),this.displayValues=Array.from({length:this.length},(i,s)=>t[s]??""),this._lastCommitted=i,queueMicrotask(()=>{this.applyInputsFromDisplay(),this.applyInvalidClass(!1)})}handleInput(t,i){if(this.disabled||this.readonly)return void t.preventDefault();this.ensureDisplayBuffer();const s=this.shadowRoot?.querySelectorAll(".digit-input"),a=t.target,e=t,r=(("string"==typeof e.data?e.data:a.value)??"").slice(-1),o=this.alphanumeric?/^[a-zA-Z0-9]$/:/^[0-9]$/;if(r&&!o.test(r))return a.value="",this.displayValues[i]="",void(this.value=this.withSeparator?this.addSeparators(this.getRawFromDisplay()):this.getRawFromDisplay());this.displayValues[i]=r;const l=this.getRawFromDisplay();this.value=this.withSeparator?this.addSeparators(l):l,r&&s&&i<this.length-1&&s[i+1]?.focus(),r&&this.displayValues.every(t=>t.length>0)&&this.commit()}handleKeydown(t,i){const s=this.shadowRoot?.querySelectorAll(".digit-input");if(s)switch(t.key){case"Backspace":if(!s[i].value&&i>0)s[i-1].focus();else{this.ensureDisplayBuffer(),this.displayValues[i]="",s[i].value="";const t=this.getRawFromDisplay();this.value=this.withSeparator?this.addSeparators(t):t}break;case"ArrowLeft":i>0&&s[i-1].focus();break;case"ArrowRight":i<this.length-1&&s[i+1].focus();break;case"Enter":this.commit()}}handlePaste(t){if(this.disabled||this.readonly)return void t.preventDefault();t.preventDefault();const i=t.clipboardData?.getData("text")||"",s=this.normalizeRaw(i);this.ensureDisplayBuffer(),this.displayValues=Array.from({length:this.length},(t,i)=>s[i]??""),this.value=this.withSeparator?this.addSeparators(s):s,this.commit();const a=this.shadowRoot?.querySelectorAll(".digit-input");if(a){const t=this.displayValues.findIndex(t=>!t);a[t>=0?t:this.length-1].focus()}}commit(){if(this.disabled)return;const t=this.getRawFromDisplay(),i=this.withSeparator?this.addSeparators(t):t;this.validationActive=!0;const s=this.computeValidationErrors(i);this.validationErrors=s,this.dispatchEvent(new CustomEvent("validation-error",{detail:{errors:[...s]},bubbles:!0,composed:!0})),this.applyInvalidClass(s.length>0),this.invalid=s.length>0,this.syncFormValue(),this.syncValidity(),i!==this._lastCommitted&&(this._lastCommitted=i,this.dispatchEvent(new CustomEvent("value-changed",{detail:{value:i},bubbles:!0,composed:!0})))}reset(){this.disabled||(this.validationErrors=[],this.validationActive=!1,this.invalid=!1,this.ensureDisplayBuffer(),this.displayValues=Array.from({length:this.length},()=>""),this.value=(this.withSeparator,""),this._lastCommitted="",queueMicrotask(()=>{this.applyInputsFromDisplay(),this.applyInvalidClass(!1)}),this.syncFormValue(),this.syncValidity(),this.dispatchEvent(new CustomEvent("value-cleared",{detail:{value:""},bubbles:!0,composed:!0})))}focus(){const t=this.shadowRoot?.querySelector(".digit-input"),i=this.shadowRoot?.querySelector(".input-wrapper");t&&(t.focus(),i&&(i.classList.remove("shake"),i.offsetWidth,i.classList.add("shake")))}validateInput(){this.validationActive=!0;const t=this.getRawFromDisplay(),i=this.withSeparator?this.addSeparators(t):t,s=this.computeValidationErrors(i);return this.validationErrors=s,this.dispatchEvent(new CustomEvent("validation-error",{detail:{errors:[...s]},bubbles:!0,composed:!0})),this.applyInvalidClass(s.length>0),this.toggleAttribute("aria-invalid",s.length>0),this.syncFormValue(),this.syncValidity(),0===s.length}computeValidationErrors(t){const i=[];if(this.getRawFromDisplay().length<this.length)return i;if(Array.isArray(this.validations)&&this.validations.length)for(let s=0;s<this.validations.length;s++)try{const a=this.validations[s](t);!0!==a&&i.push("string"==typeof a?a:`Validation ${s} failed.`)}catch(t){i.push(`Error in validation ${s}: ${String(t?.message??t)}`)}return i}normalizeRaw(t){const i=this.separator||"-",s=(t??"").replace(new RegExp(`\\${i}`,"g"),""),a=this.alphanumeric?/[a-zA-Z0-9]/g:/\d/g;return(s.match(a)??[]).join("").slice(0,this.length)}addSeparators(t){if(!t)return"";const i=t.split("");return(Array.isArray(this.separatorPositions)?this.separatorPositions:[]).forEach((t,s)=>{t<=i.length+s&&i.splice(t+s,0,this.separator)}),i.join("")}ensureDisplayBuffer(){if(this.displayValues.length!==this.length){const t=this.displayValues;this.displayValues=Array.from({length:this.length},(i,s)=>t[s]??"")}}syncDisplayFromValue(){const t=this.normalizeRaw(this.value??"");this.displayValues=Array.from({length:this.length},(i,s)=>t[s]??"")}getRawFromDisplay(){return(this.displayValues.join("")??"").slice(0,this.length)}applyInputsFromDisplay(){const t=this.shadowRoot?.querySelectorAll(".digit-input");t&&t.forEach((t,i)=>{t.value=this.displayValues[i]??""})}applyInvalidClass(t){const i=this.shadowRoot?.querySelectorAll(".digit-input");i&&i.forEach(i=>i.classList.toggle("invalid",t))}renderInputFields(){const t=[];let i=0,s=[];const e=Array.isArray(this.separatorPositions)?this.separatorPositions:[];for(let r=0;r<this.length;r++)e[i]===r&&(t.push(a`<div class="group" part="group">${s}</div>`),t.push(a`<span class="separator" part="separator"
100
- >${this.separator}</span
101
- >`),s=[],i++),s.push(a`
102
- <input
103
- class="digit-input"
104
- part="input"
105
- .type=${this.masked?"password":"text"}
106
- maxlength="1"
107
- inputmode=${this.alphanumeric?"text":"numeric"}
108
- autocomplete=${"one-time-code"}
109
- .value=${o(this.displayValues[r]??"")}
110
- ?disabled=${this.disabled}
111
- .readOnly=${this.readonly}
112
- @input=${t=>this.handleInput(t,r)}
113
- @keydown=${t=>this.handleKeydown(t,r)}
114
- @paste=${t=>this.handlePaste(t)}
115
- @change=${()=>this.commit()}
116
- aria-invalid=${this.validationActive&&this.validationErrors.length>0?"true":"false"}
117
- aria-label="Serial character ${r+1} of ${this.length}"
118
- />
119
- `);return s.length&&t.push(a`<div class="group" part="group">${s}</div>`),t}render(){return a`
120
- <div
121
- class="input-wrapper"
122
- part="wrapper"
123
- role="group"
124
- aria-label="Serial input"
125
- >
126
- ${this.renderInputFields()}
127
- </div>
128
-
129
- ${this.showErrors&&this.validationErrors.length>0&&this.validationActive?a`<div class="error-message" part="error">
130
- ${this.validationErrors[0]}
131
- </div>`:""}
132
- `}};t([e({type:Number}),i("design:type",Object)],n.prototype,"length",void 0),t([e({type:String}),i("design:type",Object)],n.prototype,"separator",void 0),t([e({type:Array}),i("design:type",Array)],n.prototype,"separatorPositions",void 0),t([e({type:Boolean}),i("design:type",Object)],n.prototype,"alphanumeric",void 0),t([e({type:String}),i("design:type",Object)],n.prototype,"value",void 0),t([e({type:Array}),i("design:type",Array)],n.prototype,"validations",void 0),t([e({type:Array}),i("design:type",Array)],n.prototype,"validationErrors",void 0),t([e({type:Boolean}),i("design:type",Object)],n.prototype,"showErrors",void 0),t([e({type:Boolean,reflect:!0}),i("design:type",Object)],n.prototype,"validationActive",void 0),t([e({type:Boolean}),i("design:type",Object)],n.prototype,"withSeparator",void 0),t([e({type:Boolean}),i("design:type",Object)],n.prototype,"masked",void 0),t([e({type:Boolean,reflect:!0}),i("design:type",Boolean)],n.prototype,"invalid",void 0),n=t([r("sky-serial"),i("design:paramtypes",[])],n);export{n as SkySerial};
133
- //# sourceMappingURL=sky-serial.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"sky-serial.js","sources":["../../src/sky-serial/sky-serial.ts"],"sourcesContent":[null],"names":["SkySerial","FormControlBase","constructor","super","this","length","separator","separatorPositions","alphanumeric","value","validations","validationErrors","showErrors","validationActive","withSeparator","masked","invalid","displayValues","_lastCommitted","addEventListener","e","shadowRoot","related","relatedTarget","contains","commit","styles","css","firstUpdated","captureDefaultValue","ensureDisplayBuffer","syncDisplayFromValue","syncFormValue","syncValidity","willUpdate","changed","has","raw","normalizeRaw","canonical","addSeparators","Array","from","_","i","getFormValue","name","disabled","getRawFromDisplay","setValueFromFormState","state","s","queueMicrotask","applyInputsFromDisplay","getValidityAnchor","querySelector","undefined","isEmpty","trim","getNativeControl","validateForForm","valueToValidate","computeValidationErrors","onFormReset","defaultValue","applyInvalidClass","handleInput","index","readonly","preventDefault","inputs","querySelectorAll","target","ie","char","data","slice","isValid","test","rawValue","focus","every","c","handleKeydown","key","handlePaste","clipboardData","getData","firstEmptyIdx","findIndex","errors","dispatchEvent","CustomEvent","detail","bubbles","composed","reset","first","wrapper","classList","remove","offsetWidth","add","validateInput","toggleAttribute","isArray","r","push","err","String","message","v","sep","noSeps","replace","RegExp","allowed","match","join","chars","split","forEach","pos","splice","old","inp","isInvalid","toggle","renderInputFields","fields","separatorIndex","group","positions","html","live","render","__decorate","property","type","Number","prototype","Boolean","reflect","customElement"],"mappings":"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"}
@@ -1 +0,0 @@
1
- export * from "./sky-skeleton";
@@ -1 +0,0 @@
1
- export * from './sky-skeleton.js';
@@ -1,80 +0,0 @@
1
- import { LitElement } from "lit";
2
- /**
3
- * @element sky-skeleton
4
- *
5
- * @summary Skeleton loader with preset shapes and shimmer animation.
6
- *
7
- * @status stable
8
- * @since 1.0.0
9
- *
10
- * @documentation https://library.sky-ui.com/components/skeleton
11
- *
12
- * @slot - Default slot for the real content that is revealed when `loading=false`.
13
- *
14
- * @csspart container - The outer container for skeleton/slot regions.
15
- * @csspart skeleton-wrapper - Wrapper that contains the skeleton items.
16
- * @csspart slot-wrapper - Wrapper that contains the slotted content.
17
- * @csspart item - Each individual skeleton block (applies to all presets).
18
- * @csspart shimmer - The animated overlay (implemented via `::after`).
19
- *
20
- * @property {string} type - Comma-separated list of skeleton presets.
21
- * @property {boolean} loading - Shows skeletons when true and slot content when false.
22
- * @property {string} width - Width for the fallback default block.
23
- * @property {string} height - Height for the fallback default block.
24
- * @property {string} radius - Border radius for the fallback default block: token (`none`, `sm`, `md`, `lg`, `full`) or CSS length.
25
- *
26
- * @Behavior
27
- * - Renders one or more preset skeleton blocks based on `type`.
28
- * - Toggles `aria-busy` with `loading` to expose loading state.
29
- * - Reveals slotted content when loading completes.
30
- *
31
- * @example
32
- * ```html
33
- * <sky-skeleton loading type="avatar, text, actions">
34
- * <article>
35
- * <h3>Quarterly Report</h3>
36
- * <p>Revenue and adoption trends are now available.</p>
37
- * </article>
38
- * </sky-skeleton>
39
- * ```
40
- * ```vue
41
- * <template>
42
- * <sky-skeleton loading type="avatar, text, actions">
43
- * <article>
44
- * <h3>Quarterly Report</h3>
45
- * <p>Revenue and adoption trends are now available.</p>
46
- * </article>
47
- * </sky-skeleton>
48
- * </template>
49
- * ```
50
- * ```jsx
51
- * export default function Demo() {
52
- * return (
53
- * <sky-skeleton loading type="avatar, text, actions">
54
- * <article>
55
- * <h3>Quarterly Report</h3>
56
- * <p>Revenue and adoption trends are now available.</p>
57
- * </article>
58
- * </sky-skeleton>
59
- * );
60
- * }
61
- * ```
62
- */
63
- export declare class SkySkeleton extends LitElement {
64
- /** Comma‑separated preset types, e.g., `"avatar, text"`. */
65
- type: string;
66
- /** Show skeletons when true; show slotted content when false. */
67
- loading: boolean;
68
- /** Width for the fallback `default` block. */
69
- width: string;
70
- /** Height for the fallback `default` block. */
71
- height: string;
72
- /** Border‑radius for the fallback `default` block (token or CSS length). */
73
- radius: string;
74
- connectedCallback(): void;
75
- static styles: import("lit").CSSResult;
76
- protected updated(changed: Map<string, unknown>): void;
77
- render(): import("lit-html").TemplateResult<1>;
78
- /** Render a single skeleton preset block. */
79
- private renderSkeleton;
80
- }