@pg-labs-incubator/cobweb 0.0.0-stage → 0.0.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.
Files changed (320) hide show
  1. package/LICENSE +163 -0
  2. package/README.md +82 -2
  3. package/package.json +111 -3
  4. package/src/action/action.yaml +291 -0
  5. package/src/action/button-group.yaml +56 -0
  6. package/src/action/button.yaml +239 -0
  7. package/src/action/split-button.yaml +87 -0
  8. package/src/color/color.yaml +181 -0
  9. package/src/color/palette.yaml +147 -0
  10. package/src/container/card.yaml +170 -0
  11. package/src/container/corner-radius.yaml +50 -0
  12. package/src/container/elevation.yaml +19 -0
  13. package/src/design.yaml +41 -0
  14. package/src/feedback/feedback.yaml +225 -0
  15. package/src/icon/icon-font.yaml +28 -0
  16. package/src/icon/icon.yaml +31 -0
  17. package/src/input/date-picker.yaml +144 -0
  18. package/src/input/date-range-input.yaml +162 -0
  19. package/src/input/range-slider.yaml +161 -0
  20. package/src/input/select.yaml +230 -0
  21. package/src/input/slider.yaml +172 -0
  22. package/src/input/text-field.yaml +240 -0
  23. package/src/input/time-picker.yaml +220 -0
  24. package/src/motion/motion.yaml +371 -0
  25. package/src/navigation/app-bar.yaml +147 -0
  26. package/src/navigation/navigation.yaml +339 -0
  27. package/src/navigation/scroll.yaml +23 -0
  28. package/src/navigation/search.yaml +112 -0
  29. package/src/navigation/tabs.yaml +144 -0
  30. package/src/navigation/toolbar.yaml +130 -0
  31. package/src/selection/checkbox.yaml +162 -0
  32. package/src/selection/chip.yaml +219 -0
  33. package/src/selection/radio.yaml +125 -0
  34. package/src/selection/segmented-group.yaml +11 -0
  35. package/src/selection/segmented.yaml +69 -0
  36. package/src/selection/switch.yaml +209 -0
  37. package/src/spacing/measurement.yaml +80 -0
  38. package/src/state/state.yaml +38 -0
  39. package/src/surface/surface.yaml +483 -0
  40. package/src/text/line-height.yaml +144 -0
  41. package/src/text/typeface.yaml +31 -0
  42. package/src/text/typescale.yaml +726 -0
  43. package/target/esbuild/action/action.css +1 -0
  44. package/target/esbuild/action/base.jsx +1 -0
  45. package/target/esbuild/action/button.jsx +17 -0
  46. package/target/esbuild/action/fab-menu-context.jsx +1 -0
  47. package/target/esbuild/action/fab-menu.jsx +15 -0
  48. package/target/esbuild/action/fab.jsx +7 -0
  49. package/target/esbuild/action/group.jsx +22 -0
  50. package/target/esbuild/action/icon-button.jsx +5 -0
  51. package/target/esbuild/action/index.jsx +1 -0
  52. package/target/esbuild/action/split-button.jsx +12 -0
  53. package/target/esbuild/color/contrast.jsx +1 -0
  54. package/target/esbuild/color/dynamic.jsx +1 -0
  55. package/target/esbuild/color/hct.jsx +1 -0
  56. package/target/esbuild/color/index.css +1 -0
  57. package/target/esbuild/color/index.jsx +1 -0
  58. package/target/esbuild/color/palette.jsx +1 -0
  59. package/target/esbuild/color/scheme.jsx +1 -0
  60. package/target/esbuild/color/temperature.jsx +1 -0
  61. package/target/esbuild/container/card.css +1 -0
  62. package/target/esbuild/container/card.jsx +1 -0
  63. package/target/esbuild/container/elevation-shadow.css +1 -0
  64. package/target/esbuild/container/elevation-shadow.jsx +1 -0
  65. package/target/esbuild/container/index.jsx +1 -0
  66. package/target/esbuild/dom/client.jsx +1 -0
  67. package/target/esbuild/dom/index.jsx +1 -0
  68. package/target/esbuild/dom/server.jsx +1 -0
  69. package/target/esbuild/dom/types.jsx +1 -0
  70. package/target/esbuild/feedback/badge.jsx +15 -0
  71. package/target/esbuild/feedback/feedback.css +1 -0
  72. package/target/esbuild/feedback/focus.jsx +1 -0
  73. package/target/esbuild/feedback/index.jsx +1 -0
  74. package/target/esbuild/feedback/loading.jsx +7 -0
  75. package/target/esbuild/feedback/observe.jsx +1 -0
  76. package/target/esbuild/feedback/progress.jsx +35 -0
  77. package/target/esbuild/feedback/snackbar.jsx +23 -0
  78. package/target/esbuild/feedback/tooltip.jsx +24 -0
  79. package/target/esbuild/icon/icon.css +1 -0
  80. package/target/esbuild/icon/icon.jsx +1 -0
  81. package/target/esbuild/icon/index.jsx +1 -0
  82. package/target/esbuild/index.css +1 -0
  83. package/target/esbuild/index.jsx +1 -0
  84. package/target/esbuild/input/autocomplete.jsx +5 -0
  85. package/target/esbuild/input/base.jsx +4 -0
  86. package/target/esbuild/input/date-picker.css +1 -0
  87. package/target/esbuild/input/date-picker.jsx +104 -0
  88. package/target/esbuild/input/date-range-input.css +1 -0
  89. package/target/esbuild/input/date-time.jsx +21 -0
  90. package/target/esbuild/input/index.css +1 -0
  91. package/target/esbuild/input/index.jsx +1 -0
  92. package/target/esbuild/input/paired-input.jsx +1 -0
  93. package/target/esbuild/input/picker-dialog.css +1 -0
  94. package/target/esbuild/input/picker-dialog.jsx +14 -0
  95. package/target/esbuild/input/select.css +1 -0
  96. package/target/esbuild/input/select.jsx +63 -0
  97. package/target/esbuild/input/slider.css +1 -0
  98. package/target/esbuild/input/slider.jsx +51 -0
  99. package/target/esbuild/input/text-field.css +1 -0
  100. package/target/esbuild/input/text-field.jsx +67 -0
  101. package/target/esbuild/input/time-picker.css +1 -0
  102. package/target/esbuild/input/time-picker.jsx +29 -0
  103. package/target/esbuild/motion/frame.jsx +1 -0
  104. package/target/esbuild/motion/index.css +1 -0
  105. package/target/esbuild/motion/index.jsx +1 -0
  106. package/target/esbuild/motion/material.jsx +1 -0
  107. package/target/esbuild/motion/motion.jsx +1 -0
  108. package/target/esbuild/motion/spring.jsx +1 -0
  109. package/target/esbuild/motion/transition.css +1 -0
  110. package/target/esbuild/motion/transition.jsx +1 -0
  111. package/target/esbuild/motion/velocity.jsx +1 -0
  112. package/target/esbuild/navigation/app-bar.jsx +51 -0
  113. package/target/esbuild/navigation/base.jsx +1 -0
  114. package/target/esbuild/navigation/drawer.jsx +25 -0
  115. package/target/esbuild/navigation/index.jsx +1 -0
  116. package/target/esbuild/navigation/navigation.css +1 -0
  117. package/target/esbuild/navigation/navigation.jsx +29 -0
  118. package/target/esbuild/navigation/scroll.jsx +1 -0
  119. package/target/esbuild/navigation/search.jsx +29 -0
  120. package/target/esbuild/navigation/tabs.jsx +7 -0
  121. package/target/esbuild/navigation/toolbar.jsx +23 -0
  122. package/target/esbuild/selection/base.jsx +1 -0
  123. package/target/esbuild/selection/checkbox.jsx +14 -0
  124. package/target/esbuild/selection/chip.jsx +23 -0
  125. package/target/esbuild/selection/index.jsx +1 -0
  126. package/target/esbuild/selection/radio.jsx +9 -0
  127. package/target/esbuild/selection/segmented.jsx +15 -0
  128. package/target/esbuild/selection/selection.css +1 -0
  129. package/target/esbuild/selection/switch.jsx +14 -0
  130. package/target/esbuild/shape/corner-rounding.jsx +1 -0
  131. package/target/esbuild/shape/cubic.jsx +1 -0
  132. package/target/esbuild/shape/index.jsx +1 -0
  133. package/target/esbuild/shape/material-shapes.jsx +1 -0
  134. package/target/esbuild/shape/morph.jsx +1 -0
  135. package/target/esbuild/shape/path.jsx +1 -0
  136. package/target/esbuild/shape/point.jsx +1 -0
  137. package/target/esbuild/shape/rounded-polygon.jsx +1 -0
  138. package/target/esbuild/shape/shapes.jsx +1 -0
  139. package/target/esbuild/spacing/index.jsx +1 -0
  140. package/target/esbuild/state/component.css +1 -0
  141. package/target/esbuild/state/component.jsx +1 -0
  142. package/target/esbuild/state/controller.jsx +1 -0
  143. package/target/esbuild/state/index.jsx +1 -0
  144. package/target/esbuild/state/ripple.jsx +1 -0
  145. package/target/esbuild/state/state.jsx +1 -0
  146. package/target/esbuild/state/style.jsx +1 -0
  147. package/target/esbuild/surface/carousel-layout.jsx +1 -0
  148. package/target/esbuild/surface/carousel.css +1 -0
  149. package/target/esbuild/surface/carousel.jsx +10 -0
  150. package/target/esbuild/surface/dialog.jsx +35 -0
  151. package/target/esbuild/surface/divider.jsx +1 -0
  152. package/target/esbuild/surface/drag.jsx +1 -0
  153. package/target/esbuild/surface/gestures.css +1 -0
  154. package/target/esbuild/surface/gestures.jsx +7 -0
  155. package/target/esbuild/surface/index.css +1 -0
  156. package/target/esbuild/surface/index.jsx +1 -0
  157. package/target/esbuild/surface/interactive.jsx +1 -0
  158. package/target/esbuild/surface/list-patterns.jsx +26 -0
  159. package/target/esbuild/surface/list.css +1 -0
  160. package/target/esbuild/surface/list.jsx +9 -0
  161. package/target/esbuild/surface/menu.css +1 -0
  162. package/target/esbuild/surface/menu.jsx +12 -0
  163. package/target/esbuild/surface/scaffold.jsx +47 -0
  164. package/target/esbuild/surface/sheet.jsx +21 -0
  165. package/target/esbuild/surface/side-sheet.jsx +17 -0
  166. package/target/esbuild/surface/slots.jsx +1 -0
  167. package/target/esbuild/surface/surface.css +1 -0
  168. package/target/esbuild/surface/surface.jsx +1 -0
  169. package/target/esbuild/text/index.css +1 -0
  170. package/target/esbuild/text/index.jsx +1 -0
  171. package/target/esbuild/text/text.css +1 -0
  172. package/target/esbuild/text/text.jsx +3 -0
  173. package/target/esbuild/text/typography.css +1 -0
  174. package/target/esbuild/text/typography.jsx +1 -0
  175. package/target/esbuild/util/box-side.jsx +1 -0
  176. package/target/esbuild/util/debug.jsx +1 -0
  177. package/target/esbuild/util/dom.jsx +1 -0
  178. package/target/esbuild/util/event.jsx +1 -0
  179. package/target/esbuild/util/index.jsx +1 -0
  180. package/target/esbuild/util/preconditions.jsx +1 -0
  181. package/target/esbuild/util/reactive.jsx +1 -0
  182. package/target/tsc/action/action.css.d.ts +3 -0
  183. package/target/tsc/action/base.d.ts +211 -0
  184. package/target/tsc/action/button.d.ts +126 -0
  185. package/target/tsc/action/fab-menu-context.d.ts +16 -0
  186. package/target/tsc/action/fab-menu.d.ts +112 -0
  187. package/target/tsc/action/fab.d.ts +98 -0
  188. package/target/tsc/action/group.d.ts +166 -0
  189. package/target/tsc/action/icon-button.d.ts +79 -0
  190. package/target/tsc/action/index.d.ts +24 -0
  191. package/target/tsc/action/split-button.d.ts +78 -0
  192. package/target/tsc/color/contrast.d.ts +48 -0
  193. package/target/tsc/color/dynamic.d.ts +203 -0
  194. package/target/tsc/color/hct.d.ts +114 -0
  195. package/target/tsc/color/index.css.d.ts +3 -0
  196. package/target/tsc/color/index.d.ts +23 -0
  197. package/target/tsc/color/palette.d.ts +30 -0
  198. package/target/tsc/color/scheme.d.ts +446 -0
  199. package/target/tsc/color/temperature.d.ts +24 -0
  200. package/target/tsc/container/card.css.d.ts +3 -0
  201. package/target/tsc/container/card.d.ts +110 -0
  202. package/target/tsc/container/elevation-shadow.css.d.ts +3 -0
  203. package/target/tsc/container/elevation-shadow.d.ts +23 -0
  204. package/target/tsc/container/index.d.ts +44 -0
  205. package/target/tsc/dom/client.d.ts +387 -0
  206. package/target/tsc/dom/index.d.ts +93 -0
  207. package/target/tsc/dom/server.d.ts +65 -0
  208. package/target/tsc/dom/types.d.ts +134 -0
  209. package/target/tsc/feedback/badge.d.ts +116 -0
  210. package/target/tsc/feedback/feedback.css.d.ts +3 -0
  211. package/target/tsc/feedback/focus.d.ts +20 -0
  212. package/target/tsc/feedback/index.d.ts +17 -0
  213. package/target/tsc/feedback/loading.d.ts +194 -0
  214. package/target/tsc/feedback/observe.d.ts +75 -0
  215. package/target/tsc/feedback/progress.d.ts +281 -0
  216. package/target/tsc/feedback/snackbar.d.ts +398 -0
  217. package/target/tsc/feedback/tooltip.d.ts +326 -0
  218. package/target/tsc/icon/icon.css.d.ts +3 -0
  219. package/target/tsc/icon/icon.d.ts +69 -0
  220. package/target/tsc/icon/index.d.ts +13 -0
  221. package/target/tsc/index.css.d.ts +3 -0
  222. package/target/tsc/index.d.ts +7 -0
  223. package/target/tsc/input/autocomplete.d.ts +119 -0
  224. package/target/tsc/input/base.d.ts +282 -0
  225. package/target/tsc/input/date-picker.css.d.ts +3 -0
  226. package/target/tsc/input/date-picker.d.ts +351 -0
  227. package/target/tsc/input/date-range-input.css.d.ts +3 -0
  228. package/target/tsc/input/date-time.d.ts +171 -0
  229. package/target/tsc/input/index.css.d.ts +3 -0
  230. package/target/tsc/input/index.d.ts +27 -0
  231. package/target/tsc/input/paired-input.d.ts +435 -0
  232. package/target/tsc/input/picker-dialog.css.d.ts +3 -0
  233. package/target/tsc/input/picker-dialog.d.ts +84 -0
  234. package/target/tsc/input/select.css.d.ts +3 -0
  235. package/target/tsc/input/select.d.ts +267 -0
  236. package/target/tsc/input/slider.css.d.ts +3 -0
  237. package/target/tsc/input/slider.d.ts +372 -0
  238. package/target/tsc/input/text-field.css.d.ts +3 -0
  239. package/target/tsc/input/text-field.d.ts +415 -0
  240. package/target/tsc/input/time-picker.css.d.ts +3 -0
  241. package/target/tsc/input/time-picker.d.ts +212 -0
  242. package/target/tsc/motion/frame.d.ts +36 -0
  243. package/target/tsc/motion/index.css.d.ts +3 -0
  244. package/target/tsc/motion/index.d.ts +34 -0
  245. package/target/tsc/motion/material.d.ts +110 -0
  246. package/target/tsc/motion/motion.d.ts +235 -0
  247. package/target/tsc/motion/spring.d.ts +223 -0
  248. package/target/tsc/motion/transition.css.d.ts +3 -0
  249. package/target/tsc/motion/transition.d.ts +597 -0
  250. package/target/tsc/motion/velocity.d.ts +54 -0
  251. package/target/tsc/navigation/app-bar.d.ts +473 -0
  252. package/target/tsc/navigation/base.d.ts +320 -0
  253. package/target/tsc/navigation/drawer.d.ts +301 -0
  254. package/target/tsc/navigation/index.d.ts +25 -0
  255. package/target/tsc/navigation/navigation.css.d.ts +3 -0
  256. package/target/tsc/navigation/navigation.d.ts +537 -0
  257. package/target/tsc/navigation/scroll.d.ts +218 -0
  258. package/target/tsc/navigation/search.d.ts +332 -0
  259. package/target/tsc/navigation/tabs.d.ts +497 -0
  260. package/target/tsc/navigation/toolbar.d.ts +248 -0
  261. package/target/tsc/selection/base.d.ts +100 -0
  262. package/target/tsc/selection/checkbox.d.ts +194 -0
  263. package/target/tsc/selection/chip.d.ts +358 -0
  264. package/target/tsc/selection/index.d.ts +21 -0
  265. package/target/tsc/selection/radio.d.ts +198 -0
  266. package/target/tsc/selection/segmented.d.ts +333 -0
  267. package/target/tsc/selection/selection.css.d.ts +3 -0
  268. package/target/tsc/selection/switch.d.ts +165 -0
  269. package/target/tsc/shape/corner-rounding.d.ts +36 -0
  270. package/target/tsc/shape/cubic.d.ts +215 -0
  271. package/target/tsc/shape/index.d.ts +35 -0
  272. package/target/tsc/shape/material-shapes.d.ts +176 -0
  273. package/target/tsc/shape/morph.d.ts +91 -0
  274. package/target/tsc/shape/path.d.ts +177 -0
  275. package/target/tsc/shape/point.d.ts +165 -0
  276. package/target/tsc/shape/rounded-polygon.d.ts +289 -0
  277. package/target/tsc/shape/shapes.d.ts +76 -0
  278. package/target/tsc/spacing/index.d.ts +19 -0
  279. package/target/tsc/state/component.css.d.ts +3 -0
  280. package/target/tsc/state/component.d.ts +276 -0
  281. package/target/tsc/state/controller.d.ts +257 -0
  282. package/target/tsc/state/index.d.ts +19 -0
  283. package/target/tsc/state/ripple.d.ts +50 -0
  284. package/target/tsc/state/state.d.ts +129 -0
  285. package/target/tsc/state/style.d.ts +22 -0
  286. package/target/tsc/surface/carousel-layout.d.ts +212 -0
  287. package/target/tsc/surface/carousel.css.d.ts +3 -0
  288. package/target/tsc/surface/carousel.d.ts +231 -0
  289. package/target/tsc/surface/dialog.d.ts +580 -0
  290. package/target/tsc/surface/divider.d.ts +92 -0
  291. package/target/tsc/surface/drag.d.ts +92 -0
  292. package/target/tsc/surface/gestures.css.d.ts +3 -0
  293. package/target/tsc/surface/gestures.d.ts +292 -0
  294. package/target/tsc/surface/index.css.d.ts +3 -0
  295. package/target/tsc/surface/index.d.ts +29 -0
  296. package/target/tsc/surface/interactive.d.ts +22 -0
  297. package/target/tsc/surface/list-patterns.d.ts +384 -0
  298. package/target/tsc/surface/list.css.d.ts +3 -0
  299. package/target/tsc/surface/list.d.ts +340 -0
  300. package/target/tsc/surface/menu.css.d.ts +3 -0
  301. package/target/tsc/surface/menu.d.ts +590 -0
  302. package/target/tsc/surface/scaffold.d.ts +337 -0
  303. package/target/tsc/surface/sheet.d.ts +384 -0
  304. package/target/tsc/surface/side-sheet.d.ts +183 -0
  305. package/target/tsc/surface/slots.d.ts +21 -0
  306. package/target/tsc/surface/surface.css.d.ts +3 -0
  307. package/target/tsc/surface/surface.d.ts +192 -0
  308. package/target/tsc/text/index.css.d.ts +3 -0
  309. package/target/tsc/text/index.d.ts +18 -0
  310. package/target/tsc/text/text.css.d.ts +3 -0
  311. package/target/tsc/text/text.d.ts +94 -0
  312. package/target/tsc/text/typography.css.d.ts +3 -0
  313. package/target/tsc/text/typography.d.ts +82 -0
  314. package/target/tsc/util/box-side.d.ts +76 -0
  315. package/target/tsc/util/debug.d.ts +20 -0
  316. package/target/tsc/util/dom.d.ts +35 -0
  317. package/target/tsc/util/event.d.ts +93 -0
  318. package/target/tsc/util/index.d.ts +12 -0
  319. package/target/tsc/util/preconditions.d.ts +79 -0
  320. package/target/tsc/util/reactive.d.ts +36 -0
@@ -0,0 +1,14 @@
1
+ import{onCleanup as f,onMount as k}from"solid-js";import{defineInteractableComponent as S}from"../state";import{InteractableController as x}from"../state/controller";import{SELECTION_INTERACTION_STATES as a,applyNativeSelectionAttributes as E,notifySelectionChange as v,observeFormReset as I,splitContainerElementProps as g}from"./base";import"./selection.css";const s="cw-Checkbox-checked",c="cw-Checkbox-indeterminate",h="cw-Checkbox-disabled",l="cw-Checkbox-error",u="cw-Checkbox-input",_="previousState";function m(n){return`_cw-Checkbox-from-${n}`}function C(n,e){return e?"indeterminate":n?"checked":"unchecked"}function b(){return<span class="cw-Checkbox-box"aria-hidden="true">
2
+ <svg class="_cw-Checkbox-marks"viewBox="0 0 18 18">
3
+ <rect class="_cw-Checkbox-mark _cw-Checkbox-short"/>
4
+ <rect class="_cw-Checkbox-mark _cw-Checkbox-long"/>
5
+ </svg>
6
+ </span>}class w extends x{#e;#t;#c;#d;#i;#a;#n;#r;#o;constructor(e){super(e,{baseInteractionCssClassName:"cw-Checkbox",enabledInteractionStates:a}),this.#e="checked"in e,this.#t="indeterminate"in e,this.#c="attr:aria-invalid"in e,this.#d=t=>this.#l(t),this.#i=!1,this.#a=!1,this.#n=!1,this.#r=void 0,this.#o=void 0,k(()=>{const t=super.functionElement;t!==null&&(this.#o=I(t,()=>this.#h()))}),f(()=>{this.#o?.(),this.#o=void 0})}get state(){const e=super.functionElement;return e===null?"unchecked":C(e.checked,e.indeterminate)}#s(){const e=this.state;e!==this.#r&&(super.setClass(_,m(this.#r??e)),super.setClass(s,e==="checked"),super.setClass(c,e==="indeterminate"),this.#r=e)}#h(){const e=super.functionElement;e!==null&&(this.#e&&(e.checked=this.props.checked===!0),e.indeterminate=this.#t?this.props.indeterminate===!0:this.#i,this.#s())}#l(e){const t=super.functionElement;t===null||this.#n||(v([this.props.onChange,this.props.onCheckedChange],t.checked,e),this.#e&&(t.checked=this.props.checked===!0),this.#t&&(t.indeterminate=this.props.indeterminate===!0),this.#s())}applyComponentProps(){const e=super.readProps(["checked","defaultChecked","defaultIndeterminate","disabled","error","indeterminate","name","required","tabIndex","value"]),t=super.functionElement;t!==null&&(this.#a||(this.#a=!0,this.#i=e.defaultIndeterminate===!0,t.defaultChecked=e.defaultChecked===!0,this.#e||(t.checked=e.defaultChecked===!0),this.#t||(t.indeterminate=this.#i)),this.#e&&e.checkedChanged&&(t.checked=e.checked===!0),this.#t&&e.indeterminateChanged&&(t.indeterminate=e.indeterminate===!0),e.disabledChanged&&(this.#n=e.disabled===!0,super.setClass(h,this.#n),super.setEnabledInteractionStates(this.#n?0:a)),e.errorChanged&&(super.setClass(l,e.error===!0),this.#c||super.setAttribute("aria-invalid",e.error===!0?"true":void 0)),(e.disabledChanged||e.nameChanged||e.requiredChanged||e.tabIndexChanged||e.valueChanged)&&E(t,e,(r,i)=>super.setAttribute(r,i)),this.#s())}onFunctionElementChanged(e){super.functionElement?.removeEventListener("change",this.#d),super.onFunctionElementChanged(e),e?.addEventListener("change",this.#d)}render(e,t){return<label class="cw-Checkbox">
7
+ <input class={u}ref={t}type="checkbox"/>
8
+ {b()}
9
+ <span class="_cw-selection-label">{e}</span>
10
+ </label>}}function y(n,e){const[t,r]=g(n),i=("checked"in e?e.checked:e.defaultChecked)===!0,p=("indeterminate"in e?e.indeterminate:e.defaultIndeterminate)===!0,o=C(i,p),d=e.error===!0;return<label{...t}classList={{...t.classList,[s]:o==="checked",[h]:e.disabled===!0,[l]:d,[c]:o==="indeterminate",[m(o)]:!0,"cw-Checkbox":!0}}>
11
+ <input aria-invalid={d?"true":void 0}{...r}checked={i}class={u}disabled={e.disabled===!0}name={e.name}required={e.required===!0}tabIndex={e.tabIndex}type="checkbox"value={e.value}/>
12
+ {b()}
13
+ <span class="_cw-selection-label">{n.children}</span>
14
+ </label>}const N=S(()=>y,()=>w);export{N as Checkbox,w as CheckboxController};
@@ -0,0 +1,23 @@
1
+ import{createMemo as I,createUniqueId as b,onCleanup as P,onMount as x}from"solid-js";import{DragState as D,defineInteractableComponent as L}from"../state";import{InteractableController as A}from"../state/controller";import{deferAfterDelegatedCancellation as f}from"../util/event";import{SELECTION_INTERACTION_STATES as m,applyNativeSelectionAttributes as k,notifySelectionChange as w,observeFormReset as M,splitContainerElementProps as $}from"./base";import"../container/elevation-shadow.css";import"./selection.css";const h={assist:"cw-AssistChip",filter:"cw-FilterChip",input:"cw-InputChip",suggestion:"cw-SuggestionChip"},g="_cw-selection-form-value",C="Remove",B=new Set(["Backspace","Delete"]);function l(n){return n==="filter"||n==="input"}function v(n,e){return`_${h[n]}-${e??"flat"}`}function E(n){if(l(n))return{label:b(),remove:b()}}function S(n,e,t){return<>
2
+ <span class="_cw-Chip-leading">
3
+ {n==="filter"?<svg class="_cw-Chip-checkmark"viewBox="0 0 18 18">
4
+ <path d="M3.75 9.5 7.25 13 14.25 6"/>
5
+ </svg>:void 0}
6
+ {n==="input"?<span class="_cw-Chip-avatar">
7
+ {e.avatar()}
8
+ </span>:void 0}
9
+ <span class="_cw-Chip-leadingIcon">{e.leadingIcon()}</span>
10
+ </span>
11
+ <span class="_cw-Chip-label"id={t?.label}>{e.label()}</span>
12
+ <span class="_cw-Chip-trailingIcon">{e.trailingIcon()}</span>
13
+ </>}function y(){return<svg class="_cw-Chip-removeIcon"viewBox="0 0 18 18">
14
+ <path d="M4.75 4.75 13.25 13.25M13.25 4.75 4.75 13.25"/>
15
+ </svg>}class _ extends A{#e;#i;#C;#l;#a;#b;#p;#s;#o;#u;#t;#n;#r;#h;#c;#d;constructor(e,t){super(e,{baseInteractionCssClassName:h[t],enabledInteractionStates:m}),this.#e=t,this.#i=l(t)?"selected"in e?"selected":"checked"in e?"checked":void 0:void 0,this.#C="attr:aria-pressed"in e,this.#l=i=>this.#E(i),this.#a=i=>this.#S(i),this.#b=i=>this.#g(i),this.#p=void 0,this.#s=!1,this.#o=!1,this.#u=!1,this.#t=!1,this.#n=!1,this.#r=0,this.#h=null,this.#c=null,this.#d=void 0,x(()=>{const i=super.functionElement;i!==null&&l(t)&&(this.#d=M(i,()=>this.#v()))}),P(()=>{this.#r++,this.#d?.(),this.#d=void 0})}get baseClassName(){return h[this.#e]}#f(){return l(this.#e)?this.#i===void 0?this.#s:this.props[this.#i]===!0:!1}#m(){const e=super.functionElement,t=this.#c;if(e===null||!l(this.#e))return;const i=this.#f(),s=e.getAttribute("form");super.setClass(`${this.baseClassName}-selected`,i),this.#C||super.setAttribute("aria-pressed",i?"true":"false"),t!==null&&(t.disabled=this.#t||!i||e.name==="",t.name=e.name,t.value=e.value,s===null?t.removeAttribute("form"):t.setAttribute("form",s))}#v(){this.#i===void 0&&(this.#s=this.#o),this.#m()}#E(e){const t=super.functionElement;if(t===null||this.#t||!l(this.#e))return;const i=++this.#r;f(e,t,()=>{if(i!==this.#r||e.defaultPrevented||this.#t||super.functionElement!==t)return;const s=!this.#f();this.#i===void 0&&(this.#s=s),w([this.props.onChange,this.props.onSelectedChange],s,e),this.#m()},!1)}#S(e){B.has(e.key)&&!e.repeat&&this.#g(e)}#g(e){const t=super.styleElement;t===null||this.#t||!this.#n||e.defaultPrevented||f(e,t,()=>{!super.isControllerDisposed&&!this.#t&&this.#n&&this.props.onDismiss?.(e)},e.type==="keydown")}#y(e,t){const i=this.#p;e.hidden=!this.#n,e.disabled=this.#t,super.setClass(`${this.baseClassName}-removable`,this.#n),t!==void 0?(e.setAttribute("aria-label",t),e.removeAttribute("aria-labelledby")):i!==void 0&&(e.setAttribute("aria-label",C),e.setAttribute("aria-labelledby",`${i.remove} ${i.label}`))}applyComponentProps(){const e=super.readProps(["checked","defaultSelected","design","disabled","draggable","expressive","name","onDismiss","removable","removeLabel","selected","tabIndex","value"]),t=super.functionElement,i=this.#h,s=this.baseClassName;t!==null&&(this.#u||(this.#u=!0,this.#o=e.defaultSelected===!0,this.#s=this.#o),e.designChanged&&this.#e!=="input"&&super.setClass("design",v(this.#e,e.design)),e.expressiveChanged&&l(this.#e)&&super.setClass(`${s}-expressive`,e.expressive===!0),(e.disabledChanged||e.draggableChanged)&&(this.#t=e.disabled===!0,super.setClass(`${s}-disabled`,this.#t),super.setEnabledInteractionStates(this.#t?0:e.draggable===!0?m|D:m)),(e.disabledChanged||e.nameChanged||e.tabIndexChanged||e.valueChanged)&&k(t,e,(a,d)=>super.setAttribute(a,d)),i!==null&&(e.disabledChanged||e.onDismissChanged||e.removableChanged||e.removeLabelChanged)&&(this.#n=e.removable===!0||e.onDismiss!==void 0,this.#y(i,e.removeLabel)),this.#m())}onFunctionElementChanged(e){const t=super.functionElement;t?.removeEventListener("click",this.#l),t?.removeEventListener("keydown",this.#a),super.onFunctionElementChanged(e),e?.addEventListener("click",this.#l),e?.addEventListener("keydown",this.#a)}render(e,t){const i=this.props,s=this.baseClassName,a=I(()=>i.label??e),d={avatar:()=>i.avatar,label:a,leadingIcon:()=>i.leadingIcon,trailingIcon:()=>i.trailingIcon},o=E(this.#e),p=r=>{this.#h=r,r.addEventListener("click",this.#b),r.addEventListener("keydown",this.#a)},u=r=>{this.#c=r};return this.#p=o,<span class={`${s} cw-elevationShadow`}>
16
+ <button class={`${s}-button`}ref={t}type="button">{S(this.#e,d,o)}</button>
17
+ {o!==void 0?<button aria-label={C}aria-labelledby={`${o.remove} ${o.label}`}class={`${s}-remove`}hidden id={o.remove}ref={p}tabIndex={-1}type="button">{y()}</button>:void 0}
18
+ {l(this.#e)?<input class={g}ref={u}type="hidden"/>:void 0}
19
+ </span>}}function F(n,e,t){const[i,s]=$(e),a=h[n],d=l(n),o=t.disabled===!0,p=d&&("selected"in t?t.selected:"checked"in t?t.checked:t.defaultSelected)===!0,u=d&&(t.removable===!0||t.onDismiss!==void 0),r=E(n);return<span{...i}classList={{...i.classList,[a]:!0,[`${a}-disabled`]:o,[`${a}-expressive`]:d&&t.expressive===!0,[`${a}-removable`]:u,[`${a}-selected`]:p,[v(n,t.design)]:n!=="input","cw-elevationShadow":!0}}>
20
+ <button aria-pressed={d?p?"true":"false":void 0}{...s}class={`${a}-button`}disabled={o}name={t.name}tabIndex={t.tabIndex}type="button"value={t.value}>{S(n,{avatar:()=>t.avatar,label:()=>t.label??e.children,leadingIcon:()=>t.leadingIcon,trailingIcon:()=>t.trailingIcon},r)}</button>
21
+ {r!==void 0?<button aria-label={t.removeLabel??C}aria-labelledby={t.removeLabel===void 0?`${r.remove} ${r.label}`:void 0}class={`${a}-remove`}disabled={o}hidden={!u}id={r.remove}tabIndex={-1}type="button">{y()}</button>:void 0}
22
+ {d?<input class={g}disabled={o||!p||(t.name??"")===""}form={s.form}name={t.name}type="hidden"value={t.value}/>:void 0}
23
+ </span>}function c(n){return L(()=>(e,t)=>F(n,e,t),()=>class extends _{constructor(e){super(e,n)}})}const H=c("assist"),U=n=><H{...n}design={n.design??"elevated"}/>,J=c("filter"),j=n=><J{...n}design={n.design??"elevated"}/>,z=c("input"),T=c("suggestion"),Y=n=><T{...n}design={n.design??"elevated"}/>;export{H as AssistChip,_ as ChipController,U as ElevatedAssistChip,j as ElevatedFilterChip,Y as ElevatedSuggestionChip,J as FilterChip,z as InputChip,T as SuggestionChip};
@@ -0,0 +1 @@
1
+ import{Checkbox as t,CheckboxController as r}from"./checkbox";import{AssistChip as i,ChipController as n,ElevatedAssistChip as s,ElevatedFilterChip as h,ElevatedSuggestionChip as C,FilterChip as u,InputChip as l,SuggestionChip as m}from"./chip";import{RadioButton as g,RadioButtonController as a,RadioGroup as S}from"./radio";import{MultiChoiceSegmentedButtonRow as c,SegmentedButton as B,SegmentedButtonController as P,SegmentedButtonGroup as f,SegmentedButtonGroupController as G,SingleChoiceSegmentedButtonRow as R}from"./segmented";import{Switch as w,SwitchController as y}from"./switch";export{i as AssistChip,t as Checkbox,r as CheckboxController,n as ChipController,s as ElevatedAssistChip,h as ElevatedFilterChip,C as ElevatedSuggestionChip,u as FilterChip,l as InputChip,c as MultiChoiceSegmentedButtonRow,g as RadioButton,a as RadioButtonController,S as RadioGroup,B as SegmentedButton,P as SegmentedButtonController,f as SegmentedButtonGroup,G as SegmentedButtonGroupController,R as SingleChoiceSegmentedButtonRow,m as SuggestionChip,w as Switch,y as SwitchController};
@@ -0,0 +1,9 @@
1
+ import{onCleanup as R,onMount as g}from"solid-js";import{defineDomComponent as I}from"..";import{defineInteractableComponent as L}from"../state";import{InteractableController as y}from"../state/controller";import{SELECTION_INTERACTION_STATES as p,applyNativeSelectionAttributes as k,eventRootOf as m,notifySelectionChange as T,observeFormReset as P,splitContainerElementProps as M}from"./base";import"./selection.css";const s="cw-RadioButton-selected",h="cw-RadioButton-disabled",C="cw-RadioButton-input",a=new WeakMap;function v(n,e){return n.name!==""&&n.name===e.name&&n.form===e.form}function B(n,e){const t=m(n);if(t===void 0)return()=>{};let o=a.get(t);if(o===void 0){const l=new Map,u=b=>{const d=b.target;d?.localName!=="input"||d.type!=="radio"||queueMicrotask(()=>{for(const[c,{onGroupChange:S}]of l)(c===d||v(c,d))&&S()})};o={listener:u,radios:l},a.set(t,o),t.addEventListener("change",u)}const{listener:i,radios:r}=o;return r.set(n,e),()=>{r.get(n)===e&&(r.delete(n),r.size===0&&(t.removeEventListener("change",i),a.delete(t)))}}function H(n){const e=m(n),t=e===void 0?void 0:a.get(e)?.radios;for(const[o,{onPeerSelected:i}]of t??[])o!==n&&v(o,n)&&i()}function E(){return<span class="cw-RadioButton-circle"aria-hidden="true"/>}class G extends y{#e;#o;#i;#t;#n;constructor(e){super(e,{baseInteractionCssClassName:"cw-RadioButton",enabledInteractionStates:p}),this.#e="selected"in e?"selected":"checked"in e?"checked":void 0,this.#o=t=>this.#a(t),this.#i=!1,this.#t=!1,this.#n=void 0,g(()=>{const t=super.functionElement;if(t===null)return;const o=B(t,{onGroupChange:()=>this.#d(),onPeerSelected:()=>super.setClass(s,t.checked)}),i=P(t,()=>this.#d());this.#n=()=>{o(),i()},this.#r(t)}),R(()=>{this.#n?.(),this.#n=void 0})}#r(e){super.setClass(s,e.checked),e.checked&&H(e)}#d(){const e=super.functionElement;e!==null&&(this.#e!==void 0&&(e.checked=this.props[this.#e]===!0),this.#r(e))}#a(e){const t=super.functionElement;t===null||this.#t||(T([this.props.onChange,this.props.onSelectedChange],t.checked,e),this.#d())}applyComponentProps(){const e=super.readProps(["checked","defaultChecked","defaultSelected","disabled","name","required","selected","tabIndex","value"]),t=super.functionElement;if(t!==null){if(!this.#i){const o=(e.defaultSelected??e.defaultChecked)===!0;this.#i=!0,t.defaultChecked=o,this.#e===void 0&&(t.checked=o)}this.#e!==void 0&&e[`${this.#e}Changed`]&&(t.checked=e[this.#e]===!0),e.disabledChanged&&(this.#t=e.disabled===!0,super.setClass(h,this.#t),super.setEnabledInteractionStates(this.#t?0:p)),(e.disabledChanged||e.nameChanged||e.requiredChanged||e.tabIndexChanged||e.valueChanged)&&k(t,e,(o,i)=>super.setAttribute(o,i)),this.#r(t)}}onFunctionElementChanged(e){super.functionElement?.removeEventListener("change",this.#o),super.onFunctionElementChanged(e),e?.addEventListener("change",this.#o)}render(e,t){return<label class="cw-RadioButton">
2
+ <input class={C}ref={t}type="radio"/>
3
+ {E()}
4
+ <span class="_cw-selection-label">{e}</span>
5
+ </label>}}function w(n,e){const[t,o]=M(n),i=("selected"in e?e.selected:"checked"in e?e.checked:e.defaultSelected??e.defaultChecked)===!0;return<label{...t}classList={{...t.classList,[h]:e.disabled===!0,[s]:i,"cw-RadioButton":!0}}>
6
+ <input{...o}checked={i}class={C}disabled={e.disabled===!0}name={e.name}required={e.required===!0}tabIndex={e.tabIndex}type="radio"value={e.value}/>
7
+ {E()}
8
+ <span class="_cw-selection-label">{n.children}</span>
9
+ </label>}const J=L(()=>w,()=>G);function f(n){return`_cw-RadioGroup-${n??"vertical"}`}const N=I(()=>(n,e)=><fieldset aria-orientation={e.orientation??"vertical"}{...n}classList={{...n.classList,[f(e.orientation)]:!0,"cw-RadioGroup":!0}}role="radiogroup"/>,n=>class extends n{#e;constructor(e){super(e,{styleElementIsFunction:!0}),this.#e="attr:aria-orientation"in e}applyComponentProps(){const[e,t]=super.readProp("orientation");t&&(super.setClass("orientation",f(e)),this.#e||super.setAttribute("aria-orientation",e??"vertical"))}render(e){return<fieldset class="cw-RadioGroup"role="radiogroup">{e}</fieldset>}});export{J as RadioButton,G as RadioButtonController,N as RadioGroup};
@@ -0,0 +1,15 @@
1
+ import{For as W,createComponent as w,createContext as Y,createEffect as $,createMemo as L,createSignal as k,mergeProps as Z,on as ee,onCleanup as _,onMount as A,untrack as te,useContext as I}from"solid-js";import{isServer as x}from"solid-js/web";import{defineDomComponent as ne}from"..";import{DomController as oe}from"../dom/client";import{defineInteractableComponent as ie}from"../state";import{InteractableController as re}from"../state/controller";import{deferAfterDelegatedCancellation as P}from"../util/event";import{SELECTION_INTERACTION_STATES as B,applyNativeSelectionAttributes as se,notifySelectionChange as T,observeFormReset as de}from"./base";import"./selection.css";const E=Y(),M="cw-SegmentedButton-selected",O="cw-SegmentedButton-disabled",R="cw-SegmentedButton-invalid",V="cw-SegmentedButton-grouped",H="cw-SegmentedButton-vertical",J="cw-SegmentedButton-first",X="cw-SegmentedButton-last",N="cw-SegmentedButton-only",F="_cw-selection-form-value",ae="data-cw-invalid-value";function C(o){return o!==void 0&&o.trim().length!==0}function G(o,e){const t=o===void 0?[]:typeof o=="string"?[o]:o;return new Set(e?t:t.slice(0,1))}function ue(o,e){const t=new Set,i=[];return o.forEach((n,r)=>{!C(n.value)||t.has(n.value)||(t.add(n.value),n.disabled!==!0&&i.push(r))}),i.find(n=>(o[n].tabIndex??-1)>=0)??i.find(n=>e.has(o[n].value))??i[0]}function le(o,e){return(o.element().compareDocumentPosition(e.element())&Node.DOCUMENT_POSITION_FOLLOWING)!==0?-1:1}function z(o,e){return<>
2
+ <span class="_cw-SegmentedButton-icon">
3
+ <svg class="_cw-SegmentedButton-checkmark"viewBox="0 0 18 18">
4
+ <path d="M3.75 9.5 7.25 13 14.25 6"/>
5
+ </svg>
6
+ <span class="_cw-SegmentedButton-iconContent">{o()}</span>
7
+ </span>
8
+ <span class="_cw-SegmentedButton-label">{e()}</span>
9
+ </>}class ce extends re{#e;#n;#i;#r;#o;#a;#m;#v;#f;#d;#u;#p;#t;#l;#S;#h;#g;#c;constructor(e){super(e,{baseInteractionCssClassName:"cw-SegmentedButton",enabledInteractionStates:B});const[t,i]=k(void 0,{equals:(n,r)=>n!==void 0&&r!==void 0&&n.valid===r.valid&&n.first===r.first&&n.last===r.last&&n.tabStop===r.tabStop});this.#e=I(E),this.#n=this.#e!==void 0?void 0:"selected"in e?"selected":"checked"in e?"checked":void 0,this.#i="attr:aria-checked"in e,this.#r="attr:aria-disabled"in e,this.#o="attr:aria-pressed"in e,this.#a="attr:role"in e,this.#m=t,this.#v=i,this.#f=n=>this.#B(n),this.#d=!1,this.#u=!1,this.#p=!1,this.#t=!1,this.#l=0,this.#S=null,this.#h=void 0,this.#g=void 0,this.#c=void 0,A(()=>{const n=super.functionElement,r=this.#e;if(n===null)return;const s=r?.register({disabled:()=>this.#t,element:()=>super.functionElement,setLayout:this.#v,tabIndex:()=>super.readProp("tabIndex",!0)[0],value:()=>super.readProp("value",!0)[0]}),d=de(n,()=>this.#E());this.#c=()=>{s?.(),d()}}),_(()=>{this.#l++,this.#c?.(),this.#c=void 0})}#s(){return this.#e===void 0||this.#m()?.valid!==!1}#C(){const e=this.#e,t=super.readProp("value",!0)[0];return e!==void 0?C(t)&&this.#s()&&e.isSelected(t):this.#n===void 0?this.#d:this.props[this.#n]===!0}#b(){const e=super.functionElement,t=this.#S;if(e===null)return;const i=this.#C(),n=this.#e?.multiple()===!1,r=n?i?"radio":"unradio":i?"pressed":"unpressed",s=this.#t||!i||!this.#s()||e.name==="",d=e.getAttribute("form");r!==this.#g&&(this.#g=r,super.setClass(M,i),this.#a||super.setAttribute("role",n?"radio":void 0),this.#i||super.setAttribute("aria-checked",n?String(i):void 0),this.#o||super.setAttribute("aria-pressed",n?void 0:String(i))),t!==null&&(t.disabled!==s&&(t.disabled=s),t.name!==e.name&&(t.name=e.name),t.value!==e.value&&(t.value=e.value),t.getAttribute("form")!==d&&(d===null?t.removeAttribute("form"):t.setAttribute("form",d)))}#y(e){this.#h=e,super.setClass(J,e.first),super.setClass(X,e.last),super.setClass(N,e.first&&e.last),super.setClass(R,!e.valid),super.setAttribute(ae,e.valid?void 0:"true"),this.#r||super.setAttribute("aria-disabled",e.valid?void 0:"true"),super.setEnabledInteractionStates(!e.valid||this.#t?0:B),super.setAttribute("tabindex",e.tabStop?0:-1)}#E(){this.#e!==void 0?this.#e.resetSelection():this.#n===void 0&&(this.#d=this.#u),this.#b()}#B(e){const t=super.functionElement;if(!this.#s()){e.preventDefault(),e.stopImmediatePropagation();return}if(t===null||this.#t||e.defaultPrevented)return;const i=++this.#l;P(e,t,()=>{const n=this.#e,r=super.readProp("value",!0)[0],s=[this.props.onChange,this.props.onSelectedChange];if(!(i!==this.#l||e.defaultPrevented||this.#t||super.functionElement!==t||!this.#s())){if(n!==void 0)C(r)&&n.requestSelection(r,e,s);else{const d=!this.#C();this.#n===void 0&&(this.#d=d),T(s,d,e)}this.#b()}},!1)}onEvent(e){(e.type!=="click"||this.#s())&&super.onEvent(e)}applyComponentProps(){const e=super.readProps(["checked","defaultSelected","disabled","name","selected","tabIndex","value"]),t=super.functionElement,i=this.#e,n=this.#m();if(t!==null){if(this.#p||(this.#p=!0,this.#u=e.defaultSelected===!0,this.#d=this.#u),e.disabledChanged&&(this.#t=e.disabled===!0,super.setClass(O,this.#t),super.setEnabledInteractionStates(this.#t||!this.#s()?0:B)),e.disabledChanged||e.nameChanged||e.tabIndexChanged||e.valueChanged){const{disabled:r,name:s,value:d}=e;se(t,i===void 0?e:{disabled:r,name:s,value:d},(f,m)=>super.setAttribute(f,m))}i!==void 0&&(super.setClass(V,!0),super.setClass(H,i.orientation()==="vertical"),(e.disabledChanged||e.tabIndexChanged||e.valueChanged)&&i.invalidate(),n!==void 0&&n!==this.#h&&this.#y(n)),this.#b()}}onFunctionElementChanged(e){super.functionElement?.removeEventListener("click",this.#f,!0),super.onFunctionElementChanged(e),e?.addEventListener("click",this.#f,!0)}render(e,t){const i=this.props,n=L(()=>i.label??e),r=s=>{this.#S=s};return<button class="cw-SegmentedButton"ref={t}type="button">
10
+ {z(()=>i.icon,n)}
11
+ <input class={F}ref={r}type="hidden"/>
12
+ </button>}}function me(o,e){const t=I(E),i=e.disabled===!0,n=t?.claimServer?.(e.value,i,e.tabIndex),r=n!==void 0?n.selected:("selected"in e?e.selected:"checked"in e?e.checked:e.defaultSelected)===!0,s=t?.multiple()===!1,d=n?.valid===!1;return<button aria-checked={s?r?"true":"false":void 0}aria-disabled={d?"true":void 0}aria-pressed={s?void 0:r?"true":"false"}data-cw-invalid-value={d?"true":void 0}role={s?"radio":void 0}tabIndex={n===void 0?e.tabIndex:n.tabStop?0:-1}{...o}classList={{...o.classList,[O]:i,[J]:n?.first===!0,[V]:t!==void 0,[R]:d,[X]:n?.last===!0,[N]:n?.first===!0&&n.last,[M]:r,[H]:t?.orientation()==="vertical","cw-SegmentedButton":!0}}disabled={i}name={e.name}type="button"value={e.value}>
13
+ {z(()=>e.icon,()=>e.label??o.children)}
14
+ <input class={F}disabled={i||d||!r||(e.name??"")===""}form={o.form}name={e.name}type="hidden"value={e.value}/>
15
+ </button>}const Se=ie(()=>me,()=>ce);function q(o){return`_cw-SegmentedButtonGroup-${o??"horizontal"}`}function D(o){return o.parentElement?.closest(".cw-SegmentedButtonGroup")??null}class he extends oe{#e;#n;#i;#r;#o;constructor(e){super(e,{styleElementIsFunction:!0}),this.#e=I(E),this.#n="attr:aria-orientation"in e,this.#i=t=>this.#a(t),this.#r=()=>this.#e?.invalidate(),this.#o=void 0,A(()=>{const t=super.styleElement,i=this.#e,n=t?.ownerDocument.defaultView?.MutationObserver;t===null||i===void 0||n===void 0||(this.#o=new n(()=>i.invalidate()),this.#o.observe(t,{childList:!0,subtree:!0}))}),_(()=>{this.#o?.disconnect(),this.#o=void 0})}#a(e){const t=super.styleElement,i=this.props.multiple!==!0,n=(this.props.orientation??"horizontal")==="vertical",r=e.target?.closest("button.cw-SegmentedButton");if(t===null||r===null||r===void 0||D(r)!==t)return;const s=Array.from(t.querySelectorAll('button.cw-SegmentedButton:not(:disabled):not([aria-disabled="true"])')).filter(p=>D(p)===t),d=s.indexOf(r),f=getComputedStyle(t).direction==="rtl",m=e.key==="Home"?-d:e.key==="End"?s.length-1-d:e.key==="ArrowDown"&&(n||i)?1:e.key==="ArrowUp"&&(n||i)?-1:e.key==="ArrowRight"&&(!n||i)?f?-1:1:e.key==="ArrowLeft"&&(!n||i)?f?1:-1:0;if(d<0||m===0||s.length<2)return;const l=s[(d+m+s.length)%s.length];P(e,t,()=>{super.styleElement!==t||!l.isConnected||(l.focus(),i&&l.click())})}applyComponentProps(){const e=super.readProps(["multiple","orientation"]);e.orientationChanged&&super.setClass("orientation",q(e.orientation)),e.multipleChanged&&super.setAttribute("role",e.multiple===!0?"group":"radiogroup"),(e.multipleChanged||e.orientationChanged)&&!this.#n&&super.setAttribute("aria-orientation",e.multiple===!0?void 0:e.orientation??"horizontal")}onStyleElementChanged(e){const t=super.styleElement;t?.removeEventListener("keydown",this.#i),t?.removeEventListener("focusin",this.#r),super.onStyleElementChanged(e),e?.addEventListener("keydown",this.#i),e?.addEventListener("focusin",this.#r)}render(e){return<div class="cw-SegmentedButtonGroup">{e}</div>}}function ge(o,e){const t=e.multiple===!0;return<div aria-orientation={t?void 0:e.orientation??"horizontal"}role={t?"group":"radiogroup"}{...o}classList={{...o.classList,[q(e.orientation)]:!0,"cw-SegmentedButtonGroup":!0}}/>}const be=ne(()=>ge,()=>he);function ve(o,e){const t=new Set;let i=0,n=!1,r;return(s,d,f)=>{const m=i++,l=o();m===0&&l!==void 0&&(r=ue(l,e()));const p=C(s)&&!t.has(s),h=p&&e().has(s),y=!n&&p&&!d&&(l!==void 0?m===r:h||(f??-1)>=0||e().size===0);return p&&t.add(s),y&&(n=!0),{first:m===0,last:l!==void 0&&m===l.length-1,selected:h,tabStop:y,valid:p}}}const U=o=>{const e="value"in o,t="items"in o,i=te(()=>G(o.defaultValue,o.multiple===!0)),n=()=>o.multiple===!0,[r,s]=k(i),d=L(()=>G(e?o.value:[...r()],n())),f=new Set;let m,l=!1;const p=()=>{const a=Array.from(f).filter(u=>u.element()?.isConnected===!0).sort(le),g=new Set,b=new Set;for(const u of a){const S=u.value();C(S)&&!g.has(S)&&(g.add(S),b.add(u))}const c=a.filter(u=>b.has(u)&&!u.disabled()),v=c.find(u=>{const S=u.element();return S.getRootNode().activeElement===S})??c.find(u=>(u.tabIndex()??-1)>=0)??c.find(u=>d().has(u.value()))??c[0];a.forEach((u,S)=>u.setLayout({first:S===0,last:S===a.length-1,tabStop:u===v,valid:b.has(u)}))},h=()=>{l||(l=!0,queueMicrotask(()=>{l=!1,p()}))},y=()=>{const a=L(()=>o.items);return m=a,<W each={a()}>{g=><Se{...g}/>}</W>},K={claimServer:x?ve(()=>m?.(),d):void 0,invalidate:h,isSelected:a=>d().has(a),multiple:n,orientation:()=>o.orientation??"horizontal",register(a){return f.add(a),h(),()=>{f.delete(a),h()}},requestSelection(a,g,b){const c=new Set(d()),v=n()?!c.has(a):!0;!n()&&c.has(a)||!v&&o.required===!0&&c.size===1||(n()||c.clear(),v?c.add(a):c.delete(a),e||s(c),T(b,v,g),o.onChange?.(n()?[...c]:a,g))},resetSelection(){e||s(i)}},j=Z(o,{get children(){return t?y():o.children}}),Q=w(E.Provider,{value:K,get children(){return w(be,j)}});return x||(A(p),$(ee(d,h,{defer:!0}))),Q},Ge=o=><U{...o}multiple={!1}/>,De=o=><U{...o}multiple={!0}/>;export{De as MultiChoiceSegmentedButtonRow,Se as SegmentedButton,ce as SegmentedButtonController,U as SegmentedButtonGroup,he as SegmentedButtonGroupController,Ge as SingleChoiceSegmentedButtonRow};
@@ -0,0 +1 @@
1
+ @cw-attribute-roles cw-Checkbox;@cw-attribute-roles cw-Chip;@cw-attribute-roles cw-RadioButton;@cw-attribute-roles cw-SegmentedButton;@cw-attribute-roles cw-SegmentedButtonGroup;@cw-attribute-roles cw-Switch;@layer cw-style{.cw-Checkbox,.cw-RadioButton,.cw-Switch{--cw-interactable-focusIndicator-color: cw-var(--cw-Color-secondary-fill);--cw-interactable-focusIndicator-offset: cw-var(--cw-State-focusIndicator-outerOffset);--cw-interactable-focusIndicator-thickness: cw-var(--cw-State-focusIndicator-thickness);align-items:center;box-sizing:border-box;display:inline-flex;isolation:isolate;position:relative}.cw-Checkbox-input,.cw-RadioButton-input,.cw-Switch-input{appearance:none;cursor:pointer;inset:0;margin:0;opacity:0;position:absolute;z-index:1}:is(.cw-Checkbox-disabled,.cw-RadioButton-disabled,.cw-Switch-disabled)>input{cursor:default}._cw-selection-label{min-inline-size:0}._cw-selection-label:empty{display:none}._cw-selection-label :is(a[href],button,input,label,select,textarea,[tabindex]){position:relative;z-index:2}.cw-Checkbox{--cw-interactable-ripple-radius: calc(cw-var(--cw-Checkbox-stateLayer-size)/2) ;--cw-interactable-stateLayer-color: cw-var(--cw-Checkbox-hover-stateLayerColor);--cw-selection-checkbox-container-color: transparent;--cw-selection-checkbox-icon-color: cw-var(--cw-Checkbox-icon-color);--cw-selection-checkbox-outline-color: cw-var(--cw-Checkbox-container-outlineColor);--cw-selection-checkbox-outline-width: cw-var(--cw-Checkbox-container-outlineWidth);--cw-selection-checkbox-shape: cw-var(--cw-Checkbox-container-shape);--cw-selection-checkbox-size: cw-var(--cw-Checkbox-container-size);--cw-selection-checkbox-state-layer-size: cw-var(--cw-Checkbox-stateLayer-size);--cw-selection-checkbox-target-inset: calc((cw-var(--cw-Checkbox-target-size) - cw-var(--cw-Checkbox-stateLayer-size))/2) ;color:cw-var(--cw-Checkbox-label-color);gap:calc(var(--cw-selection-checkbox-target-inset) + cw-var(--cw-Checkbox-label-spacing));min-block-size:cw-var(--cw-Checkbox-target-size);min-inline-size:cw-var(--cw-Checkbox-target-size);padding-inline:var(--cw-selection-checkbox-target-inset)}.cw-Checkbox.cw-interactable:before{block-size:var(--cw-selection-checkbox-state-layer-size);border-radius:50%;inline-size:var(--cw-selection-checkbox-state-layer-size);inset-block:calc(50% - var(--cw-selection-checkbox-state-layer-size) / 2) auto;inset-inline:var(--cw-selection-checkbox-target-inset) auto}.cw-Checkbox-box{background-clip:padding-box;background-color:var(--cw-selection-checkbox-container-color);block-size:var(--cw-selection-checkbox-size);border:var(--cw-selection-checkbox-outline-width) solid var(--cw-selection-checkbox-outline-color);border-radius:var(--cw-selection-checkbox-shape);box-sizing:border-box;flex:none;inline-size:var(--cw-selection-checkbox-size);margin-inline:calc((var(--cw-selection-checkbox-state-layer-size) - var(--cw-selection-checkbox-size)) / 2);pointer-events:none;position:relative;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration),cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:background-color,border-color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing),cw-var(--cw-Motion-spring-effect-fast-easing)}._cw-Checkbox-marks{block-size:var(--cw-selection-checkbox-size);fill:var(--cw-selection-checkbox-icon-color);inline-size:var(--cw-selection-checkbox-size);inset-block-start:calc(-1 * var(--cw-selection-checkbox-outline-width));left:calc(-1 * var(--cw-selection-checkbox-outline-width));position:absolute;transition:fill cw-var(--cw-Motion-spring-effect-fast-duration) cw-var(--cw-Motion-spring-effect-fast-easing)}._cw-Checkbox-mark{transform:scaleY(-1) translate(7px,-14px) rotate(45deg);transition-delay:.1s;transition-duration:0s;transition-property:height,transform,width}._cw-Checkbox-short{height:0;width:2px}._cw-Checkbox-long{height:2px;width:0}:is(.cw-Checkbox-indeterminate,._cw-Checkbox-from-indeterminate:not(.cw-Checkbox-checked)) ._cw-Checkbox-mark{transform:scaleY(-1) translate(4px,-10px) rotate(0)}.cw-Checkbox-checked,.cw-Checkbox-indeterminate{--cw-selection-checkbox-container-color: cw-var(--cw-Checkbox-container-selectedColor);--cw-selection-checkbox-outline-color: cw-var(--cw-Checkbox-container-selectedColor)}:is(.cw-Checkbox-checked,.cw-Checkbox-indeterminate) .cw-Checkbox-box{transition-duration:cw-var(--cw-Motion-spring-effect-default-duration),cw-var(--cw-Motion-spring-effect-default-duration);transition-timing-function:cw-var(--cw-Motion-spring-effect-default-easing),cw-var(--cw-Motion-spring-effect-default-easing)}:is(.cw-Checkbox-checked,.cw-Checkbox-indeterminate) ._cw-Checkbox-mark{transition-delay:0s;transition-duration:cw-var(--cw-Motion-spring-spatial-default-duration);transition-timing-function:cw-var(--cw-Motion-spring-spatial-default-easing)}._cw-Checkbox-from-unchecked:is(.cw-Checkbox-checked,.cw-Checkbox-indeterminate) ._cw-Checkbox-mark{transition-property:height,width}.cw-Checkbox-checked ._cw-Checkbox-short{height:5.657px}.cw-Checkbox-checked ._cw-Checkbox-long{width:11.314px}.cw-Checkbox-indeterminate ._cw-Checkbox-short{height:2px}.cw-Checkbox-indeterminate ._cw-Checkbox-long{width:10px}.cw-Checkbox-hover{--cw-interactable-stateLayer-opacity: cw-var(--cw-State-layer-hoverOpacity);--cw-selection-checkbox-outline-color: cw-var(--cw-Checkbox-hover-outlineColor)}.cw-Checkbox-focus{--cw-interactable-stateLayer-color: cw-var(--cw-Checkbox-focus-stateLayerColor);--cw-interactable-stateLayer-opacity: cw-var(--cw-State-layer-focusOpacity);--cw-selection-checkbox-outline-color: cw-var(--cw-Checkbox-focus-outlineColor)}.cw-Checkbox-press{--cw-interactable-ripple-color: cw-var(--cw-Checkbox-press-stateLayerColor);--cw-interactable-ripple-opacity: cw-var(--cw-State-layer-pressOpacity);--cw-selection-checkbox-outline-color: cw-var(--cw-Checkbox-press-outlineColor)}.cw-Checkbox:is(.cw-Checkbox-checked,.cw-Checkbox-indeterminate){--cw-interactable-stateLayer-color: cw-var(--cw-Checkbox-hover-selectedStateLayerColor);--cw-selection-checkbox-outline-color: cw-var(--cw-Checkbox-container-selectedColor)}.cw-Checkbox-focus:is(.cw-Checkbox-checked,.cw-Checkbox-indeterminate){--cw-interactable-stateLayer-color: cw-var(--cw-Checkbox-focus-selectedStateLayerColor)}.cw-Checkbox-press:is(.cw-Checkbox-checked,.cw-Checkbox-indeterminate){--cw-interactable-ripple-color: cw-var(--cw-Checkbox-press-selectedStateLayerColor)}.cw-Checkbox.cw-Checkbox-error{--cw-interactable-stateLayer-color: cw-var(--cw-Checkbox-error-stateLayerColor);--cw-selection-checkbox-icon-color: cw-var(--cw-Checkbox-error-iconColor);--cw-selection-checkbox-outline-color: cw-var(--cw-Checkbox-error-outlineColor)}.cw-Checkbox-error:is(.cw-Checkbox-checked,.cw-Checkbox-indeterminate){--cw-selection-checkbox-container-color: cw-var(--cw-Checkbox-error-selectedColor);--cw-selection-checkbox-outline-color: cw-var(--cw-Checkbox-error-selectedColor)}.cw-Checkbox.cw-Checkbox-disabled{--cw-selection-checkbox-icon-color: cw-var(--cw-Checkbox-disabled-iconColor);--cw-selection-checkbox-outline-color: cw-scale-opacity( cw-var(--cw-Checkbox-disabled-outlineColor), cw-var(--cw-Checkbox-disabled-outlineOpacity) );color:cw-scale-opacity(cw-var(--cw-Checkbox-disabled-labelColor),cw-var(--cw-Checkbox-disabled-labelOpacity));pointer-events:none}.cw-Checkbox-disabled:is(.cw-Checkbox-checked,.cw-Checkbox-indeterminate){--cw-selection-checkbox-container-color: cw-scale-opacity( cw-var(--cw-Checkbox-disabled-selectedColor), cw-var(--cw-Checkbox-disabled-selectedOpacity) );--cw-selection-checkbox-outline-color: cw-scale-opacity( cw-var(--cw-Checkbox-disabled-selectedColor), cw-var(--cw-Checkbox-disabled-selectedOpacity) )}.cw-Checkbox-disabled :is(.cw-Checkbox-box,._cw-Checkbox-marks){transition-duration:0s}.cw-RadioButton{--cw-interactable-ripple-radius: calc(cw-var(--cw-RadioButton-stateLayer-size)/2) ;--cw-interactable-stateLayer-color: cw-var(--cw-RadioButton-hover-stateLayerColor);--cw-selection-radio-color: cw-var(--cw-RadioButton-icon-color);--cw-selection-radio-dot-scale: 0;--cw-selection-radio-dot-size: cw-var(--cw-RadioButton-icon-dotSize);--cw-selection-radio-size: cw-var(--cw-RadioButton-icon-size);--cw-selection-radio-state-layer-size: cw-var(--cw-RadioButton-stateLayer-size);--cw-selection-radio-stroke-width: cw-var(--cw-RadioButton-icon-strokeWidth);--cw-selection-radio-target-inset: calc((cw-var(--cw-RadioButton-target-size) - cw-var(--cw-RadioButton-stateLayer-size))/2) ;color:cw-var(--cw-RadioButton-label-color);gap:calc(var(--cw-selection-radio-target-inset) + cw-var(--cw-RadioButton-label-spacing));min-block-size:cw-var(--cw-RadioButton-target-size);min-inline-size:cw-var(--cw-RadioButton-target-size);padding-inline:var(--cw-selection-radio-target-inset)}.cw-RadioButton.cw-interactable:before{block-size:var(--cw-selection-radio-state-layer-size);border-radius:50%;inline-size:var(--cw-selection-radio-state-layer-size);inset-block:calc(50% - var(--cw-selection-radio-state-layer-size) / 2) auto;inset-inline:var(--cw-selection-radio-target-inset) auto}.cw-RadioButton-circle{block-size:var(--cw-selection-radio-size);border:var(--cw-selection-radio-stroke-width) solid var(--cw-selection-radio-color);border-radius:50%;box-sizing:border-box;display:inline-grid;flex:none;inline-size:var(--cw-selection-radio-size);margin-inline:calc((var(--cw-selection-radio-state-layer-size) - var(--cw-selection-radio-size)) / 2);place-items:center;pointer-events:none;transition:border-color cw-var(--cw-Motion-spring-effect-default-duration) cw-var(--cw-Motion-spring-effect-default-easing)}.cw-RadioButton-circle:after{background-color:var(--cw-selection-radio-color);block-size:var(--cw-selection-radio-dot-size);border-radius:50%;content:"";inline-size:var(--cw-selection-radio-dot-size);scale:var(--cw-selection-radio-dot-scale);transition-duration:cw-var(--cw-Motion-spring-effect-default-duration),cw-var(--cw-Motion-spring-spatial-fast-duration);transition-property:background-color,scale;transition-timing-function:cw-var(--cw-Motion-spring-effect-default-easing),cw-var(--cw-Motion-spring-spatial-fast-easing)}.cw-RadioButton-hover{--cw-interactable-stateLayer-opacity: cw-var(--cw-State-layer-hoverOpacity);--cw-selection-radio-color: cw-var(--cw-RadioButton-hover-iconColor)}.cw-RadioButton-focus{--cw-interactable-stateLayer-color: cw-var(--cw-RadioButton-focus-stateLayerColor);--cw-interactable-stateLayer-opacity: cw-var(--cw-State-layer-focusOpacity);--cw-selection-radio-color: cw-var(--cw-RadioButton-focus-iconColor)}.cw-RadioButton-press{--cw-interactable-ripple-color: cw-var(--cw-RadioButton-press-stateLayerColor);--cw-interactable-ripple-opacity: cw-var(--cw-State-layer-pressOpacity);--cw-selection-radio-color: cw-var(--cw-RadioButton-press-iconColor)}.cw-RadioButton.cw-RadioButton-selected{--cw-interactable-stateLayer-color: cw-var(--cw-RadioButton-hover-selectedStateLayerColor);--cw-selection-radio-color: cw-var(--cw-RadioButton-icon-selectedColor);--cw-selection-radio-dot-scale: 1}.cw-RadioButton-focus.cw-RadioButton-selected{--cw-interactable-stateLayer-color: cw-var(--cw-RadioButton-focus-selectedStateLayerColor)}.cw-RadioButton-press.cw-RadioButton-selected{--cw-interactable-ripple-color: cw-var(--cw-RadioButton-press-selectedStateLayerColor)}.cw-RadioButton.cw-RadioButton-disabled{--cw-selection-radio-color: cw-scale-opacity( cw-var(--cw-RadioButton-disabled-iconColor), cw-var(--cw-RadioButton-disabled-iconOpacity) );color:cw-scale-opacity(cw-var(--cw-RadioButton-disabled-labelColor),cw-var(--cw-RadioButton-disabled-labelOpacity));pointer-events:none}.cw-RadioButton-disabled .cw-RadioButton-circle,.cw-RadioButton-disabled .cw-RadioButton-circle:after{transition-duration:0s}._cw-RadioGroup-horizontal,._cw-RadioGroup-vertical{border:0;display:flex;margin:0;min-inline-size:0;padding:0}._cw-RadioGroup-horizontal{flex-flow:row wrap}._cw-RadioGroup-vertical{flex-direction:column}.cw-Switch{--cw-interactable-focusIndicator-thickness: 0px;--cw-interactable-ripple-radius: calc(cw-var(--cw-Switch-stateLayer-size)/2) ;--cw-interactable-stateLayer-color: cw-var(--cw-Switch-hover-stateLayerColor);--cw-selection-switch-direction: 1;--cw-selection-switch-handle-box: cw-var(--cw-Switch-handle-pressedSize);--cw-selection-switch-handle-color: cw-var(--cw-Switch-handle-color);--cw-selection-switch-handle-offset: 0px;--cw-selection-switch-handle-size: cw-var(--cw-Switch-handle-size);--cw-selection-switch-icon-color: cw-var(--cw-Switch-icon-color);--cw-selection-switch-icon-size: cw-var(--cw-Switch-icon-size);--cw-selection-switch-inset: calc((cw-var(--cw-Switch-stateLayer-size) - cw-var(--cw-Switch-track-height))/2) ;--cw-selection-switch-state-layer-size: cw-var(--cw-Switch-stateLayer-size);--cw-selection-switch-track-color: cw-var(--cw-Switch-track-color);--cw-selection-switch-track-height: cw-var(--cw-Switch-track-height);--cw-selection-switch-track-outline-color: cw-var(--cw-Switch-track-outlineColor);--cw-selection-switch-track-outline-width: cw-var(--cw-Switch-track-outlineWidth);--cw-selection-switch-track-width: cw-var(--cw-Switch-track-width);color:cw-var(--cw-Switch-label-color);gap:cw-var(--cw-Switch-label-spacing);min-block-size:cw-var(--cw-Switch-target-size);padding-inline:var(--cw-selection-switch-inset)}.cw-Switch:dir(rtl){--cw-selection-switch-direction: -1}.cw-Switch.cw-interactable:before{block-size:var(--cw-selection-switch-state-layer-size);border-radius:50%;inline-size:var(--cw-selection-switch-state-layer-size);inset-block:calc(50% - var(--cw-selection-switch-state-layer-size) / 2) auto;inset-inline:0 auto;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration),cw-var(--cw-Motion-spring-spatial-fast-duration),cw-var(--cw-Motion-spring-spatial-fast-duration),cw-var(--cw-Motion-spring-spatial-fast-duration);transition-property:color,outline-offset,outline-width,translate;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing),cw-var(--cw-Motion-spring-spatial-fast-easing),cw-var(--cw-Motion-spring-spatial-fast-easing),cw-var(--cw-Motion-spring-spatial-fast-easing);translate:calc(var(--cw-selection-switch-direction) * var(--cw-selection-switch-handle-offset)) 0}.cw-Switch-track{background-clip:padding-box;background-color:var(--cw-selection-switch-track-color);block-size:var(--cw-selection-switch-track-height);border:var(--cw-selection-switch-track-outline-width) solid var(--cw-selection-switch-track-outline-color);border-radius:calc(var(--cw-selection-switch-track-height) / 2);box-sizing:border-box;flex:none;inline-size:var(--cw-selection-switch-track-width);outline:0 solid cw-var(--cw-Color-secondary-fill);outline-offset:0;pointer-events:none;position:relative;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration),cw-var(--cw-Motion-spring-effect-fast-duration),cw-var(--cw-Motion-spring-spatial-fast-duration),cw-var(--cw-Motion-spring-spatial-fast-duration);transition-property:background-color,border-color,outline-offset,outline-width;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing),cw-var(--cw-Motion-spring-effect-fast-easing),cw-var(--cw-Motion-spring-spatial-fast-easing),cw-var(--cw-Motion-spring-spatial-fast-easing)}.cw-Switch._cw-interactable-focusIndicator .cw-Switch-track{outline-offset:cw-var(--cw-State-focusIndicator-outerOffset);outline-width:cw-var(--cw-State-focusIndicator-thickness)}.cw-Switch-thumb{block-size:var(--cw-selection-switch-handle-box);contain:layout size style;display:grid;inline-size:var(--cw-selection-switch-handle-box);inset-block-start:calc(50% - var(--cw-selection-switch-handle-box) / 2);inset-inline-start:calc(var(--cw-selection-switch-track-height) / 2 - var(--cw-selection-switch-track-outline-width) - var(--cw-selection-switch-handle-box) / 2);place-items:center;position:absolute;transition:translate cw-var(--cw-Motion-spring-spatial-fast-duration) cw-var(--cw-Motion-spring-spatial-fast-easing);translate:calc(var(--cw-selection-switch-direction) * var(--cw-selection-switch-handle-offset)) 0}.cw-Switch-thumb:before{background-color:var(--cw-selection-switch-handle-color);block-size:var(--cw-selection-switch-handle-size);border-radius:50%;content:"";grid-area:1 / 1;inline-size:var(--cw-selection-switch-handle-size);transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration),cw-var(--cw-Motion-spring-spatial-fast-duration),cw-var(--cw-Motion-spring-spatial-fast-duration);transition-property:background-color,block-size,inline-size;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing),cw-var(--cw-Motion-spring-spatial-fast-easing),cw-var(--cw-Motion-spring-spatial-fast-easing)}.cw-Switch-selectedIcon,.cw-Switch-unselectedIcon{--cw-Icon-color: var(--cw-selection-switch-icon-color);--cw-Icon-size: var(--cw-selection-switch-icon-size);block-size:var(--cw-selection-switch-icon-size);color:var(--cw-selection-switch-icon-color);display:grid;grid-area:1 / 1;inline-size:var(--cw-selection-switch-icon-size);place-items:center;position:relative}:is(.cw-Switch-selectedIcon,.cw-Switch-unselectedIcon)>*{block-size:100%;inline-size:100%}.cw-Switch-checked .cw-Switch-unselectedIcon,.cw-Switch:not(.cw-Switch-checked) .cw-Switch-selectedIcon,:is(.cw-Switch-selectedIcon,.cw-Switch-unselectedIcon):empty{display:none}.cw-Switch:where(:has(.cw-Switch-unselectedIcon:not(:empty))){--cw-selection-switch-handle-size: cw-var(--cw-Switch-handle-selectedSize)}.cw-Switch-hover{--cw-interactable-stateLayer-opacity: cw-var(--cw-State-layer-hoverOpacity);--cw-selection-switch-handle-color: cw-var(--cw-Switch-hover-handleColor)}.cw-Switch-focus{--cw-interactable-stateLayer-color: cw-var(--cw-Switch-focus-stateLayerColor);--cw-interactable-stateLayer-opacity: cw-var(--cw-State-layer-focusOpacity);--cw-selection-switch-handle-color: cw-var(--cw-Switch-focus-handleColor)}.cw-Switch-press{--cw-interactable-ripple-color: cw-var(--cw-Switch-press-stateLayerColor);--cw-interactable-ripple-opacity: cw-var(--cw-State-layer-pressOpacity);--cw-selection-switch-handle-color: cw-var(--cw-Switch-press-handleColor)}.cw-Switch.cw-Switch-checked{--cw-interactable-stateLayer-color: cw-var(--cw-Switch-hover-selectedStateLayerColor);--cw-selection-switch-handle-color: cw-var(--cw-Switch-handle-selectedColor);--cw-selection-switch-handle-offset: calc( var(--cw-selection-switch-track-width) - var(--cw-selection-switch-track-height) );--cw-selection-switch-handle-size: cw-var(--cw-Switch-handle-selectedSize);--cw-selection-switch-icon-color: cw-var(--cw-Switch-icon-selectedColor);--cw-selection-switch-track-color: cw-var(--cw-Switch-track-selectedColor);--cw-selection-switch-track-outline-color: cw-var(--cw-Switch-track-selectedColor)}.cw-Switch-hover.cw-Switch-checked{--cw-selection-switch-handle-color: cw-var(--cw-Switch-hover-selectedHandleColor)}.cw-Switch-focus.cw-Switch-checked{--cw-interactable-stateLayer-color: cw-var(--cw-Switch-focus-selectedStateLayerColor);--cw-selection-switch-handle-color: cw-var(--cw-Switch-focus-selectedHandleColor)}.cw-Switch-press.cw-Switch-checked{--cw-interactable-ripple-color: cw-var(--cw-Switch-press-selectedStateLayerColor);--cw-selection-switch-handle-color: cw-var(--cw-Switch-press-selectedHandleColor)}.cw-Switch.cw-Switch-press{--cw-selection-switch-handle-size: cw-var(--cw-Switch-handle-pressedSize)}.cw-Switch-press .cw-Switch-thumb:before{transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration),0s,0s}.cw-Switch.cw-Switch-disabled{--cw-selection-switch-handle-color: cw-scale-opacity( cw-var(--cw-Switch-disabled-handleColor), cw-var(--cw-Switch-disabled-handleOpacity) );--cw-selection-switch-icon-color: cw-scale-opacity( cw-var(--cw-Switch-disabled-iconColor), cw-var(--cw-Switch-disabled-iconOpacity) );--cw-selection-switch-track-color: cw-scale-opacity( cw-var(--cw-Switch-disabled-trackColor), cw-var(--cw-Switch-disabled-trackOpacity) );--cw-selection-switch-track-outline-color: cw-scale-opacity( cw-var(--cw-Switch-disabled-trackOutlineColor), cw-var(--cw-Switch-disabled-trackOpacity) );color:cw-scale-opacity(cw-var(--cw-Switch-disabled-labelColor),cw-var(--cw-Switch-disabled-labelOpacity));pointer-events:none}.cw-Switch-disabled.cw-Switch-checked{--cw-selection-switch-handle-color: cw-scale-opacity( cw-var(--cw-Switch-disabled-selectedHandleColor), cw-var(--cw-Switch-disabled-selectedHandleOpacity) );--cw-selection-switch-icon-color: cw-scale-opacity( cw-var(--cw-Switch-disabled-selectedIconColor), cw-var(--cw-Switch-disabled-iconOpacity) );--cw-selection-switch-track-color: cw-scale-opacity( cw-var(--cw-Switch-disabled-selectedTrackColor), cw-var(--cw-Switch-disabled-trackOpacity) );--cw-selection-switch-track-outline-color: cw-scale-opacity( cw-var(--cw-Switch-disabled-selectedTrackColor), cw-var(--cw-Switch-disabled-trackOpacity) )}.cw-AssistChip,.cw-FilterChip,.cw-InputChip,.cw-SuggestionChip{--cw-Chip-container-outlineColor: cw-var(--cw-Chip-container-outlineColor, default);--cw-Chip-container-selectedColor: cw-var(--cw-Chip-container-selectedColor, default);--cw-Chip-disabled-containerColor: cw-var(--cw-Chip-disabled-containerColor, default);--cw-Chip-disabled-contentColor: cw-var(--cw-Chip-disabled-contentColor, default);--cw-Chip-disabled-outlineColor: cw-var(--cw-Chip-disabled-outlineColor, default);--cw-Chip-focus-outlineColor: cw-var(--cw-Chip-focus-outlineColor, default);--cw-Chip-icon-color: cw-var(--cw-Chip-icon-color, default);--cw-Chip-icon-selectedColor: cw-var(--cw-Chip-icon-selectedColor, default);--cw-Chip-icon-selectedTrailingColor: cw-var(--cw-Chip-icon-selectedTrailingColor, default);--cw-Chip-icon-trailingColor: cw-var(--cw-Chip-icon-trailingColor, default);--cw-Chip-label-color: cw-var(--cw-Chip-label-color, default);--cw-Chip-label-selectedColor: cw-var(--cw-Chip-label-selectedColor, default);--cw-Chip-press-selectedStateLayerColor: cw-var(--cw-Chip-press-selectedStateLayerColor, default);--cw-Chip-press-stateLayerColor: cw-var(--cw-Chip-press-stateLayerColor, default);--cw-elevationShadow-level: cw-var(--cw-Chip-container-elevation);--cw-interactable-focusIndicator-color: cw-var(--cw-Color-secondary-fill);--cw-interactable-focusIndicator-offset: cw-var(--cw-State-focusIndicator-outerOffset);--cw-interactable-focusIndicator-thickness: cw-var(--cw-State-focusIndicator-thickness);--cw-interactable-stateLayer-color: currentcolor;--cw-selection-chip-avatar-size: cw-var(--cw-Chip-avatar-size);--cw-selection-chip-half-height: calc(cw-var(--cw-Chip-container-height)/2) ;--cw-selection-chip-icon-color: cw-var(--cw-Chip-icon-color);--cw-selection-chip-icon-padding: cw-var(--cw-Chip-container-iconPadding);--cw-selection-chip-icon-size: cw-var(--cw-Chip-icon-size);--cw-selection-chip-label-spacing: cw-var(--cw-Chip-label-spacing);--cw-selection-chip-padding: cw-var(--cw-Chip-container-padding);--cw-selection-chip-target-size: cw-var(--cw-Chip-target-size);--cw-selection-chip-trailing-color: cw-var(--cw-Chip-icon-trailingColor);background-color:cw-var(--cw-Chip-container-color);block-size:cw-var(--cw-Chip-container-height);border-radius:min(cw-var(--cw-Chip-container-shape),var(--cw-selection-chip-half-height));box-sizing:border-box;color:cw-var(--cw-Chip-label-color);display:inline-flex;isolation:isolate;max-inline-size:100%;outline:cw-var(--cw-Chip-container-outlineWidth) solid cw-var(--cw-Chip-container-outlineColor);outline-offset:calc(-1*cw-var(--cw-Chip-container-outlineWidth));position:relative;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration),cw-var(--cw-Motion-spring-spatial-fast-duration),cw-var(--cw-Motion-spring-effect-fast-duration),cw-var(--cw-Motion-spring-effect-fast-duration),cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:background-color,border-radius,box-shadow,color,outline-color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing),cw-var(--cw-Motion-spring-spatial-fast-easing),cw-var(--cw-Motion-spring-effect-fast-easing),cw-var(--cw-Motion-spring-effect-fast-easing),cw-var(--cw-Motion-spring-effect-fast-easing);vertical-align:middle}:is(.cw-AssistChip-button,.cw-FilterChip-button,.cw-InputChip-button,.cw-SuggestionChip-button){align-items:center;background:none;border:0;border-radius:inherit;box-sizing:border-box;color:inherit;cursor:pointer;display:inline-flex;flex:auto;font:inherit;margin:0;min-inline-size:0;outline:none;padding-block:0;padding-inline:var(--cw-selection-chip-padding);position:relative;transition:padding-inline cw-var(--cw-Motion-spring-spatial-fast-duration) cw-var(--cw-Motion-spring-spatial-fast-easing)}:is(.cw-AssistChip-button,.cw-FilterChip-button,.cw-InputChip-button,.cw-SuggestionChip-button,.cw-FilterChip-remove,.cw-InputChip-remove):before{content:"";inset-block:calc(50% - var(--cw-selection-chip-target-size) / 2);inset-inline:0;position:absolute}:is(.cw-AssistChip-button,.cw-FilterChip-button,.cw-InputChip-button,.cw-SuggestionChip-button):has(>._cw-Chip-leading>._cw-Chip-leadingIcon:not(:empty)){padding-inline-start:var(--cw-selection-chip-icon-padding)}.cw-InputChip-button:has(>._cw-Chip-leading>._cw-Chip-avatar:not(:empty)){padding-inline-start:var(--cw-selection-chip-padding)}:is(.cw-AssistChip-button,.cw-FilterChip-button,.cw-InputChip-button,.cw-SuggestionChip-button):has(>._cw-Chip-trailingIcon:not(:empty)){padding-inline-end:var(--cw-selection-chip-icon-padding)}:is(.cw-FilterChip-removable,.cw-InputChip-removable)>:is(.cw-FilterChip-button,.cw-InputChip-button){padding-inline-end:0}._cw-Chip-leading,._cw-Chip-trailingIcon{align-items:center;block-size:var(--cw-selection-chip-icon-size);display:inline-grid;flex:none;inline-size:0;justify-items:center;overflow:visible;pointer-events:none}._cw-Chip-leading{color:var(--cw-selection-chip-icon-color);transition:inline-size cw-var(--cw-Motion-spring-effect-default-duration) cw-var(--cw-Motion-spring-effect-default-easing)}._cw-Chip-leading:has(>._cw-Chip-leadingIcon:not(:empty)),.cw-FilterChip-selected ._cw-Chip-leading{inline-size:var(--cw-selection-chip-icon-size);transition:inline-size cw-var(--cw-Motion-spring-spatial-fast-duration) cw-var(--cw-Motion-spring-spatial-fast-easing)}._cw-Chip-leading:has(>._cw-Chip-avatar:not(:empty)){block-size:var(--cw-selection-chip-avatar-size);inline-size:var(--cw-selection-chip-avatar-size)}._cw-Chip-trailingIcon{color:var(--cw-selection-chip-trailing-color)}._cw-Chip-trailingIcon:not(:empty){inline-size:var(--cw-selection-chip-icon-size)}:is(._cw-Chip-checkmark,._cw-Chip-avatar,._cw-Chip-leadingIcon){grid-area:1 / 1}:is(._cw-Chip-avatar,._cw-Chip-leadingIcon):empty{display:none}:is(._cw-Chip-leadingIcon,._cw-Chip-trailingIcon) .cw-Icon{--cw-Icon-color: currentcolor;--cw-Icon-size: var(--cw-selection-chip-icon-size)}:is(._cw-Chip-leadingIcon,._cw-Chip-trailingIcon)>:not(.cw-Icon){block-size:var(--cw-selection-chip-icon-size);inline-size:var(--cw-selection-chip-icon-size)}._cw-Chip-leadingIcon{display:inline-grid;opacity:1;transition:opacity cw-var(--cw-Motion-spring-effect-fast-duration) cw-var(--cw-Motion-spring-effect-fast-easing)}._cw-Chip-avatar{block-size:var(--cw-selection-chip-avatar-size);border-radius:50%;display:inline-grid;inline-size:var(--cw-selection-chip-avatar-size);overflow:hidden}._cw-Chip-avatar>*{block-size:100%;inline-size:100%;object-fit:cover}._cw-Chip-avatar:not(:empty)~._cw-Chip-leadingIcon{display:none}._cw-Chip-checkmark{block-size:var(--cw-selection-chip-icon-size);fill:none;inline-size:var(--cw-selection-chip-icon-size);opacity:0;stroke:currentcolor;stroke-width:2px;transition:opacity cw-var(--cw-Motion-spring-effect-fast-duration) cw-var(--cw-Motion-spring-effect-fast-easing)}.cw-FilterChip-selected ._cw-Chip-checkmark{opacity:1;transition:opacity cw-var(--cw-Motion-spring-effect-slow-duration) cw-var(--cw-Motion-spring-effect-slow-easing)}.cw-FilterChip-selected ._cw-Chip-leadingIcon{opacity:0}._cw-Chip-label{-cw-typescale:--cw-Typescale-label-large;min-inline-size:0;overflow:hidden;padding-inline:var(--cw-selection-chip-label-spacing);text-overflow:ellipsis;white-space:nowrap}:is(.cw-FilterChip-remove,.cw-InputChip-remove){align-items:center;background:none;border:0;color:var(--cw-selection-chip-trailing-color);cursor:pointer;display:inline-flex;flex:none;margin:0;outline:none;padding-block:0;padding-inline:0 var(--cw-selection-chip-icon-padding);position:relative}:is(.cw-FilterChip-remove,.cw-InputChip-remove)[hidden]{display:none}:is(.cw-FilterChip-remove,.cw-InputChip-remove):after{--cw-selection-chip-remove-opacity: 0;background-color:currentcolor;block-size:calc(var(--cw-selection-chip-icon-size) * 4 / 3);border-radius:50%;color:cw-scale-opacity(var(--cw-selection-chip-trailing-color),var(--cw-selection-chip-remove-opacity));content:"";inline-size:calc(var(--cw-selection-chip-icon-size) * 4 / 3);inset-block-start:calc(50% - var(--cw-selection-chip-icon-size) * 2 / 3);inset-inline-start:calc(var(--cw-selection-chip-icon-size) / -6);outline:0 solid cw-var(--cw-Color-secondary-fill);pointer-events:none;position:absolute;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration),cw-var(--cw-Motion-spring-spatial-fast-duration),cw-var(--cw-Motion-spring-spatial-fast-duration);transition-property:color,outline-offset,outline-width;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing),cw-var(--cw-Motion-spring-spatial-fast-easing),cw-var(--cw-Motion-spring-spatial-fast-easing)}:is(.cw-FilterChip-remove,.cw-InputChip-remove):hover:after{--cw-selection-chip-remove-opacity: cw-var(--cw-State-layer-hoverOpacity)}:is(.cw-FilterChip-remove,.cw-InputChip-remove):focus-visible:after{--cw-selection-chip-remove-opacity: cw-var(--cw-State-layer-focusOpacity);outline-offset:cw-var(--cw-State-focusIndicator-outerOffset);outline-width:cw-var(--cw-State-focusIndicator-thickness)}:is(.cw-FilterChip-remove,.cw-InputChip-remove):active:after{--cw-selection-chip-remove-opacity: cw-var(--cw-State-layer-pressOpacity)}._cw-Chip-removeIcon{block-size:var(--cw-selection-chip-icon-size);fill:none;inline-size:var(--cw-selection-chip-icon-size);position:relative;stroke:currentcolor;stroke-width:1.5px}.cw-FilterChip:has(>.cw-FilterChip-remove:hover),.cw-InputChip:has(>.cw-InputChip-remove:hover){--cw-interactable-stateLayer-opacity: 0}:is(.cw-AssistChip-hover,.cw-FilterChip-hover,.cw-InputChip-hover,.cw-SuggestionChip-hover){--cw-elevationShadow-level: cw-var(--cw-Chip-hover-elevation);--cw-interactable-stateLayer-opacity: cw-var(--cw-State-layer-hoverOpacity)}:is(.cw-AssistChip-focus,.cw-FilterChip-focus,.cw-InputChip-focus,.cw-SuggestionChip-focus){--cw-elevationShadow-level: cw-var(--cw-Chip-focus-elevation);--cw-interactable-stateLayer-opacity: cw-var(--cw-State-layer-focusOpacity);outline-color:cw-var(--cw-Chip-focus-outlineColor)}:is(.cw-AssistChip-press,.cw-FilterChip-press,.cw-InputChip-press,.cw-SuggestionChip-press){--cw-elevationShadow-level: cw-var(--cw-Chip-press-elevation);--cw-interactable-ripple-color: var(--cw-interactable-stateLayer-color);--cw-interactable-ripple-opacity: cw-var(--cw-State-layer-pressOpacity)}:is(.cw-AssistChip-drag,.cw-FilterChip-drag,.cw-InputChip-drag,.cw-SuggestionChip-drag){--cw-elevationShadow-level: cw-var(--cw-Chip-drag-elevation);--cw-interactable-stateLayer-opacity: cw-var(--cw-State-layer-dragOpacity)}:is(.cw-FilterChip,.cw-InputChip):is(.cw-FilterChip-selected,.cw-InputChip-selected){--cw-selection-chip-icon-color: cw-var(--cw-Chip-icon-selectedColor);--cw-selection-chip-trailing-color: cw-var(--cw-Chip-icon-selectedTrailingColor);background-color:cw-var(--cw-Chip-container-selectedColor);border-radius:min(cw-var(--cw-Chip-container-selectedShape),var(--cw-selection-chip-half-height));color:cw-var(--cw-Chip-label-selectedColor);outline-color:transparent}.cw-FilterChip-hover.cw-FilterChip-selected,.cw-InputChip-hover.cw-InputChip-selected{--cw-elevationShadow-level: cw-var(--cw-Chip-hover-selectedElevation)}.cw-FilterChip.cw-FilterChip-press{--cw-interactable-ripple-color: cw-var(--cw-Chip-press-stateLayerColor)}.cw-FilterChip-press.cw-FilterChip-selected{--cw-interactable-ripple-color: cw-var(--cw-Chip-press-selectedStateLayerColor)}.cw-FilterChip-press.cw-FilterChip-expressive,.cw-InputChip-press.cw-InputChip-expressive{border-radius:min(cw-var(--cw-Chip-container-pressedShape),var(--cw-selection-chip-half-height))}:is(.cw-AssistChip-disabled,.cw-FilterChip-disabled,.cw-InputChip-disabled,.cw-SuggestionChip-disabled){--cw-elevationShadow-level: cw-var(--cw-Chip-disabled-elevation);--cw-selection-chip-icon-color: currentcolor;--cw-selection-chip-trailing-color: currentcolor;color:cw-scale-opacity(cw-var(--cw-Chip-disabled-contentColor),cw-var(--cw-Chip-disabled-contentOpacity));outline-color:cw-scale-opacity(cw-var(--cw-Chip-disabled-outlineColor),cw-var(--cw-Chip-disabled-outlineOpacity));pointer-events:none}:is(._cw-AssistChip-elevated.cw-AssistChip-disabled,._cw-FilterChip-elevated.cw-FilterChip-disabled,._cw-SuggestionChip-elevated.cw-SuggestionChip-disabled,.cw-FilterChip-selected.cw-FilterChip-disabled,.cw-InputChip-selected.cw-InputChip-disabled){background-color:cw-scale-opacity(cw-var(--cw-Chip-disabled-containerColor),cw-var(--cw-Chip-disabled-containerOpacity));color:cw-scale-opacity(cw-var(--cw-Chip-disabled-contentColor),cw-var(--cw-Chip-disabled-contentOpacity))}:is(.cw-FilterChip-disabled,.cw-InputChip-disabled) ._cw-Chip-avatar{opacity:cw-var(--cw-Chip-disabled-contentOpacity)}:is(.cw-AssistChip-disabled,.cw-FilterChip-disabled,.cw-InputChip-disabled,.cw-SuggestionChip-disabled) button{cursor:default}.cw-SegmentedButton{--cw-interactable-focusIndicator-color: cw-var(--cw-Color-secondary-fill);--cw-interactable-focusIndicator-offset: cw-var(--cw-State-focusIndicator-outerOffset);--cw-interactable-focusIndicator-thickness: cw-var(--cw-State-focusIndicator-thickness);--cw-interactable-stateLayer-color: currentcolor;--cw-selection-segmented-container-color: transparent;--cw-selection-segmented-container-height: cw-var(--cw-SegmentedButton-containerHeight);--cw-selection-segmented-content-spacing: cw-var(--cw-SegmentedButton-contentSpacing);--cw-selection-segmented-direction: 1;--cw-selection-segmented-first-shape: 0px;--cw-selection-segmented-horizontal-padding: cw-var( --cw-SegmentedButton-horizontalPadding );--cw-selection-segmented-icon-size: cw-var(--cw-SegmentedButton-iconSize);--cw-selection-segmented-last-shape: 0px;--cw-selection-segmented-outline-color: cw-var(--cw-SegmentedButton-outlineColor);--cw-selection-segmented-outline-thickness: cw-var(--cw-SegmentedButton-outlineThickness);--cw-selection-segmented-overlap: 0px;--cw-selection-segmented-shape: min( cw-var(--cw-SegmentedButton-shape), cw-var(--cw-SegmentedButton-containerHeight) / 2 );align-items:center;background:none;border:0;border-radius:var(--cw-selection-segmented-shape);box-sizing:border-box;color:cw-var(--cw-SegmentedButton-unselectedLabelTextColor);cursor:pointer;display:inline-flex;font:inherit;gap:var(--cw-selection-segmented-content-spacing);isolation:isolate;justify-content:center;margin:0;min-block-size:cw-var(--cw-SegmentedButton-targetSize);min-inline-size:cw-var(--cw-SegmentedButton-targetSize);padding-block:0;padding-inline:var(--cw-selection-segmented-horizontal-padding);position:relative;transition-duration:cw-var(--cw-Motion-spring-spatial-fast-duration),cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:border-radius,color;transition-timing-function:cw-var(--cw-Motion-spring-spatial-fast-easing),cw-var(--cw-Motion-spring-effect-fast-easing)}.cw-SegmentedButton:dir(rtl){--cw-selection-segmented-direction: -1}.cw-SegmentedButton.cw-interactable:before,.cw-SegmentedButton:after{inset-block:calc(50% - var(--cw-selection-segmented-container-height) / 2);inset-inline:calc(-1 * var(--cw-selection-segmented-overlap)) 0}.cw-SegmentedButton:after{background-color:var(--cw-selection-segmented-container-color);border:var(--cw-selection-segmented-outline-thickness) solid var(--cw-selection-segmented-outline-color);border-radius:inherit;box-sizing:border-box;content:"";pointer-events:none;position:absolute;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration),cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:background-color,border-color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing),cw-var(--cw-Motion-spring-effect-fast-easing);z-index:-2}._cw-SegmentedButton-icon{block-size:var(--cw-selection-segmented-icon-size);display:inline-grid;flex:none;inline-size:var(--cw-selection-segmented-icon-size);place-items:center;pointer-events:none}._cw-SegmentedButton-checkmark,._cw-SegmentedButton-iconContent{block-size:100%;grid-area:1 / 1;inline-size:100%}._cw-SegmentedButton-checkmark{fill:none;opacity:0;scale:0;stroke:currentcolor;stroke-width:2px;transform-origin:0 100%;transition-duration:cw-var(--cw-Motion-spring-effect-default-duration),cw-var(--cw-Motion-spring-spatial-fast-duration);transition-property:opacity,scale;transition-timing-function:cw-var(--cw-Motion-spring-effect-default-easing),cw-var(--cw-Motion-spring-spatial-fast-easing)}._cw-SegmentedButton-iconContent{display:inline-grid;place-items:center;transition:opacity cw-var(--cw-Motion-spring-effect-default-duration) cw-var(--cw-Motion-spring-effect-default-easing)}._cw-SegmentedButton-iconContent .cw-Icon{--cw-Icon-color: currentcolor;--cw-Icon-size: var(--cw-selection-segmented-icon-size)}._cw-SegmentedButton-iconContent>:not(.cw-Icon){block-size:100%;inline-size:100%}._cw-SegmentedButton-label{-cw-typescale:--cw-Typescale-label-large;transition:translate cw-var(--cw-Motion-spring-spatial-fast-duration) cw-var(--cw-Motion-spring-spatial-fast-easing);white-space:nowrap}.cw-SegmentedButton:not(.cw-SegmentedButton-selected)>._cw-SegmentedButton-icon:has(>._cw-SegmentedButton-iconContent:empty)+._cw-SegmentedButton-label{translate:calc(var(--cw-selection-segmented-direction) * (var(--cw-selection-segmented-icon-size) + var(--cw-selection-segmented-content-spacing)) / -2) 0}.cw-SegmentedButton-selected{--cw-selection-segmented-container-color: cw-var( --cw-SegmentedButton-selectedContainerColor );color:cw-var(--cw-SegmentedButton-selectedLabelTextColor)}.cw-SegmentedButton-selected ._cw-SegmentedButton-checkmark{opacity:1;scale:1}._cw-SegmentedButton-icon:has(>._cw-SegmentedButton-iconContent:not(:empty))>._cw-SegmentedButton-checkmark{scale:1;transition:opacity cw-var(--cw-Motion-spring-effect-default-duration) cw-var(--cw-Motion-spring-effect-default-easing)}.cw-SegmentedButton-selected ._cw-SegmentedButton-iconContent{opacity:0}.cw-SegmentedButton-hover{--cw-interactable-stateLayer-opacity: cw-var(--cw-State-layer-hoverOpacity)}.cw-SegmentedButton-focus{--cw-interactable-stateLayer-opacity: cw-var(--cw-State-layer-focusOpacity)}.cw-SegmentedButton-press{--cw-interactable-ripple-color: var(--cw-interactable-stateLayer-color);--cw-interactable-ripple-opacity: cw-var(--cw-State-layer-pressOpacity)}.cw-SegmentedButton.cw-SegmentedButton-disabled{--cw-selection-segmented-outline-color: cw-scale-opacity( cw-var(--cw-SegmentedButton-disabledOutlineColor), cw-var(--cw-SegmentedButton-disabledOutlineOpacity) );color:cw-scale-opacity(cw-var(--cw-SegmentedButton-disabledLabelTextColor),cw-var(--cw-SegmentedButton-disabledLabelTextOpacity));cursor:default;pointer-events:none}.cw-SegmentedButton.cw-SegmentedButton-invalid{cursor:default;pointer-events:none}.cw-SegmentedButtonGroup{--cw-selection-segmented-group-spacing: cw-var(--cw-SegmentedButtonGroup-spacing);gap:var(--cw-selection-segmented-group-spacing);isolation:isolate}:where(.cw-SegmentedButtonGroup){display:inline-grid;grid-auto-columns:1fr;grid-auto-flow:column}:where(._cw-SegmentedButtonGroup-vertical){grid-auto-flow:row;grid-auto-rows:1fr}.cw-SegmentedButton-grouped.cw-SegmentedButton-first{--cw-selection-segmented-first-shape: var(--cw-selection-segmented-shape)}.cw-SegmentedButton-grouped.cw-SegmentedButton-last,.cw-SegmentedButton-grouped:where(.cw-SegmentedButtonGroup>*):last-child{--cw-selection-segmented-last-shape: var(--cw-selection-segmented-shape)}.cw-SegmentedButton-grouped:not(.cw-SegmentedButton-first){--cw-selection-segmented-overlap: max( 0px, var(--cw-selection-segmented-outline-thickness) - var(--cw-selection-segmented-group-spacing) )}.cw-SegmentedButton.cw-SegmentedButton-grouped{border-end-end-radius:var(--cw-selection-segmented-last-shape);border-end-start-radius:var(--cw-selection-segmented-first-shape);border-start-end-radius:var(--cw-selection-segmented-last-shape);border-start-start-radius:var(--cw-selection-segmented-first-shape)}.cw-SegmentedButton-grouped:is(.cw-SegmentedButton-selected,.cw-SegmentedButton-focus,.cw-SegmentedButton-press){z-index:1}.cw-SegmentedButton-grouped.cw-SegmentedButton-selected:is(.cw-SegmentedButton-focus,.cw-SegmentedButton-press){z-index:2}.cw-SegmentedButton.cw-SegmentedButton-vertical{border-end-start-radius:var(--cw-selection-segmented-last-shape);border-start-end-radius:var(--cw-selection-segmented-first-shape)}.cw-SegmentedButton-vertical.cw-interactable:before,.cw-SegmentedButton-vertical:after{inset-block:calc(-1 * var(--cw-selection-segmented-overlap)) 0;inset-inline:0}@media (forced-colors: active){.cw-Checkbox-box,._cw-Checkbox-marks,.cw-RadioButton-circle,.cw-Switch-track,.cw-Switch-thumb{forced-color-adjust:none}.cw-Checkbox.cw-Checkbox{--cw-selection-checkbox-icon-color: Canvas;--cw-selection-checkbox-outline-color: CanvasText}.cw-Checkbox:is(.cw-Checkbox-checked,.cw-Checkbox-indeterminate){--cw-selection-checkbox-container-color: CanvasText}.cw-Checkbox.cw-Checkbox-disabled{--cw-selection-checkbox-outline-color: GrayText}.cw-Checkbox-disabled:is(.cw-Checkbox-checked,.cw-Checkbox-indeterminate){--cw-selection-checkbox-container-color: GrayText;--cw-selection-checkbox-outline-color: GrayText}.cw-RadioButton.cw-RadioButton{--cw-selection-radio-color: CanvasText}.cw-RadioButton.cw-RadioButton-disabled{--cw-selection-radio-color: GrayText}.cw-Switch.cw-Switch{--cw-selection-switch-handle-color: CanvasText;--cw-selection-switch-icon-color: Canvas;--cw-selection-switch-track-color: Canvas;--cw-selection-switch-track-outline-color: CanvasText}.cw-Switch.cw-Switch-checked{--cw-selection-switch-handle-color: Canvas;--cw-selection-switch-icon-color: CanvasText;--cw-selection-switch-track-color: CanvasText}.cw-Switch.cw-Switch-disabled{--cw-selection-switch-handle-color: GrayText;--cw-selection-switch-track-outline-color: GrayText}.cw-Switch-disabled.cw-Switch-checked{--cw-selection-switch-handle-color: Canvas;--cw-selection-switch-track-color: GrayText}:is(.cw-FilterChip-selected,.cw-InputChip-selected,.cw-SegmentedButton-selected){outline:2px solid Highlight;outline-offset:-2px}}@media (prefers-reduced-motion: reduce){._cw-Checkbox-mark{transition-delay:0s}}}@layer cw-theme{.cw-AssistChip{@cw-apply-theme assist,cw-Chip;}.cw-InputChip{@cw-apply-theme input,cw-Chip;}._cw-AssistChip-elevated,._cw-FilterChip-elevated,._cw-SuggestionChip-elevated{@cw-apply-theme elevated,cw-Chip;}.cw-FilterChip-expressive,.cw-InputChip-expressive{@cw-apply-theme expressive,cw-Chip;}}
@@ -0,0 +1,14 @@
1
+ import{onCleanup as l,onMount as h}from"solid-js";import{defineInteractableComponent as u}from"../state";import{InteractableController as p}from"../state/controller";import{SELECTION_INTERACTION_STATES as d,applyNativeSelectionAttributes as m,notifySelectionChange as S,observeFormReset as C,splitContainerElementProps as f}from"./base";import"./selection.css";const c="cw-Switch-checked",o="cw-Switch-disabled",r="cw-Switch-input";function a(n,e){return<span class="cw-Switch-track"aria-hidden="true">
2
+ <span class="cw-Switch-thumb">
3
+ <span class="cw-Switch-selectedIcon">{n()}</span>
4
+ <span class="cw-Switch-unselectedIcon">{e()}</span>
5
+ </span>
6
+ </span>}class b extends p{#t;#i;#s;#e;#n;constructor(e){super(e,{baseInteractionCssClassName:"cw-Switch",enabledInteractionStates:d}),this.#t="checked"in e,this.#i=t=>this.#d(t),this.#s=!1,this.#e=!1,this.#n=void 0,h(()=>{const t=super.functionElement;t!==null&&(this.#n=C(t,()=>this.#c()))}),l(()=>{this.#n?.(),this.#n=void 0})}#c(){const e=super.functionElement;e!==null&&(this.#t&&(e.checked=this.props.checked===!0),super.setClass(c,e.checked))}#d(e){const t=super.functionElement;t===null||this.#e||(S([this.props.onChange,this.props.onCheckedChange],t.checked,e),this.#c())}applyComponentProps(){const e=super.readProps(["checked","defaultChecked","disabled","name","required","tabIndex","value"]),t=super.functionElement;t!==null&&(this.#s||(this.#s=!0,t.defaultChecked=e.defaultChecked===!0,this.#t||(t.checked=e.defaultChecked===!0)),this.#t&&e.checkedChanged&&(t.checked=e.checked===!0),e.disabledChanged&&(this.#e=e.disabled===!0,super.setClass(o,this.#e),super.setEnabledInteractionStates(this.#e?0:d)),(e.disabledChanged||e.nameChanged||e.requiredChanged||e.tabIndexChanged||e.valueChanged)&&m(t,e,(s,i)=>super.setAttribute(s,i)),super.setClass(c,t.checked))}onFunctionElementChanged(e){super.functionElement?.removeEventListener("change",this.#i),super.onFunctionElementChanged(e),e?.addEventListener("change",this.#i)}render(e,t){return<label class="cw-Switch">
7
+ <input class={r}ref={t}role="switch"type="checkbox"/>
8
+ {a(()=>this.props.selectedIcon,()=>this.props.unselectedIcon)}
9
+ <span class="_cw-selection-label">{e}</span>
10
+ </label>}}function w(n,e){const[t,s]=f(n),i=("checked"in e?e.checked:e.defaultChecked)===!0;return<label{...t}classList={{...t.classList,[c]:i,[o]:e.disabled===!0,"cw-Switch":!0}}>
11
+ <input{...s}checked={i}class={r}disabled={e.disabled===!0}name={e.name}required={e.required===!0}role="switch"tabIndex={e.tabIndex}type="checkbox"value={e.value}/>
12
+ {a(()=>e.selectedIcon,()=>e.unselectedIcon)}
13
+ <span class="_cw-selection-label">{n.children}</span>
14
+ </label>}const L=u(()=>w,()=>b);export{L as Switch,b as SwitchController};
@@ -0,0 +1 @@
1
+ import{checkArgument as n}from"../util";class t{static Unrounded=new t;radius;smoothing;constructor(e=0,r=0){n(Number.isFinite(e)&&e>=0,"corner radius must be at least 0"),n(r>=0&&r<=1,"corner smoothing must be in [0, 1]"),this.radius=e,this.smoothing=r,Object.freeze(this)}}export{t as CornerRounding};
@@ -0,0 +1 @@
1
+ import{checkArgument as M}from"../util";import{Point as f,checkPoint as z,directionVector as $,isConvex as I}from"./point";const w=1e-4;let p;class y{points;constructor(n){const t=p;if(p=void 0,t==="frame"){this.points=n;return}M(n.length===8,"a cubic curve requires exactly eight coordinates"),M(t?N(n):n.every(Number.isFinite),"cubic coordinates must be finite"),this.points=Object.freeze(t?n:Array.from(n)),Object.freeze(this)}get anchor0X(){return this.points[0]}get anchor0Y(){return this.points[1]}get control0X(){return this.points[2]}get control0Y(){return this.points[3]}get control1X(){return this.points[4]}get control1Y(){return this.points[5]}get anchor1X(){return this.points[6]}get anchor1Y(){return this.points[7]}static fromPoints(n,t,r,u){return x([n.x,n.y,t.x,t.y,r.x,r.y,u.x,u.y])}static straightLine(n,t,r,u){return x([n,t,n+(r-n)/3,t+(u-t)/3,n+2*(r-n)/3,t+2*(u-t)/3,r,u])}static circularArc(n,t,r,u,i,o){const c=r-n,b=u-t,m=$(c,b),s=$(i-n,o-t),a=m.dot(s);if(a>.999)return y.straightLine(r,u,i,o);const h=Math.sqrt(c*c+b*b)*4/3*(Math.sqrt(2*(1-a))-Math.sqrt(Math.max(0,1-a*a)))/(1-a)*(-m.y*(i-n)+m.x*(o-t)>=0?1:-1);return x([r,u,r-m.y*h,u+m.x*h,i+s.y*h,o-s.x*h,i,o])}static empty(n,t){return x([n,t,n,t,n,t,n,t])}static interpolate(n,t,r){const u=[];F(r);for(let i=0;i<8;i++)u.push(n.points[i]+(t.points[i]-n.points[i])*r);return B(u)}pointAt(n){return new f(P(this.points,0,n),P(this.points,1,n))}zeroLength(){return q(this.points,0)}convexTo(n){const[t,r,,,,,u,i]=this.points;return I(new f(t,r),new f(u,i),new f(n.points[6],n.points[7]))}calculateBounds(n=[0,0,0,0],t=!1){return Y(n),j(n),S(n,this.points,0,t),n}split(n){return T(this.points,0,n).map(x)}reverse(){return x(O(this.points))}transformed(n){const{points:t}=this;return y.fromPoints(n(t[0],t[1]),n(t[2],t[3]),n(t[4],t[5]),n(t[6],t[7]))}equals(n){return n instanceof y&&this.points.every((t,r)=>t===n.points[r])}toString(){const[n,t,r,u,i,o,c,b]=this.points;return`Cubic(${n},${t} ${r},${u} ${i},${o} ${c},${b})`}}function x(e){return p="frozen",new y(e)}function B(e){return p="frame",new y(e)}function F(e){M(Number.isFinite(e),"interpolation progress must be finite")}function N(e){let n=0;for(let t=0;t<8;t++)n+=e[t]*0;return n===0}function O(e){return[e[6],e[7],e[4],e[5],e[2],e[3],e[0],e[1]]}function P(e,n,t){const r=1-t,u=r*r,i=t*t;return e[n]*u*r+e[n+2]*3*t*u+e[n+4]*3*i*r+e[n+6]*i*t}function T(e,n,t){const r=1-t,u=P(e,n,t),i=P(e,n+1,t),o=e[n],c=e[n+1],b=e[n+2],m=e[n+3],s=e[n+4],a=e[n+5],h=e[n+6],l=e[n+7];return z(u,i),[[o,c,o*r+b*t,c*r+m*t,o*r*r+b*2*r*t+s*t*t,c*r*r+m*2*r*t+a*t*t,u,i],[u,i,b*r*r+s*2*r*t+h*t*t,m*r*r+a*2*r*t+l*t*t,s*r+h*t,a*r+l*t,h,l]]}function q(e,n){for(let t=0;t<8;t++)if(!(Math.abs(e[n+t]-e[n+(t&1)])<w))return!1;return!0}function E(e,n){return Math.abs(e.points[6]-n.points[0])<=w&&Math.abs(e.points[7]-n.points[1])<=w}function Y(e){M(e.length>=4,"bounds buffer must have at least four entries")}function j(e){e[0]=e[1]=1/0,e[2]=e[3]=-1/0}function S(e,n,t,r){const u=q(n,t);for(let i=0;i<2;i++){const o=n[t+i],c=n[t+i+2],b=n[t+i+4],m=n[t+i+6];let s=o,a=o;if(!u)if(s=Math.min(o,m),a=Math.max(o,m),r)s=Math.min(s,c,b),a=Math.max(a,c,b);else{const h=-o+3*c-3*b+m,l=2*o-4*c+2*b,L=-o+c,k=l*l-4*h*L,v=[];Math.abs(h)>=1e-4?k>0&&v.push((-l+Math.sqrt(k))/(2*h),(-l-Math.sqrt(k))/(2*h)):Math.abs(l)>=1e-4&&v.push(-L/l);for(const C of v)if(C>0&&C<1){const d=1-C,A=o*d*d*d+3*c*C*d*d+3*b*C*C*d+m*C*C*C;s=Math.min(s,A),a=Math.max(a,A)}}e[i]=Math.min(e[i],s),e[i+2]=Math.max(e[i+2],a)}}export{w as CUBIC_CONTINUITY_EPSILON,y as Cubic,Y as checkBounds,F as checkProgress,P as coordinateOf,S as extendBounds,E as isContiguous,q as isZeroLength,B as newFrameCubic,x as newFrozenCubic,j as resetBounds,O as reverseCoordinates,T as splitCoordinates};
@@ -0,0 +1 @@
1
+ import{CornerRounding as t}from"./corner-rounding";import{CUBIC_CONTINUITY_EPSILON as p,Cubic as a}from"./cubic";import{MATERIAL_SHAPE_NAMES as i,MaterialShapes as m}from"./material-shapes";import{Morph as h}from"./morph";import{Path as f,cubicsToPath as s,formatPathCoordinate as x,morphToCssPath as u,morphToPath as y,roundedPolygonToPath as C,toCssPath as c,toSvgPath as l}from"./path";import{Point as T,directionVector as S,distanceBetween as M,isConvex as b}from"./point";import{PolygonFeature as N,RoundedPolygon as R,isRoundedPolygon as A}from"./rounded-polygon";import{Shapes as O}from"./shapes";export{p as CUBIC_CONTINUITY_EPSILON,t as CornerRounding,a as Cubic,i as MATERIAL_SHAPE_NAMES,m as MaterialShapes,h as Morph,f as Path,T as Point,N as PolygonFeature,R as RoundedPolygon,O as Shapes,s as cubicsToPath,S as directionVector,M as distanceBetween,x as formatPathCoordinate,b as isConvex,A as isRoundedPolygon,u as morphToCssPath,y as morphToPath,C as roundedPolygonToPath,c as toCssPath,l as toSvgPath};
@@ -0,0 +1 @@
1
+ import{checkArgument as k}from"../util";import{CornerRounding as n}from"./corner-rounding";import{Point as f,lengthOfVector as N}from"./point";import{RoundedPolygon as S}from"./rounded-polygon";import{Shapes as i}from"./shapes";const A=new f(.5,.5),T=[];function o(t,r,y){const s=[],p=[],M=t.map(([,,d,u])=>new n(d,u)),h=(d,u,l)=>{s.push(d,u),p.push(M[l])};if(y){const d=r*2,u=2*Math.PI/d,l=t.map(([a,g])=>Math.atan2(g-.5,a-.5)),w=t.map(([a,g])=>N(a-.5,g-.5));for(let a=0;a<d;a++){const g=a%2===0;for(let m=0;m<t.length-(g?0:1);m++){const P=g?m:t.length-1-m,C=g?u*a+l[P]:u*a+(u-l[P]+2*l[0]);h(.5+Math.cos(C)*w[P],.5+Math.sin(C)*w[P],P)}}}else for(let d=0;d<r;d++)for(let u=0;u<t.length;u++){const l=new f(t[u][0],t[u][1]).rotate(d*360/r,A);h(l.x,l.y,u)}return S.fromVertices(s,n.Unrounded,p,.5,.5)}function c(t,r){return t.transformed((y,s)=>new f(y,s).rotate(r))}function b(t,r){return t.transformed((y,s)=>new f(y,s*r))}function e(t,r){return T[t]??=r().normalized()}class R{static get Circle(){return e(0,()=>i.circle(10))}static get Square(){return e(1,()=>i.rectangle(1,1,new n(.3)))}static get Slanted(){return e(2,()=>o([[.926,.97,.189,.811],[-.021,.967,.187,.057]],2))}static get Arch(){return e(3,()=>c(S.fromNumVertices(4,1,0,0,n.Unrounded,[new n(1),new n(1),new n(.2),new n(.2)]),-135))}static get SemiCircle(){return e(4,()=>i.rectangle(1.6,1,n.Unrounded,[new n(.2),new n(.2),new n(1),new n(1)]))}static get Oval(){return e(5,()=>c(b(i.circle(),.64),-45))}static get Pill(){return e(6,()=>o([[.961,.039,.426],[1.001,.428],[1,.609,1]],2,!0))}static get Triangle(){return e(7,()=>c(S.fromNumVertices(3,1,0,0,new n(.2)),-90))}static get Arrow(){return e(8,()=>o([[.5,.892,.313],[-.216,1.05,.207],[.499,-.16,.215,1],[1.225,1.06,.211]],1))}static get Fan(){return e(9,()=>o([[1.004,1,.148,.417],[0,1,.151],[0,-.003,.148],[.978,.02,.803]],1))}static get Diamond(){return e(10,()=>o([[.5,1.096,.151,.524],[.04,.5,.159]],2))}static get ClamShell(){return e(11,()=>o([[.171,.841,.159],[-.02,.5,.14],[.17,.159,.159]],2))}static get Pentagon(){return e(12,()=>o([[.5,-.009,.172],[1.03,.365,.164],[.828,.97,.169]],1,!0))}static get Gem(){return e(13,()=>o([[.499,1.023,.241,.778],[-.005,.792,.208],[.073,.258,.228],[.433,0,.491]],1,!0))}static get VerySunny(){return e(14,()=>o([[.5,1.08,.085],[.358,.843,.085]],8))}static get Sunny(){return e(15,()=>i.star(8,1,.8,new n(.15)))}static get Cookie4Sided(){return e(16,()=>o([[1.237,1.236,.258],[.5,.918,.233]],4))}static get Cookie6Sided(){return e(17,()=>o([[.723,.884,.394],[.5,1.099,.398]],6))}static get Cookie7Sided(){return e(18,()=>c(i.star(7,1,.75,new n(.5)),-90))}static get Cookie9Sided(){return e(19,()=>c(i.star(9,1,.8,new n(.5)),-90))}static get Cookie12Sided(){return e(20,()=>c(i.star(12,1,.8,new n(.5)),-90))}static get Clover4Leaf(){return e(21,()=>o([[.5,.074],[.725,-.099,.476]],4,!0))}static get Clover8Leaf(){return e(22,()=>o([[.5,.036],[.758,-.101,.209]],8))}static get Burst(){return e(23,()=>o([[.5,-.006,.006],[.592,.158,.006]],12))}static get SoftBurst(){return e(24,()=>o([[.193,.277,.053],[.176,.055,.053]],10))}static get Boom(){return e(25,()=>o([[.457,.296,.007],[.5,-.051,.007]],15))}static get SoftBoom(){return e(26,()=>o([[.733,.454],[.839,.437,.532],[.949,.449,.439,1],[.998,.478,.174]],16,!0))}static get Flower(){return e(27,()=>o([[.37,.187],[.416,.049,.381],[.479,.001,.095]],8,!0))}static get Puffy(){return e(28,()=>b(o([[.5,.053],[.545,-.04,.405],[.67,-.035,.426],[.717,.066,.574],[.722,.128],[.777,.002,.36],[.914,.149,.66],[.926,.289,.66],[.881,.346],[.94,.344,.126],[1.003,.437,.255]],2,!0),.742))}static get PuffyDiamond(){return e(29,()=>o([[.87,.13,.146],[.818,.357],[1,.332,.853]],4,!0))}static get Ghostish(){return e(30,()=>o([[.5,0,1],[1,0,1],[1,1.14,.254,.106],[.575,.906,.253]],1,!0))}static get PixelCircle(){return e(31,()=>o([[.5,0],[.704,0],[.704,.065],[.843,.065],[.843,.148],[.926,.148],[.926,.296],[1,.296]],2,!0))}static get PixelTriangle(){return e(32,()=>o([[.11,.5],[.113,0],[.287,0],[.287,.087],[.421,.087],[.421,.17],[.56,.17],[.56,.265],[.674,.265],[.675,.344],[.789,.344],[.789,.439],[.888,.439]],1,!0))}static get Bun(){return e(33,()=>o([[.796,.5],[.853,.518,1],[.992,.631,1],[.968,1,1]],2,!0))}static get Heart(){return e(34,()=>o([[.5,.268,.016],[.792,-.066,.958],[1.064,.276,1],[.501,.946,.129]],1,!0))}static byName(r){return k(x.includes(r),`unknown Material shape: ${r}`),R[r]}static all(){return x.map(r=>({name:r,polygon:R[r]}))}}const x=Object.freeze(Object.getOwnPropertyNames(R).filter(t=>t<"a"));export{x as MATERIAL_SHAPE_NAMES,R as MaterialShapes};
@@ -0,0 +1 @@
1
+ import{checkArgument as I,checkState as R}from"../util";import{checkBounds as F,checkProgress as v,coordinateOf as x,newFrameCubic as j,splitCoordinates as z}from"./cubic";import{checkPoint as N,lengthOfVector as W}from"./point";const k=new WeakMap;class _{start;end;cubicCount;#e;#n;constructor(e,n){const o=[],r=[];U(O(e),O(n),o,r);for(const u of[o,r]){for(let s=8;s<u.length;s+=8)u[s]=u[s-2],u[s+1]=u[s-1];u[u.length-2]=u[0],u[u.length-1]=u[1]}for(let u=0;u<o.length;u++)r[u]=r[u]-o[u];this.start=e,this.end=n,this.cubicCount=o.length/8,this.#e=o,this.#n=r,Object.freeze(this)}asCubics(e){const n=[];v(e);for(let o=0;o<this.#e.length;o+=8)n.push(this.#t(o,e));return n}forEachCubic(e,n){v(e);for(let o=0;o<this.#e.length;o+=8)n(this.#t(o,e))}calculateBounds(e=[0,0,0,0],n=!0){return w(e,this.start.calculateBounds([0,0,0,0],n),this.end.calculateBounds([0,0,0,0],n))}calculateMaxBounds(e=[0,0,0,0]){return w(e,this.start.calculateMaxBounds(),this.end.calculateMaxBounds())}_frame(e,n){v(e);for(let o=0;o<this.#e.length;o++)n[o]=this.#e[o]+this.#n[o]*e;return n}#t(e,n){const o=this.#e,r=this.#n;return j([o[e]+r[e]*n,o[e+1]+r[e+1]*n,o[e+2]+r[e+2]*n,o[e+3]+r[e+3]*n,o[e+4]+r[e+4]*n,o[e+5]+r[e+5]*n,o[e+6]+r[e+6]*n,o[e+7]+r[e+7]*n])}}function w(t,e,n){return F(t),t[0]=Math.min(e[0],n[0]),t[1]=Math.min(e[1],n[1]),t[2]=Math.max(e[2],n[2]),t[3]=Math.max(e[3],n[3]),t}function f(t){const e=t-Math.floor(t);return e<1?e:0}function p(t,e){return Math.min(Math.abs(t-e),1-Math.abs(t-e))}function B(t,e,n){return n>=e?e<=t&&t<=n:t>=e||t<=n}function P(t){let e=t[0],n=t[1];for(let o=1;o<=3;o++){const r=x(t,0,o/3),u=x(t,1,o/3);N(r,u),t.push(W(r-e,u-n)),e=r,n=u}return t}function A(t){return t[8]+t[9]+t[10]}function E(t,e){const n=[];let o=0;for(let r=0;r<t.length;r++){const u=e[r+1];u-e[r]>1e-4&&(n.push({curve:t[r],start:o,end:u}),o=u)}return R(n.length>0,"a measured outline requires a curve of nonzero length"),n.push({...n.pop(),end:1}),n}function O(t){const{features:e}=t;let n=k.get(t);if(n===void 0){const o=[],r=[0],u=[];let s=0,c=0;for(let l=0;l<e.length;l++){const{cubics:a}=e[l];for(let i=0;i<a.length;i++)o.push(P([...a[i].points])),s+=A(o[o.length-1]),r.push(s)}I(s>0&&Number.isFinite(s),"a polygon outline must have length");for(let l=0;l<r.length;l++)r[l]=r[l]/s;for(let l=0;l<e.length;l++){const{cubics:a,kind:i,convex:h}=e[l],m=c+(a.length>>1),d=a[0].points,g=a[a.length-1].points;i==="corner"&&u.push({convex:h,progress:f((r[m]+r[m+1])/2),x:(d[0]+g[6])/2,y:(d[1]+g[7])/2}),c+=a.length}n={segments:E(o,r),corners:u},k.set(t,n)}return n}function S({curve:t,start:e,end:n},o){const r=Math.max(e,Math.min(o,n));let u=(n-e===0?0:(r-e)/(n-e))*A(t),s=1;for(let l=8;l<11;l++){if(t[l]>=u){s=(l-7)/3-(1-u/t[l])/3;break}u-=t[l]}const c=z(t,0,s);return[{curve:P(c[0]),start:e,end:r},{curve:P(c[1]),start:r,end:n}]}function q(t,e){const n=t.find(({end:o})=>Math.abs(o-e)<=1e-6);return e<1e-4?0:n===void 0?e:n.end<1?n.end:0}function D(t,e){const n=t.findIndex(({start:s,end:c})=>s<=e&&e<=c),o=S(t[n],e),r=[o[1].curve],u=[0,o[1].end-e];for(let s=n+1;s<n+t.length;s++){const{curve:c,end:l}=t[s%t.length];r.push(c),u.push(l-e+(s<t.length?0:1))}return r.push(o[0].curve),u.push(1),E(r,u)}function C(t,e,n){const o=t.length-1;let r=0;for(;r<o&&!B(n,t[r],t[r+1]);)r++;const u=r===o?0:r+1,s=t[r],c=e[r],l=f(t[u]-s);return f(c+f(e[u]-c)*(l<.001?.5:f(n-s)/l))}function T(t,e){const n=[],o=new Set,r=[],u=[];let s=0;for(let c=0;c<t.length;c++)for(let l=0;l<e.length;l++){const a=t[c],i=e[l],h=(a.x-i.x)*(a.x-i.x)+(a.y-i.y)*(a.y-i.y);a.convex===i.convex&&(n.push([a,i,h]),s=Math.max(s,h*1e-9))}for(let c=0;c<n.length;c++)n[c][2]=s>0?Math.round(n[c][2]/s):0;if(n.sort((c,l)=>c[2]-l[2]||c[0].progress-l[0].progress||c[1].progress-l[1].progress),n.length===1){const[{progress:c},{progress:l}]=n[0];return[[c,f(c+.5)],[l,f(l+.5)]]}for(let c=0;c<n.length;c++){const l=n[c][0],a=n[c][1],i=l.progress,h=a.progress;if(o.has(l)||o.has(a))continue;let m=r.findIndex(d=>d>i);if(m<0&&(m=r.length),r.length>0){const d=(m||r.length)-1,g=m%r.length;if(p(i,r[d])<=1e-4||p(i,r[g])<=1e-4||p(h,u[d])<=1e-4||p(h,u[g])<=1e-4||r.length>=2&&!B(h,u[d],u[g]))continue}if(r.splice(m,0,i),u.splice(m,0,h),o.add(l).add(a),r.length===Math.min(t.length,e.length))break}return r.length>=2?[r,u]:[[0,.5],[0,.5]]}function M(t,e){for(let n=0;n<8;n++)t.push(e[n])}function U(t,e,n,o){const[r,u]=T(t.corners,e.corners),s=q(e.segments,C(r,u,0)),c=t.segments,l=s===0?e.segments:D(e.segments,s);let a=0,i=0,h=c[0],m=l[0];for(;h!==void 0&&m!==void 0;){const d=a===c.length-1?1:h.end,g=i===l.length-1?1:C(u,r,f(m.end+s)),y=Math.min(d,g);if(d>y+1e-6){const b=S(h,y);M(n,b[0].curve),h=b[1]}else M(n,h.curve),h=c[++a];if(g>y+1e-6){const b=S(m,f(C(r,u,y)-s));M(o,b[0].curve),m=b[1]}else M(o,m.curve),m=l[++i]}R(h===void 0&&m===void 0,"polygon outlines could not be fully matched")}export{_ as Morph};
@@ -0,0 +1 @@
1
+ import{checkArgument as P}from"../util";import{extendBounds as S,resetBounds as _}from"./cubic";const c=1e5,h=[1,0,0,1,0,0];let a=new Uint8Array(0),o=0,C,f=new Float64Array(0);function x(t){return P(Number.isFinite(t),"path coordinates must be finite"),String(Math.round(t*c)/c)}class d{#t;constructor(){this.#t=""}moveTo(e,n){return this.#e("M",[e,n])}lineTo(e,n){return this.#e("L",[e,n])}cubicTo(e,n,r,u,s,i){return this.#e("C",[e,n,r,u,s,i])}close(){return this.#e("Z",[])}rewind(){return this._assign("")}toSvgPathData(){return this.#t}toString(){return this.#t}_assign(e){return this.#t=e,this}#e(e,n){return this._assign(this.#t+e+n.map(x).join(" "))}}function B(t,e=new d){return P(t.length>0,"a path requires at least one cubic"),m(e,p(t),t.length,h,!1)}function D(t,e,n=new d){const r=p(t.cubics);return m(n,r,t.cubics.length,T(r,t.centerX,t.centerY,e?.startAngle),e?.repeatPath===!0)}function E(t,e,n,r=new d){const u=t._frame(e,y(t.cubicCount)),{start:s,end:i}=t;return m(r,u,t.cubicCount,T(u,s.centerX+(i.centerX-s.centerX)*e,s.centerY+(i.centerY-s.centerY)*e,n?.startAngle),n?.repeatPath===!0)}function j(t){return D(t).toSvgPathData()}function z(t,e,n=e){return w(p(t.cubics),t.cubics.length,e,n)}function L(t,e,n,r=n){return w(t._frame(e,y(t.cubicCount)),t.cubicCount,n,r)}function y(t){return f.length<t*8&&(f=new Float64Array(t*16)),f}function p(t){const e=y(t.length);for(let n=0;n<t.length;n++){const r=t[n].points;for(let u=0;u<8;u++)e[n*8+u]=r[u]}return e}function T(t,e,n,r){if(r===void 0)return h;const u=r*Math.PI/180-Math.atan2(t[1]-n,t[0]-e),s=Math.cos(u),i=Math.sin(u);return[s,i,-i,s,e-s*e+i*n,n-i*e-s*n]}function w(t,e,n,r){P(Number.isFinite(n)&&n>0&&Number.isFinite(r)&&r>0,"a CSS path box must have a positive size");const u=[0,0,0,0];_(u);for(let l=0;l<e;l++)S(u,t,l*8,!0);const[s,i,F,O]=u,v=[n,0,0,r,(1-s-F)*n/2,(1-i-O)*r/2];return`path('${m(new d,t,e,v,!1)}')`}function g(t){if(o+t>a.length){const e=new Uint8Array(Math.max(a.length*2,o+t));e.set(a),a=e}}function A(t){let e=Math.round(t*c);if(e>-2147483648&&e<2147483648){e<0&&(a[o++]=45,e=-e);const n=e%c;if(M((e-n)/c),n>0){a[o]=46;for(let r=o+5,u=n;r>o;r--)a[r]=48+u%10,u=(u-u%10)/10;for(o+=6;a[o-1]===48;)o--}}else{const n=x(t);for(let r=0;r<n.length;r++)a[o++]=n.charCodeAt(r)}}function M(t){t>=10&&M((t-t%10)/10),a[o++]=48+t%10}function b(t,e,n){A(t===h?e:t[0]*e+t[2]*n+t[4]),a[o++]=32,A(t===h?n:t[1]*e+t[3]*n+t[5])}function m(t,e,n,r,u){let s=o=0;try{g(200),a[o++]=77,b(r,e[0],e[1]);for(let i=0;i<n*8;i+=8)s=o,g(200),a[o++]=67,b(r,e[i+2],e[i+3]),a[o++]=32,b(r,e[i+4],e[i+5]),a[o++]=32,b(r,e[i+6],e[i+7]);if(u){const i=o;g(i),a[o++]=76,a.copyWithin(o,1,i),o+=i-1}a[o++]=90,s=o}finally{o=s,t._assign(I())}return t}function I(){return C??=new TextDecoder,C.decode(a.subarray(0,o))}export{d as Path,B as cubicsToPath,x as formatPathCoordinate,L as morphToCssPath,E as morphToPath,D as roundedPolygonToPath,z as toCssPath,j as toSvgPath};
@@ -0,0 +1 @@
1
+ import{checkArgument as h,checkState as m}from"../util";function x(e,n){h(Number.isFinite(e)&&Number.isFinite(n),"point coordinates must be finite")}function b(e,n){return Math.sqrt(e*e+n*n)}class i{static Zero=new i(0,0);x;y;constructor(n,t){x(n,t),this.x=n,this.y=t,Object.freeze(this)}static interpolate(n,t,r){return new i(n.x+(t.x-n.x)*r,n.y+(t.y-n.y)*r)}minus(n){return new i(this.x-n.x,this.y-n.y)}plus(n){return new i(this.x+n.x,this.y+n.y)}times(n){return new i(this.x*n,this.y*n)}div(n){return new i(this.x/n,this.y/n)}distanceSquared(){return this.x*this.x+this.y*this.y}distance(){return Math.sqrt(this.distanceSquared())}dot(n){return this.x*n.x+this.y*n.y}direction(){const n=this.distance();return m(n>0,"a zero-length vector has no direction"),this.div(n)}rotate90(){return new i(-this.y,this.x)}cross(n){return this.x*n.y-this.y*n.x}rotate(n,t=i.Zero){const r=n*Math.PI/180,o=Math.cos(r),s=Math.sin(r),u=this.x-t.x,c=this.y-t.y;return new i(u*o-c*s+t.x,u*s+c*o+t.y)}}function y(e,n){if(n===void 0)return new i(Math.cos(e),Math.sin(e));const t=b(e,n);return h(t>0,"a zero-length vector has no direction"),new i(e/t,n/t)}function d(e,n){return e.minus(n).distance()}function P(e,n,t){return(n.x-e.x)*(t.y-n.y)-(n.y-e.y)*(t.x-n.x)>0}export{i as Point,x as checkPoint,y as directionVector,d as distanceBetween,P as isConvex,b as lengthOfVector};
@@ -0,0 +1 @@
1
+ import{checkArgument as m}from"../util";import{CornerRounding as L}from"./corner-rounding";import{Cubic as A,checkBounds as ln,extendBounds as mn,isContiguous as gn,newFrozenCubic as Q,resetBounds as fn,reverseCoordinates as bn}from"./cubic";import{Point as J,checkPoint as pn,directionVector as yn,lengthOfVector as C}from"./point";class X{cubics;kind;convex;constructor(n,t,o=!0){m(n.length>0,"a polygon feature requires at least one cubic");for(let r=1;r<n.length;r++)m(gn(n[r-1],n[r]),"polygon feature cubics must be contiguous");this.cubics=Object.freeze([...n]),this.kind=t,this.convex=t==="corner"?o:!0,Object.freeze(this)}get isEdge(){return this.kind==="edge"}get isCorner(){return this.kind==="corner"}get isIgnorableFeature(){return this.kind==="edge"}get isConvexCorner(){return this.kind==="corner"&&this.convex}get isConcaveCorner(){return this.kind==="corner"&&!this.convex}transformed(n){return new X(this.cubics.map(t=>t.transformed(n)),this.kind,this.convex)}reversed(){return new X(this.cubics.map(n=>n.reverse()).reverse(),this.kind,this.kind==="corner"?!this.convex:!0)}equals(n){return n instanceof X&&this.kind===n.kind&&this.convex===n.convex&&this.cubics.length===n.cubics.length&&this.cubics.every((t,o)=>t.equals(n.cubics[o]))}}class x{center;features;cubics;constructor(n,t){const o=[];for(let r=0;r<n.length;r++){const{cubics:i}=n[r];for(let c=0;c<i.length;c++)o.push(i[c])}m(n.length>=2,"a polygon requires at least two features");for(let r=0;r<o.length;r++)m(gn(o[(r||o.length)-1],o[r]),"polygon features must form a contiguous closed outline");this.center=t,this.features=Object.freeze([...n]),this.cubics=Object.freeze(Pn(n,o,t)),Object.freeze(this)}get centerX(){return this.center.x}get centerY(){return this.center.y}static fromVertices(n,t=L.Unrounded,o,r,i){m(n.length>=6&&n.length%2===0,"a polygon requires at least three x/y vertex pairs");const c=n.length/2,e=[],s=t instanceof L?{rounding:t,perVertexRounding:o,centerX:r,centerY:i}:t,a=s.perVertexRounding;let d=0,g=0;m(a===void 0||a.length*2===n.length,"per-vertex rounding must have one entry per vertex");for(let l=0;l<c;l++)pn(n[l*2],n[l*2+1]),d+=n[l*2],g+=n[l*2+1],e.push(a?.[l]??s.rounding??L.Unrounded);const f=xn(n,e);return new x(f,new J(s.centerX??d/c,s.centerY??g/c))}static fromFeatures(n,t,o){let r=0,i=0,c=0;for(let e=0;e<n.length;e++){const{cubics:s}=n[e];for(let a=0;a<s.length;a++)r+=s[a].points[0],i+=s[a].points[1],c++}return new x(n,new J(t??(c===0?0:r/c),o??(c===0?0:i/c)))}static fromNumVertices(n,t=1,o=0,r=0,i=L.Unrounded,c){return m(Number.isInteger(n)&&n>=3,"a polygon requires at least three vertices"),m(Number.isFinite(t)&&t>0,"polygon radius must be positive"),x.fromVertices(Cn(n,o,r,t),i,c,o,r)}transformed(n){const t=this.features.map(o=>o.transformed(n));return new x(t,n(this.centerX,this.centerY))}normalized(){const n=this.calculateBounds(),t=n[0],o=n[1],r=n[2]-t,i=n[3]-o,c=Math.max(r,i),e=(c-r)/2-t,s=(c-i)/2-o;return m(c>0,"cannot normalize a zero-area polygon"),this.transformed((a,d)=>new J(dn((a+e)/c),dn((d+s)/c)))}calculateBounds(n=[0,0,0,0],t=!0){ln(n),fn(n);for(let o=0;o<this.cubics.length;o++)mn(n,this.cubics[o].points,0,t);return n}calculateMaxBounds(n=[0,0,0,0]){const{x:t,y:o}=this.center;let r=0;ln(n);for(let i=0;i<this.cubics.length;i++){const c=this.cubics[i],e=c.pointAt(.5);r=Math.max(r,C(c.points[0]-t,c.points[1]-o),C(e.x-t,e.y-o))}return n[0]=t-r,n[1]=o-r,n[2]=t+r,n[3]=o+r,n}equals(n){return n instanceof x&&this.features.length===n.features.length&&this.features.every((t,o)=>t.equals(n.features[o]))}}function wn(u){return u instanceof x}function Cn(u,n,t,...o){const r=[];for(let i=0;i<u;i++){const c=2*Math.PI*i/u,e=o[i%o.length];r.push(n+Math.cos(c)*e,t+Math.sin(c)*e)}return r}function dn(u){return u<0&&u>-1e-12?0:u>1&&u<1.000000000001?1:u}function xn(u,n){const t=n.length,o=[],r=[],i=[],c=[];for(let e=0;e<t;e++){const s=u[e*2],a=u[e*2+1],d=((e||t)-1)*2,g=(e+1)%t*2,f=u[d]-s,l=u[d+1]-a,b=u[g]-s,P=u[g+1]-a,R=C(f,l),p=C(b,P),Y=R===0||p===0,h=Y?[0,0,0,0]:[f/R,l/R,b/p,P/p],y=Math.max(-1,Math.min(1,h[0]*h[2]+h[1]*h[3])),w=Math.sqrt(1-y*y),{radius:F,smoothing:O}=n[e],M=!Y&&w>.001?F*(y+1)/w:0;h.push(M,(1+O)*M,l*b-f*P),o.push(h)}for(let e=0;e<t;e++){const s=(e+1)%t,a=C(u[e*2]-u[s*2],u[e*2+1]-u[s*2+1]),d=o[e][4]+o[s][4],g=o[e][5]+o[s][5];r.push(d>a?[a/d,0]:g>a?[1,(a-d)/(g-d)]:[1,1])}for(let e=0;e<t;e++){const s=o[e],a=u[e*2],d=u[e*2+1],{radius:g,smoothing:f}=n[e],l=s[4],b=s[5],P=r[(e||t)-1],R=r[e],p=[l*P[0]+(b-l)*P[1],l*R[0]+(b-l)*R[1]],Y=Math.min(p[0],p[1]),h=Math.min(Y,l);if(!(l>=1e-4&&Y>=1e-4&&g>=1e-4)){i.push([A.empty(a,d)]);continue}const y=g*h/l,w=(s[0]+s[2])/2,F=(s[1]+s[3])/2,O=C(w,F),M=C(y,h),q=a+w/O*M,z=d+F/O*M,V=[a+s[0]*h,d+s[1]*h,a+s[2]*h,d+s[3]*h],W=N=>{const k=N*2,T=s[k],U=s[k+1],v=V[k],j=V[k+1],Z=N===0?((e||t)-1)*2:(e+1)%t*2,$=u[Z],_=u[Z+1],E=p[N],D=E>b?f:E>l?f*(E-l)/(b-l):0,nn=h*(1+D),en=a+T*nn,tn=d+U*nn,on=yn(v+((v+V[2-k])/2-v)*D-q,j+((j+V[3-k])/2-j)*D-z),S=q+on.x*y,G=z+on.y*y,rn=-(S-q),sn=-(G-z),B=T*rn+U*sn,H=(S-$)*rn+(G-_)*sn,cn=Math.abs(B)<1e-4||Math.abs(B)<1e-4*Math.abs(H),un=cn?v:$+T*(H/B),an=cn?j:_+U*(H/B);return[en,tn,(en+un*2)/3,(tn+an*2)/3,un,an,S,G]},I=W(0),K=W(1);i.push([Q(I),A.circularArc(q,z,I[6],I[7],K[6],K[7]),Q(bn(K))])}for(let e=0;e<t;e++){const s=i[e][i[e].length-1].points,a=i[(e+1)%t][0].points;c.push(new X(i[e],"corner",o[e][6]>0),new X([A.straightLine(s[6],s[7],a[0],a[1])],"edge"))}return c}function Pn(u,n,t){const o=u[0].cubics,r=[];let i=n;if(o.length===3){const e=o[1].split(.5);i=[e[1],o[2]].concat(n.slice(3),o[0],e[0])}for(let e=0;e<i.length;e++){const s=i[e];s.zeroLength()?r.length>0&&r.push(hn(r.pop(),s.points,6)):r.push(s)}if(r.length===0)return[A.empty(t.x,t.y)];const c=r[0].points;return r.push(hn(r.pop(),c,0)),r}function hn(u,n,t){const o=[...u.points];return o[6]=n[t],o[7]=n[t+1],Q(o)}export{X as PolygonFeature,x as RoundedPolygon,Cn as calculateVertices,wn as isRoundedPolygon};
@@ -0,0 +1 @@
1
+ import{checkArgument as i}from"../util";import{CornerRounding as a}from"./corner-rounding";import{RoundedPolygon as b,calculateVertices as p}from"./rounded-polygon";class g{static circle(e=8,o=1,r=0,n=0){return i(Number.isInteger(e)&&e>=3,"a circle requires at least three vertices"),i(Number.isFinite(o)&&o>0,"circle radius must be positive"),b.fromNumVertices(e,o/Math.cos(Math.PI/e),r,n,new a(o))}static rectangle(e=2,o=2,r=a.Unrounded,n,t=0,s=0){const l=t+e/2,m=s+o/2,c=t-e/2,u=s-o/2;return i(Number.isFinite(e)&&e>0&&Number.isFinite(o)&&o>0,"rectangle dimensions must be positive"),b.fromVertices([l,m,c,m,c,u,l,u],r,n,t,s)}static star(e,o=1,r=.5,n=a.Unrounded,t,s,l=0,m=0){return i(Number.isInteger(e)&&e>=2,"a star requires at least two outer vertices"),i(Number.isFinite(o)&&o>0&&Number.isFinite(r)&&r>0,"star radii must be positive"),i(r<o,"star inner radius must be less than its radius"),b.fromVertices(p(e*2,l,m,o,r),n,s??Array.from({length:e*2},(c,u)=>u%2===0?n:t??n),l,m)}static pill(e=2,o=1,r=0,n=0,t=0){return i(Number.isFinite(e)&&e>0&&Number.isFinite(o)&&o>0,"pill dimensions must be positive"),g.rectangle(e,o,new a(Math.min(e,o)/2,r),void 0,n,t)}}export{g as Shapes};
@@ -0,0 +1 @@
1
+ const e=Object.freeze({0:0,25:2,50:4,75:6,100:8,125:10,150:12,175:14,200:16,250:20,300:24,400:32,450:36,500:40,600:48,700:56,800:64,900:72});export{e as spacing};
@@ -0,0 +1 @@
1
+ @property --cw-interactable-focusIndicator-color{syntax: "<color>"; inherits: false; initial-value: transparent;}@property --cw-interactable-focusIndicator-offset{syntax: "<length>"; inherits: false; initial-value: 0px;}@property --cw-interactable-focusIndicator-thickness{syntax: "<length>"; inherits: false; initial-value: 0px;}@property --cw-interactable-stateLayer-color{syntax: "<color>"; inherits: false; initial-value: transparent;}@property --cw-interactable-stateLayer-opacity{syntax: "<number>"; inherits: false; initial-value: 0;}@property --cw-interactable-ripple-color{syntax: "<color>"; inherits: false; initial-value: transparent;}@property --cw-interactable-ripple-opacity{syntax: "<number>"; inherits: false; initial-value: 0;}@property --cw-interactable-ripple-radius{syntax: "auto | <length>"; inherits: false; initial-value: auto;}@property --_CW-INTERACTABLE-RIPPLE1_COLOR{syntax: "<color>"; inherits: false; initial-value: transparent;}@property --_CW-INTERACTABLE-RIPPLE1_RADIUS{syntax: "<length-percentage>"; inherits: false; initial-value: 0px;}@property --_CW-INTERACTABLE-RIPPLE1_X{syntax: "<percentage>"; inherits: false; initial-value: 50%;}@property --_CW-INTERACTABLE-RIPPLE1_Y{syntax: "<percentage>"; inherits: false; initial-value: 50%;}@property --_CW-INTERACTABLE-RIPPLE2_COLOR{syntax: "<color>"; inherits: false; initial-value: transparent;}@property --_CW-INTERACTABLE-RIPPLE2_RADIUS{syntax: "<length-percentage>"; inherits: false; initial-value: 0px;}@property --_CW-INTERACTABLE-RIPPLE2_X{syntax: "<percentage>"; inherits: false; initial-value: 50%;}@property --_CW-INTERACTABLE-RIPPLE2_Y{syntax: "<percentage>"; inherits: false; initial-value: 50%;}@layer cw-style{.cw-interactable{position:relative;z-index:0}.cw-interactable:before{--cw-interactable-stateLayer-color: inherit;--cw-interactable-stateLayer-opacity: inherit;color:cw-scale-opacity(var(--cw-interactable-stateLayer-color),var(--cw-interactable-stateLayer-opacity));outline-width:0}._cw-interactable-stateLayer:before{--cw-interactable-focusIndicator-color: inherit;background-color:currentcolor;border-color:transparent;border-radius:inherit;border-style:inherit;border-width:inherit;content:"";inset:0;outline-color:var(--cw-interactable-focusIndicator-color);outline-offset:0;outline-style:solid;outline-width:0;position:absolute;transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration),cw-var(--cw-Motion-spring-spatial-fast-duration),cw-var(--cw-Motion-spring-spatial-fast-duration);transition-property:color,outline-offset,outline-width;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing),cw-var(--cw-Motion-spring-spatial-fast-easing),cw-var(--cw-Motion-spring-spatial-fast-easing);z-index:-1}._cw-interactable-ripple:before{background-image:radial-gradient(circle farthest-corner,var(--_CW-INTERACTABLE-RIPPLE1_COLOR) max(0px,calc(var(--_CW-INTERACTABLE-RIPPLE1_RADIUS) - 2px)),transparent var(--_CW-INTERACTABLE-RIPPLE1_RADIUS)),radial-gradient(circle farthest-corner,var(--_CW-INTERACTABLE-RIPPLE2_COLOR) max(0px,calc(var(--_CW-INTERACTABLE-RIPPLE2_RADIUS) - 2px)),transparent var(--_CW-INTERACTABLE-RIPPLE2_RADIUS));background-origin:border-box;background-position:calc(100% - var(--_CW-INTERACTABLE-RIPPLE1_X)) calc(100% - var(--_CW-INTERACTABLE-RIPPLE1_Y)),calc(100% - var(--_CW-INTERACTABLE-RIPPLE2_X)) calc(100% - var(--_CW-INTERACTABLE-RIPPLE2_Y));background-repeat:no-repeat;background-size:200% 200%}._cw-interactable-focusIndicator{outline:none;&:before{--cw-interactable-focusIndicator-offset: inherit;--cw-interactable-focusIndicator-thickness: inherit;outline-offset:var(--cw-interactable-focusIndicator-offset);outline-width:var(--cw-interactable-focusIndicator-thickness)}}@starting-style{._cw-interactable-stateLayer:before{color:transparent}._cw-interactable-focusIndicator:before{outline-offset:0;outline-width:0}}@media (forced-colors: active){._cw-interactable-stateLayer:before{background:none}}}
@@ -0,0 +1 @@
1
+ import{splitProps as i}from"solid-js";import{isServer as e}from"solid-js/web";import{defineDomComponent as d}from"..";import{InteractableController as P}from"./controller";import"./component.css";function I(n,t){return d(()=>{if(!e)throw new Error;const o=n();return(r,a)=>o(r,i(a,["onClick","onFocusIn","onFocusOut","onPointerEnter","onPointerLeave","onInteractionStateEntered","onInteractionStateExited"])[1])},()=>{if(e)throw new Error;return t(P)})}export{I as defineInteractableComponent};
@@ -0,0 +1 @@
1
+ import{DomController as K}from"../dom/client";import{assertDebug as O,checkArgument as F,checkState as g,consumeProps as U,deferAfterDelegatedCancellation as q,eventListenerOptionsOf as C}from"../util";import{isLeaveWithin as B}from"../util/event";import{DragState as l,FocusState as u,HoverState as f,PressState as s,highestInteractionStateOf as v,isInteractionState as H,isInteractionStateMask as A,nameOfInteractionState as X,streamInteractionStates as E}from"./state";import{applyRipple as j}from"./ripple";import{CSS_CLASS_FOCUS_INDICATOR as M,CSS_CLASS_INTERACTABLE as P,CSS_CLASS_STATE_LAYER as x,STATE_LAYER_PSEUDO_ELEMENT as $}from"./style";const z=150,J=350,Q=8,Z="button, input, select, textarea, a[href], [contenteditable]:not([contenteditable=false])",ee={click:s,contextmenu:l|s,focusin:u,focusout:u,keydown:s,keyup:s,lostpointercapture:l|s,pointercancel:l|s,pointerdown:l|s,pointerenter:f,pointerleave:l|f|s,pointermove:l|s,pointerup:l|s},V=Object.keys(ee),W=["click","focusin","keydown","pointerdown","pointerenter"],h=new WeakMap,R=new WeakMap,L=new WeakMap,D=new WeakMap,m=new WeakSet,p=new Set;function I(o){return typeof o=="object"&&o!==null&&o.nodeType===1}function N(o){return o.nodeType===11&&"host"in o}function y(o,e){const t=e?.defaultView?.PointerEvent;return typeof t=="function"&&o instanceof t||o.type.startsWith("pointer")&&"pointerId"in o&&"pointerType"in o}function te(o,e){const t=e?.defaultView?.MouseEvent;return typeof t=="function"&&o instanceof t||"clientX"in o}function ne(o){const e=o.target,t=o.currentTarget;return I(e)?e.ownerDocument:typeof t=="object"&&t!==null&&t.nodeType===9?t:o.composedPath().find(I)?.ownerDocument}function oe(o){const e=o.ownerDocument;return e.defaultView!==null?e:document}function ie(o){const e=[];for(let t=o.getRootNode();N(t);t=t.host.getRootNode())t.mode==="closed"&&e.push(t);return e}function c(o){return D.get(o)??null}function w(o){let e=R.get(o);if(e===void 0){const t=r=>b._maybeHandleTriggerEvent(r),n=C({capture:!0,passive:!1}),i=C({capture:!0,passive:!0});e={handler:t,root:o,subscribers:0},R.set(o,e);for(const r of V)o.addEventListener(r,t,r==="click"?n:i);N(o)&&L.set(o.host,o)}return e.subscribers++,e}function k(o){const e=o.root;if(o.subscribers--,o.subscribers===0){for(const t of V)e.removeEventListener(t,o.handler,!0);R.delete(e),N(e)&&L.delete(e.host)}}function _(o,e){const t=o.ownerDocument,n=e.document;n.root!==t&&(e.document=w(t),k(n)),e.closedRoots.length===0&&o.getRootNode()!==t&&(e.closedRoots=ie(o).map(w))}function re(o,e){const t=C({capture:!0,passive:!1}),n=i=>{o.isConnected&&(G(o,e),_(o,e)),b._maybeHandleTriggerEvent(i)};e.sentinel=n;for(const i of W)o.addEventListener(i,n,t)}function G(o,e){const t=e.sentinel;if(t!==void 0){e.sentinel=void 0;for(const n of W)o.removeEventListener(n,t,!0)}}function se(){for(const o of p){const e=h.get(o);e!==void 0&&(o.isConnected?_(o,e):re(o,e))}p.clear()}function le(o,e){const t=h.get(o);if(t?.controller===e)return;t!==void 0&&Y(o,t.controller);const n={closedRoots:[],controller:e,document:w(oe(o))};if(h.set(o,n),o.isConnected){_(o,n);return}p.size===0&&queueMicrotask(se),p.add(o)}function Y(o,e){const t=h.get(o);if(t?.controller===e){h.delete(o),p.delete(o),G(o,t),k(t.document);for(const n of t.closedRoots)k(n)}}function ae(o,e){for(let t=0;t<o.length;t++){const n=o[t];if(!I(n))continue;const i=h.get(n),r=L.get(n);if(i!==void 0)return{controller:i.controller,element:n};if(!e)return;if(r!==void 0&&o[t-1]!==r)return null;if(n.matches(Z))return}}function ue(o){return o.ownerDocument.defaultView?.matchMedia("(any-hover: hover)").matches===!0}function S(o){const e=v(o)??0;return e===s?e|(v(o&~s)??0):e}function ce(o){return"transitionProperty"in o&&o.transitionProperty==="color"&&o.effect?.pseudoElement===$}class b extends K{#p;#E;#m;#y;#S;#I;#g;#P;#a;#o;#n;#s;#d;#u;#e;#l;constructor(e,t){super(e,t),{onClick:this.#p,onFocusIn:this.#E,onFocusOut:this.#m,onInteractionStateEntered:this.#I,onInteractionStateExited:this.#g,onPointerEnter:this.#y,onPointerLeave:this.#S}=U(e,[],["onClick","onFocusIn","onFocusOut","onInteractionStateEntered","onInteractionStateExited","onPointerEnter","onPointerLeave"]),this.#P=t?.baseInteractionCssClassName??"cw-interactable",this.#a=(t?.noPressRipple?1:0)|(t?.noFocusIndicator?2:0)|([this.#p,this.#E,this.#m,this.#y,this.#S].some(n=>n!==void 0)?8:0),this.#o=t?.enabledInteractionStates??0,this.#n=0,F(A(this.#o))}#c(e){return(this.#a&e)===e}get isControllerDisposed(){return this.#c(16)}#w(e){const t=this.#c(e);return this.#a|=e,t}isPressRippleDisabled(){return this.#c(1)}isFocusIndicatorDisabled(){return this.#c(2)}#C(e){return`${this.#P}-${X(e)}`}get enabledInteractionStates(){return this.#o}get enteredInteractionStates(){return this.#n}isInteractionStateEnabled(e){return O(H(e)),(this.#o&e)===e}isInteractionStateEntered(e){return O(H(e)),(this.#n&e)===e}#f(e,t){const n=this;t!==null&&Y(t,n),!(e===null||this.isControllerDisposed||this.#o===0&&!this.#c(8))&&(le(e,n),e.isConnected&&queueMicrotask(()=>this.#v(this.#o)))}#k(e){const t=this.#c(8),n=super.styleElement?.classList;e?(n?.add(P),t||(this.#f(super.styleElement,null),this.#f(super.functionElement,null))):(n?.remove(P,x),this.#a&=-5,t||(this.#f(null,super.styleElement),this.#f(null,super.functionElement)))}setEnabledInteractionStates(e){const t=this.#o,n=this.#e;if(!(this.isControllerDisposed||t===e)){F(A(e)),this.#o=e,(e&s)===0&&(this.#l=void 0),n!==void 0&&(e&(n.dragStarted===!0?l:s))===0&&this.#t(!0);for(const i of E(this.#n&~e))this.#r(i,!0);t!==0!=(e!==0)&&this.#k(e!==0),this.#v(e&~t)}}#v(e){const t=super.styleElement,n=super.functionElement,i=(e&f)!==0&&t!==null&&t.matches(":hover")&&ue(t),r=(e&u)!==0&&I(n)&&n.matches(":focus-visible");if(!(this.isControllerDisposed||!i&&!r)){for(const a of this.#b())ce(a)&&a.finish();i&&this.#i(f),r&&this.#i(u)}}#b(){const e=super.styleElement;return e===null||typeof e.getAnimations!="function"?[]:e.getAnimations({subtree:!0}).filter(t=>{const n=t.effect;return n!==null&&n.target===e&&Number.isFinite(Number(n.getComputedTiming().endTime))&&t.playbackRate!==0&&t.playState!=="paused"})}#L(){this.#u?.cancel(),this.#u=void 0}#R(e,t,n){for(const i of E(t&~n))e.classList.remove(this.#C(i));for(const i of E(n&~t))e.classList.add(this.#C(i))}#i(e,t){if(this.#s?.(),this.isControllerDisposed||(e&this.#o&~this.#n)!==e)return;const n=super.styleElement,i=S(this.#n),r=S(this.#n|e);let a;if(g(n!==null,"interaction state requires a style element"),this.#n|=e,e===u&&!this.isFocusIndicatorDisabled()&&n.classList.add(M),(r&e)===0){this.#I?.(e,this,t);return}e===s&&(a=this.#b()),this.#w(4)||n.classList.add(x),this.#R(n,i,r),a!==void 0?(this.#d=Promise.allSettled(this.#b().filter(d=>!a.includes(d)).map(d=>d.finished)),this.isPressRippleDisabled()||(this.#u=j(n,this.#e?.position))):(i&~r&s)!==0&&(this.#d=void 0,this.#u?.finish()),this.#I?.(e,this,t)}#N(e,t,n){const i=()=>{this.#s===i&&(this.#s=void 0,this.#r(e,!0,n))};this.#d=void 0,this.#s?.(),this.#s=i,t.then(i)}#r(e,t,n){const i=this.#n,r=i&~e,a=(v(r)??0)<e,d=this.#d,T=super.styleElement;if(this.isInteractionStateEntered(e)){if(e===s&&this.#u?.finish(),a&&e===s&&d!==void 0){if(t!==!0){this.#N(e,d,n);return}this.#d=void 0}a&&this.#s!==void 0&&(this.#s(),!this.isInteractionStateEntered(e))||(g(T!==null,"interaction state requires a style element"),this.#n=r,e===u&&T.classList.remove(M),this.#R(T,S(i),S(r)),this.#g?.(e,this,n))}}#T(e,t){const n=y(e,t),i=c(t);let r=i;if(!this.isControllerDisposed){if(i!==null){if(n&&e.type==="pointerdown"&&i===this.#e&&i.pointerId===e.pointerId)return;i!==this.#e||i.touchTimeoutId===void 0?(i.controller.#t(!0,e),r=null):(t.defaultView?.clearTimeout(i.touchTimeoutId),i.touchTimeoutId=void 0)}if(!this.isControllerDisposed){if(r??=this.#_(e,t),r.position===void 0&&te(e,t)&&(e.type!=="click"||n&&e.pointerType!=="")&&(r.position=[e.clientX,e.clientY]),!n){this.#i(s,e);return}if(r.pointerId=e.pointerId,r.pointerType=e.pointerType,e.type==="pointerdown"&&!this.isInteractionStateEnabled(s)){this.isInteractionStateEnabled(l)||this.#t(!0,e);return}if(e.type==="click"||e.pointerType!=="touch"||t.defaultView===null){this.#i(s,e);return}this.#O(r,e)}}}#_(e,t){const n=t.defaultView,i={controller:this,document:t,keyboard:e.type==="keydown"};if(D.set(t,i),this.#e=i,i.keyboard&&n!==null){const r=()=>{this.#e===i&&this.#t(!0)};n.addEventListener("blur",r),i.removeBlurListener=()=>n.removeEventListener("blur",r)}return i}#O(e,t){const n=e.document.defaultView?.setTimeout(()=>{c(e.document)!==e||e.touchTimeoutId!==n||e.dragStarted===!0||(e.touchTimeoutId=void 0,this.#i(s,t))},z);e.touchTimeoutId=n}#F(e,t){const n=super.styleElement,i=e.position;if(!(e.dragStarted===!0||i===void 0||!this.isInteractionStateEnabled(l)||(t.clientX-i[0])**2+(t.clientY-i[1])**2<Q**2)&&(e.touchTimeoutId!==void 0&&(e.document.defaultView?.clearTimeout(e.touchTimeoutId),e.touchTimeoutId=void 0),e.dragStarted=!0,this.#i(l,t),!(this.#e!==e||n===null||!n.isConnected)))try{n.setPointerCapture(t.pointerId),e.pointerCaptureElement=n}catch{}}#H(e,t){if(this.#r(l,!1,t),!(this.isControllerDisposed||this.#e!==e)){if(!this.isInteractionStateEntered(s)){this.#t(!0,t);return}this.#D(e,t)}}#A(e,t){(t.type!=="lostpointercapture"||e.releaseTimeoutId===void 0)&&this.#t(!0,t)}#D(e,t){const n=e.document.defaultView?.setTimeout(()=>{c(e.document)===e&&e.releaseTimeoutId===n&&(e.releaseTimeoutId=void 0,this.#t(!0,t))},e.pointerType==="touch"?J:0);this.#u?.finish(),n===void 0?this.#t(!0,t):e.releaseTimeoutId=n}#t(e,t){const n=this.#e,i=n?.document.defaultView,r=n?.pointerCaptureElement;if(g(n!==void 0,"controller owns no press"),D.delete(n.document),this.#e=void 0,this.#l=void 0,n.removeBlurListener?.(),r!==void 0&&n.pointerId!==void 0)try{r.hasPointerCapture(n.pointerId)&&r.releasePointerCapture(n.pointerId)}catch{}n.releaseTimeoutId!==void 0&&i?.clearTimeout(n.releaseTimeoutId),this.#r(l,e??!0,t),n.touchTimeoutId!==void 0?i?.clearTimeout(n.touchTimeoutId):this.#r(s,e??!0,t)}onEvent(e){e.type==="click"?this.#p?.(e,this):e.type==="focusin"?this.#E?.(e,this):e.type==="focusout"?this.#m?.(e,this):e.type==="pointerenter"?this.#y?.(e,this):e.type==="pointerleave"&&this.#S?.(e,this)}#M(e,t,n){if(!this.isControllerDisposed){switch(e.type){case"click":this.#x(e,n);return;case"focusin":case"focusout":this.#V(e,t);return;case"keydown":case"keyup":this.#W(e,t);return}y(e,n)&&e.isPrimary&&this.#G(e,t,n)}}#x(e,t){let n;this.onEvent(e),this.isInteractionStateEnabled(s)&&(n=c(t),(n===null||n===this.#e&&n.touchTimeoutId!==void 0)&&(this.#T(e,t),n=c(t)),n!==null&&n.controller.#t(!1,e))}#V(e,t){if(t===super.functionElement){if(e.type==="focusin"){this.onEvent(e),t.matches(":focus-visible")&&this.#i(u,e);return}this.#l=void 0,this.#e?.keyboard===!0&&this.#t(!0,e),this.onEvent(e),this.#r(u,!1,e)}}#W(e,t){const n=this.#e;if(!(t!==super.functionElement||t.localName!=="button")){if(e.type==="keyup"){this.#l=void 0,n?.keyboard===!0&&this.#D(n,e);return}e.repeat||e.isComposing||!this.isInteractionStateEnabled(s)||(this.#l=e,q(e,t,()=>{this.#l===e&&!this.isControllerDisposed&&!e.defaultPrevented&&t===super.functionElement&&t.matches(":focus:enabled")&&this.isInteractionStateEnabled(s)&&this.#T(e,t.ownerDocument)},!1))}}#G(e,t,n){const i=e.pointerType==="touch",r=this.#e;if(e.type==="pointerdown"){(this.isInteractionStateEnabled(s)||this.isInteractionStateEnabled(l))&&(i||e.buttons===1)&&this.#T(e,n);return}if(!(i||t!==super.styleElement)&&!(e.type==="pointerleave"&&B(e,t))){if(this.onEvent(e),e.type==="pointerenter"){this.#i(f,e);return}this.#r(f,!1,e),r!==void 0&&r.pointerId===e.pointerId&&r.dragStarted!==!0&&r.releaseTimeoutId===void 0&&this.#t(!0,e)}}static#Y(e,t){const n=c(t);if(n!==null){if(e.type==="contextmenu"){m.add(e),n.controller.#t(!0,e);return}!y(e,t)||!e.isPrimary||e.pointerId!==n.pointerId||(m.add(e),e.type==="pointermove"?n.controller.#F(n,e):e.type==="pointerup"?n.controller.#H(n,e):n.controller.#A(n,e))}}static _maybeHandleTriggerEvent(e){const t=ne(e);if(t===void 0||m.has(e))return;switch(e.type){case"contextmenu":case"lostpointercapture":case"pointercancel":case"pointermove":case"pointerup":b.#Y(e,t);return;case"keydown":case"keyup":if(e.key!==" ")return;break}const n=ae(e.composedPath(),e.type==="click"||e.type==="pointerdown"),i=c(t);if(n!=null){m.add(e),n.controller.#M(e,n.element,t);return}n===void 0&&i!==null&&(e.type==="click"||e.type==="pointerdown")&&(!y(e,t)||i.pointerId===e.pointerId)&&i.controller.#t(!0,e)}#h(e,t){this.#l=void 0,this.#e!==void 0&&this.#t(!0),this.#L();for(const n of E(this.#n))this.#r(n,!0);this.#f(e,t)}onStyleElementChanged(e){this.#a&=-5,e!==null&&this.#o!==0&&e.classList.add(P),this.#h(e,super.styleElement)}onFunctionElementChanged(e){super.isFunctionElementStyle()||this.#h(e,super.functionElement)}onControllerCleanup(){this.isControllerDisposed||(this.#a|=16,this.#h(null,super.styleElement),super.isFunctionElementStyle()||this.#h(null,super.functionElement),super.onControllerCleanup())}}export{b as InteractableController};
@@ -0,0 +1 @@
1
+ import{defineInteractableComponent as a}from"./component";import{DragState as r,FocusState as o,HoverState as c,PressState as l,isInteractionState as p,isInteractionStateMask as I,nameOfInteractionState as i}from"./state";export{r as DragState,o as FocusState,c as HoverState,l as PressState,a as defineInteractableComponent,p as isInteractionState,I as isInteractionStateMask,i as nameOfInteractionState};
@@ -0,0 +1 @@
1
+ import{applyMotion as p}from"../motion";import{checkState as x,printDebug as w}from"../util";import{CSS_CLASS_RIPPLE as I,STATE_LAYER_PSEUDO_ELEMENT as d}from"./style";const N=75,E=225,D=150,M="cubic-bezier(0.4, 0, 0.2, 1)",_=.3,b="calc(50% + 10px)",O="--cw-interactable-ripple-color",W="--cw-interactable-ripple-opacity",B="--cw-interactable-ripple-radius",g=[{color:"--_CW-INTERACTABLE-RIPPLE1_COLOR",radius:"--_CW-INTERACTABLE-RIPPLE1_RADIUS",x:"--_CW-INTERACTABLE-RIPPLE1_X",y:"--_CW-INTERACTABLE-RIPPLE1_Y"},{color:"--_CW-INTERACTABLE-RIPPLE2_COLOR",radius:"--_CW-INTERACTABLE-RIPPLE2_RADIUS",x:"--_CW-INTERACTABLE-RIPPLE2_X",y:"--_CW-INTERACTABLE-RIPPLE2_Y"}],u=new WeakMap;class v{#e;layer;#o;#i;#t;#n;constructor(t,n,o){this.#e=t,this.layer=n,this.#o=o.color,this.#i=y(t.ownerDocument),this.#t=[p(t,[{[n.radius]:`${o.radius}px`,offset:0},{[n.radius]:o.end,offset:1}],{duration:E,easing:M,fill:"forwards",pseudoElement:d}),p(t,[{[n.x]:o.x,[n.y]:o.y,offset:0},{[n.x]:"50%",[n.y]:"50%",offset:1}],{duration:E,fill:"forwards",pseudoElement:d}),p(t,[{[n.color]:"transparent",offset:0},{[n.color]:o.color,offset:1}],{duration:N,fill:"forwards",pseudoElement:d})],this.#n=!1}finish(){if(this.#n)return;const t=p(this.#e,[{[this.layer.color]:this.#o,offset:0},{[this.layer.color]:"transparent",offset:1}],{duration:D,fill:"both",pseudoElement:d,startDelay:Math.max(0,E-(y(this.#e.ownerDocument)-this.#i))});this.#n=!0,this.#t.push(t),t.finished.then(()=>this.cancel(),()=>{})}cancel(){const t=u.get(this.#e);this.#n=!0;for(const n of this.#t)n.finished.catch(()=>{}),n.cancel();this.#t.length=0,t?.includes(this)===!0&&(t.splice(t.indexOf(this),1),t.length===0&&(u.delete(this.#e),this.#e.classList.remove(I)))}}function y(e){const t=e.timeline.currentTime;return typeof t=="number"?t:0}function i(e,t=0){const n=Number.parseFloat(e);return Number.isFinite(n)?n:t}function R(e,t){return e.boxSizing==="border-box"?[i(e.width,t[0]),i(e.height,t[1])]:[i(e.width,t[0])+i(e.paddingLeft)+i(e.paddingRight)+i(e.borderLeftWidth)+i(e.borderRightWidth),i(e.height,t[1])+i(e.paddingTop)+i(e.paddingBottom)+i(e.borderTopWidth)+i(e.borderBottomWidth)]}function U(e,t){const n=e.ownerDocument.defaultView;x(n!==null,"element owner document has no browsing context");const o=n.getComputedStyle(e),r=n.getComputedStyle(e,d),a=o.getPropertyValue(O).trim(),h=i(o.getPropertyValue(W)),m=`rgb(from ${a==="currentcolor"?o.color:a} r g b / calc(alpha * ${h}))`,f=i(o.getPropertyValue(B),NaN);if(t===void 0||Number.isFinite(f)){const[S,C]=R(r,[0,0]);return{color:m,end:Number.isFinite(f)?`${f}px`:b,radius:_*Math.max(S,C),x:"50%",y:"50%"}}const s=e.getBoundingClientRect(),[P,L]=R(o,[s.width,s.height]),[c,l]=R(r,[P,L]),T=(t[0]-s.left)*(s.width===0?1:P/s.width)-i(o.borderLeftWidth)-i(r.left),A=(t[1]-s.top)*(s.height===0?1:L/s.height)-i(o.borderTopWidth)-i(r.top);return{color:m,end:b,radius:_*Math.max(c,l),x:`${c===0?50:Math.max(0,Math.min(c,T))/c*100}%`,y:`${l===0?50:Math.max(0,Math.min(l,A))/l*100}%`}}function V(e,t){const n=u.get(e)??[];let o;try{const r=U(e,t);for(const a of n)a.finish();n.length===g.length&&n[0].cancel(),o=new v(e,g.find(a=>n.every(h=>h.layer!==a)),r)}catch(r){w("failed to enter ripple motion",r);return}return n.push(o),u.set(e,n),e.classList.add(I),o}export{V as applyRipple};
@@ -0,0 +1 @@
1
+ import{assertDebug as i}from"../util";const c=1,u=2,f=4,S=8,n=S|u|c|f,s=["hover","focus","press","drag"];function r(t){return 31-Math.clz32(t>>>0)}function o(t){if(t<0)return;const e=1<<Math.min(t,31);return(e&n)===e?e:void 0}function d(t){return t!==0&&(t&n)===t&&(t&t-1)===0}function x(t){return(t&n)===t}function b(t){const e=r(t);return i(d(t)&&e>=0&&e<=3),s[e]}function a(t){return o(r(t>>>0&-(t>>>0)))}function m(t){return o(r(t))}function p(t,e){return a(t&~(e|e-1))}function*y(t){for(let e=a(t);e!==void 0&&!(yield e);e=p(t,e));}export{S as DragState,u as FocusState,c as HoverState,f as PressState,m as highestInteractionStateOf,d as isInteractionState,x as isInteractionStateMask,a as lowestInteractionStateOf,b as nameOfInteractionState,p as nextInteractionStateOf,y as streamInteractionStates};
@@ -0,0 +1 @@
1
+ const t="::before",S="cw-interactable",e="_cw-interactable-stateLayer",_="_cw-interactable-focusIndicator",c="_cw-interactable-ripple";export{_ as CSS_CLASS_FOCUS_INDICATOR,S as CSS_CLASS_INTERACTABLE,c as CSS_CLASS_RIPPLE,e as CSS_CLASS_STATE_LAYER,t as STATE_LAYER_PSEUDO_ELEMENT};
@@ -0,0 +1 @@
1
+ function X(e,n,o){return Math.min(o,Math.max(n,e))}function M(e,n,o){return e+(n-e)*o}function C(e,n,o,t,r){return r<=o?e:r>=t?n:e+(n-e)*((r-o)/(t-o))}function x(e){if(e>=4294967296)throw new RangeError("invalid keyline count");return Math.max(0,Math.trunc(e)||0)}function N(e,n,o,t,r,u,i){return{size:e,offset:n,unadjustedOffset:o,focal:t,anchor:r,pivot:u,cutoff:i}}function L(e){for(let n=0;n<e.length;n++)if(e[n].focal)return n;return-1}function O(e){for(let n=e.length-1;n>=0;n--)if(e[n].focal)return n;return-1}function T(e,n,o,t){const r=t>0?e.length-1:0;let u=o;for(;u!==r&&e[u].size!==n;)u+=t;return u}function Z(e){let n=-1,o=0;for(let t=0;t<e.length;t++){const r=e[t];!r.anchor&&r.size>o&&(n=t,o=r.size)}return n}function H(e,n){let o=n;for(;n>=0&&o+1<e.length&&e[o+1].size===e[n].size;)o++;return o}function g(e,n,o,t,r){const u=Z(e),i=H(e,u),s=e[u].size,l=[],a=(c,d,_)=>{const{size:b,anchor:h}=e[c],y=d-b/2,S=d+b/2;return N(b,d,_,u<=c&&c<=i,h,c===t,y<0&&S>0?-y:y<n&&S>n?S-n:0)};let f=r-s/2-o,m=f;for(let c=t-1;c>=0;c--){const d=e[c].size;l.push(a(c,f-d/2,m-s/2)),f-=d+o,m-=s+o}l.reverse(),l.push(a(t,r,r)),f=r+s/2+o,m=f;for(let c=t+1;c<e.length;c++){const d=e[c].size;l.push(a(c,f+d/2,m+s/2)),f+=d+o,m+=s+o}return l}function P(e,n,o,t){const r=Z(e);if(r<0)return[];const u=e[r].size,i=H(e,r)-r,s=o===0||i%2===0?0:o/2;return g(e,n,o,r,t?n/2-u/2*i-s-Math.floor(i/2)*o:u/2)}function F(e,n,o){const t=[{size:e,anchor:!0}];for(let r=0;r<n.length;r+=2){const u=n[r+1];for(let i=x(n[r]);i>0;i--)t.push({size:u,anchor:!1})}return t.push({size:o,anchor:!0}),t}function w(e,n,o,t,r,u,i,s,l){const a=e-(s+u+t-1)*n,f=X(r,40,56),m=a-(l*s+i*u+f*t),c=t===0?0:m>0?f+Math.min(m/t,56-f):m<0?f+Math.max(m/t,40-f):f,d=(a-(t+u/2)*c)/(s+u/2),_=(d+c)/2;let b=_,h=d;if(u>0&&d!==l){const S=(l-d)*s,A=Math.min(Math.abs(S),_*.1*u);S>0?(b-=A/u,h+=A/s):(b+=A/u,h-=A/s)}return{cost:!(s>0&&t>0)||(u>0?h>b&&b>c:h>c)?Math.abs(l-h)*o:1/0,small:c,smallCount:t,medium:b,mediumCount:u,large:h,largeCount:s}}function z(e,n,o,t,r,u,i,s,l){let a,f=0;for(let m=0;m<l;m++)for(const c of u)for(const d of t){const _=w(e,n,++f,d,o,c,r,s-m,i);if((a===void 0||!(_.cost>=a.cost))&&(a=_,a.cost===0))return a}return a}function j(e,n,o){const{small:t,smallCount:r,medium:u,mediumCount:i,large:s,largeCount:l}=e;return P(F(10,[l,s,i,u,r,t],10),n,o,!1)}function G(e,n,o,t){if(e===0||n===0)return[];const r=e<80?0:1,u=Math.min(n,e),i=X(u/3,40,56),s=(u+i)/2,l=Math.ceil(e/u),a=Math.max(1,Math.floor((e-s-56*r)/u)),f=x(l-a+1);let m=z(e,o,i,[r],s,[1,0],u,l,f);return m!==void 0&&m.largeCount+m.mediumCount+m.smallCount>t&&(m=z(e,o,i,[0],s,[m.mediumCount],u,l,f)),m===void 0?[]:j(m,e,o)}function D(e,n,o,t){if(e===0)return[];const r=t&&o>=3,u=o<=1?0:r?2:1,i=e<40*u+40*1.25?0:u,s=X(e/3,40,56),l=Math.max(1,Math.floor((e-40*i)/e)),a=x(1-l+1),f=z(e,n,s,[i],0,[0],e,1,a);if(f===void 0)return[];if(!r||o<f.largeCount+f.smallCount)return j(f,e,n);const m=f.smallCount/2,c=f.mediumCount/2;return P(F(10,[m,f.small,c,f.medium,f.largeCount,f.large,c,f.medium,m,f.small],10),e,n,!0)}function U(e,n,o){if(e===0||n===0)return[];const t=Math.min(n,e),r=Math.max(1,Math.floor(e/(t+o))),u=e-r*(t+o);let i=Math.max(u*1.5,10);return i>t*.85&&(i=Math.min(Math.max(t*.85,u*1.2),t)),P(F(Math.max(Math.min(10,n),i/2),[r,t,u>0?1:0,i],10),e,o,!1)}function v(e,n,o,t,r){switch(e){case"multi-browse":return G(n,o,t,r);case"hero":case"center-aligned-hero":return D(n,t,r,e==="center-aligned-hero");case"uncontained":return U(n,o,t);default:return[]}}function I(e,n,o,t,r){const u=n>o?1:-1,i=e[n],s=e.findIndex(a=>a.pivot),l=e.slice();return l.splice(n,1),l.splice(o,0,i),g(l,t,r,s+u,e[s].offset+(i.size-i.cutoff+r)*u)}function B(e,n,o){const t=L(e),r=e.findIndex(l=>!l.anchor),u=e[t],i=t-r,s=[e];if(u.offset-u.size/2>=0&&t===r)return s;if(i<=0&&u.cutoff>0)return[e,I(e,0,0,n,o)];for(let l=0,a=e;l<i;l++){const f=r+l,m=f>0?T(a,e[f-1].size,O(a),1)-1:e.length-1;a=I(a,r,m,n,o),s.push(a)}return s}function p(e,n,o){const t=O(e);let r=e.length-1;for(;r>=0&&e[r].anchor;)r--;const u=e[t],i=r-t,s=[e];if(u.offset+u.size/2<=n&&t===r)return s;if(i<=0&&u.cutoff>0)return[e,I(e,0,0,n,o)];for(let l=0,a=e;l<i;l++){const f=r-l,m=f<e.length-1?T(a,e[f+1].size,L(a)-1,-1)+1:0;a=I(a,r,m,n,o),s.push(a)}return s}function E(e){return e[0].unadjustedOffset}function K(e){return-e[e.length-1].unadjustedOffset}function R(e,n,o){const t=[0];if(n===0)return t;for(let r=1;r<e.length;r++)t.push(r===e.length-1?1:t[r-1]+(o(e[r])-o(e[r-1]))/n);return t}function W(e,n,o){const t=[];for(let r=0;r<e.length;r++){const u=e[r],i=n[r],s=o<.5?u:i;t.push(N(M(u.size,i.size,o),M(u.offset,i.offset,o),M(u.unadjustedOffset,i.unadjustedOffset,o),s.focal,s.anchor,s.pivot,M(u.cutoff,i.cutoff,o)))}return t}function q(e,n,o,t,r){const u=v(e,n,o,t,r),i=L(u);if(r===0||i<0)return;const s=B(u,n,t),l=p(u,n,t),a=E(s[s.length-1])-E(u),f=K(l[l.length-1])-K(u);return{availableSpace:n,itemSize:u[i].size,itemSpacing:t,defaultKeylines:u,startSteps:s,endSteps:l,startShiftDistance:a,endShiftDistance:f,startShiftPoints:R(s,a,E),endShiftPoints:R(l,f,K)}}function J(e,n){return Math.max(0,e.itemSize*n+e.itemSpacing*(n-1)-e.availableSpace)}function Q(e,n,o){const t=Math.max(0,n),r=e.startShiftDistance,u=Math.max(0,o-e.endShiftDistance);let i,s,l,a;if(t>=r&&t<=u)return e.defaultKeylines;t>u?(i=C(0,1,u,o,t),s=e.endShiftPoints,l=e.endSteps,a=u<.01&&e.startSteps.length===2&&l.length===2?e.startSteps[1]:l[0]):(i=C(1,0,0,r,t),s=e.startShiftPoints,l=e.startSteps,a=l[0]);const f=Math.min(l.length,s.length);for(let m=1;m<f;m++)if(i<=s[m])return W(m===1?a:l[m-1],l[m],C(0,1,s[m-1],s[m],i));return a}function V(e,n,o,t){const r=e.itemSize,u=o*(r+e.itemSpacing)+r/2-t,i=n.length-1;let s=0,l=n[0];for(;!(l.unadjustedOffset>=u)&&s<i;)l=n[++s];const a=s===0||!(l.unadjustedOffset>=u)?l:n[s-1],f=a===l,m=f?1:(u-a.unadjustedOffset)/(l.unadjustedOffset-a.unadjustedOffset),c=M(a.offset,l.offset,m),d=M(a.size,l.size,m);return{translation:c-u+(f?(u-a.unadjustedOffset)/d:0),maskSize:d,visible:d>0&&c+d/2>0&&c-d/2<e.availableSpace}}function Y(e,n,o){const t=e.defaultKeylines,r=e.startSteps,u=e.endSteps,i=e.itemSize/2,s=L(t),l=r.length-1,a=u.length-1,f=o-1-n;let m=t[s].unadjustedOffset-i;if(n<=l){const c=r[Math.min(l,Math.max(0,l-n))];m=c[L(c)].unadjustedOffset-i}if(n>=o-1-a&&o>O(t)-s+1){const c=u[Math.min(a,Math.max(0,a-f))];m=c[O(c)].unadjustedOffset-i}return Math.round(m)}export{Q as carouselKeylinesAt,J as carouselMaxScroll,Y as carouselSnapOffset,q as carouselStrategy,V as placeCarouselItem};
@@ -0,0 +1 @@
1
+ @layer cw-style{.cw-Carousel{display:flex;flex-flow:column nowrap;gap:cw-var(--cw-Measurement-space100);min-inline-size:0;position:relative}.cw-Carousel:not([data-cw-carousel-layout=full-screen]){padding-block:cw-var(--cw-Measurement-space100);padding-inline:cw-var(--cw-Measurement-space200)}.cw-Carousel:is([data-cw-carousel-layout=uncontained],[data-cw-carousel-layout=uncontained-multi-aspect-ratio]){padding-inline-end:0}.cw-Carousel-controls{align-items:center;display:flex;gap:cw-var(--cw-Measurement-space100);justify-content:flex-end}.cw-Carousel-controls-hidden{display:none}.cw-Carousel-controls button{-cw-typescale:--cw-Typescale-label-large;appearance:none;background-color:cw-var(--cw-Color-secondary-container);border:0;border-radius:cw-var(--cw-CornerRadius-full);color:cw-var(--cw-Color-secondary-onContainer);cursor:pointer;min-block-size:cw-var(--cw-Measurement-space600);min-inline-size:cw-var(--cw-Measurement-space600);padding-inline:cw-var(--cw-Measurement-space200);transition-duration:cw-var(--cw-Motion-spring-effect-fast-duration);transition-property:background-color,color;transition-timing-function:cw-var(--cw-Motion-spring-effect-fast-easing)}.cw-Carousel-controls button:hover{background-color:color-mix(in srgb,cw-var(--cw-Color-secondary-onContainer) calc(100%*cw-var(--cw-State-layer-hoverOpacity)),cw-var(--cw-Color-secondary-container))}.cw-Carousel-controls button:active{background-color:color-mix(in srgb,cw-var(--cw-Color-secondary-onContainer) calc(100%*cw-var(--cw-State-layer-pressOpacity)),cw-var(--cw-Color-secondary-container))}.cw-Carousel-controls button:disabled{background-color:cw-scale-opacity(cw-var(--cw-Color-surface-onFill),.1);color:cw-scale-opacity(cw-var(--cw-Color-surface-onFill),.38);cursor:default}:is(.cw-Carousel-controls button,.cw-Carousel-showAll,.cw-Carousel-viewport):focus-visible{outline-color:cw-var(--cw-Color-secondary-fill);outline-offset:cw-var(--cw-State-focusIndicator-outerOffset);outline-style:solid;outline-width:cw-var(--cw-State-focusIndicator-thickness)}.cw-Carousel-viewport{border-radius:cw-var(--cw-CornerRadius-medium);min-inline-size:0;overflow-x:auto;overflow-y:hidden;overscroll-behavior-inline:contain;scroll-snap-type:inline mandatory;scrollbar-width:none}.cw-Carousel-viewport::-webkit-scrollbar{display:none}._cw-Carousel-vertical .cw-Carousel-viewport{block-size:min(80vh,600px);flex:1 1 auto;min-block-size:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior-block:contain;scroll-snap-type:block mandatory}.cw-Carousel:is([data-cw-carousel-layout=uncontained],[data-cw-carousel-layout=uncontained-multi-aspect-ratio])[data-cw-carousel-snap=false] .cw-Carousel-viewport{scroll-snap-type:none}.cw-Carousel-track{display:flex;flex-flow:row nowrap;gap:var(--cw-carousel-item-gap, 8px);min-inline-size:100%}._cw-Carousel-vertical .cw-Carousel-track{block-size:100%;flex-flow:column nowrap}.cw-Carousel[data-cw-carousel-layout=full-screen] .cw-Carousel-track{gap:cw-var(--cw-Measurement-space200)}.cw-Carousel-slide{--cw-carousel-item-shape: cw-var(--cw-CornerRadius-xlarge);box-sizing:border-box;flex:0 0 var(--cw-carousel-item-size, 240px);min-block-size:0;min-inline-size:0;outline:none;position:relative;scroll-snap-align:start;scroll-snap-stop:always}.cw-Carousel[data-cw-carousel-layout=full-screen] .cw-Carousel-slide{--cw-carousel-item-shape: 0px;flex-basis:100%}._cw-Carousel-vertical[data-cw-carousel-layout=full-screen] .cw-Carousel-slide{min-block-size:100%}.cw-Carousel[data-cw-carousel-layout=full-screen] .cw-Carousel-slide[aria-current=false]{content-visibility:auto}.cw-Carousel:is([data-cw-carousel-layout=uncontained],[data-cw-carousel-layout=uncontained-multi-aspect-ratio]) .cw-Carousel-slide{scroll-snap-stop:normal}.cw-Carousel[data-cw-carousel-layout=uncontained-multi-aspect-ratio] .cw-Carousel-slide{block-size:var(--cw-carousel-item-size, 240px);flex-basis:calc(var(--cw-carousel-item-size, 240px) * var(--cw-carousel-aspect-ratio, 1))}.cw-Carousel[data-cw-carousel-layout=uncontained-multi-aspect-ratio]._cw-Carousel-vertical .cw-Carousel-slide{block-size:auto;flex-basis:calc(var(--cw-carousel-item-size, 240px) / var(--cw-carousel-aspect-ratio, 1));inline-size:var(--cw-carousel-item-size, 240px)}.cw-Carousel-mask{block-size:100%;border-radius:var(--cw-carousel-item-shape);box-sizing:border-box;clip-path:inset(0 var(--cw-carousel-item-inset, 0px) round var(--cw-carousel-item-shape));inline-size:100%;overflow:hidden;transform:translate(var(--cw-carousel-item-offset, 0px))}._cw-Carousel-vertical .cw-Carousel-mask{clip-path:inset(var(--cw-carousel-item-inset, 0px) 0 round var(--cw-carousel-item-shape));transform:translateY(var(--cw-carousel-item-offset, 0px))}.cw-Carousel-mask>:is(img,video){block-size:100%;inline-size:100%;object-fit:cover}.cw-Carousel-slide:focus-visible:after{border-radius:var(--cw-carousel-item-shape);content:"";inset-block:0;inset-inline:var(--cw-carousel-item-inset, 0px);outline-color:cw-var(--cw-Color-secondary-fill);outline-offset:cw-var(--cw-State-focusIndicator-innerOffset);outline-style:solid;outline-width:cw-var(--cw-State-focusIndicator-thickness);pointer-events:none;position:absolute;transform:translate(var(--cw-carousel-item-offset, 0px))}._cw-Carousel-vertical .cw-Carousel-slide:focus-visible:after{inset-block:var(--cw-carousel-item-inset, 0px);inset-inline:0;transform:translateY(var(--cw-carousel-item-offset, 0px))}}
@@ -0,0 +1,10 @@
1
+ import{createComponent as D,createContext as k,onCleanup as z,onMount as H,untrack as f,useContext as R}from"solid-js";import{defineDomComponent as S}from"..";import{DomController as E}from"../dom/client";import{deferAfterDelegatedCancellation as v}from"../util";import{carouselKeylinesAt as _,carouselMaxScroll as O,carouselSnapOffset as N,carouselStrategy as B,placeCarouselItem as F}from"./carousel-layout";import{hasNestedInteractive as $,isElementNode as V}from"./interactive";import"./carousel.css";const X=240,J=40,q=8,G=9/16,U=16/9,K=150,g=.5,L="cw-carousel-label-change",W="data-cw-carousel-slide",p="data-cw-carousel-generated-label",A="cw-Carousel-controls",Z=`${A} cw-Carousel-controls-hidden`,M=k();function I(s){return s===void 0||!Number.isFinite(s)?void 0:Math.max(0,Math.trunc(s))}function C(s){return s!==void 0&&Number.isFinite(s)?Math.trunc(s):0}function w(s){return f(()=>C("index"in s?s.index:"activeIndex"in s?s.activeIndex:s.defaultIndex))}function T(s){return s===void 0||!Number.isFinite(s)?1:Math.max(G,Math.min(U,s))}function j(s){return s==="multi-browse"||s==="hero"||s==="center-aligned-hero"||s==="uncontained"}function P(s,e){const t=I(e.itemCount),i=Math.max(0,w(e)),n=t===void 0?i:Math.min(i,Math.max(0,t-1)),o=e.loop===!0;return<div{...s}aria-label={s["aria-label"]??e.label??"Carousel"}aria-roledescription="carousel"classList={{...s.classList,"cw-Carousel":!0,[`_cw-Carousel-${e.orientation??"horizontal"}`]:!0}}data-cw-carousel-layout={e.layout??"full-screen"}data-cw-carousel-orientation={e.orientation??"horizontal"}data-cw-carousel-snap={e.snap===!0?"true":"false"}role="region">
2
+ <div class={e.showControls===!1?Z:A}>
3
+ <button aria-label={e.previousLabel??"Previous"}class="cw-Carousel-previous"data-cw-carousel-previous disabled={t!==void 0&&!o&&n<=0}type="button">{e.previousLabel??"Previous"}</button>
4
+ <button aria-label={e.nextLabel??"Next"}class="cw-Carousel-next"data-cw-carousel-next disabled={t!==void 0&&!o&&n>=t-1}type="button">{e.nextLabel??"Next"}</button>
5
+ </div>
6
+ <button class="cw-Carousel-showAll"hidden={e.onShowAll===void 0}type="button">{e.showAllLabel??"Show all"}</button>
7
+ <div class="cw-Carousel-viewport"data-cw-carousel-viewport tabIndex={0}>
8
+ <div class="cw-Carousel-track"data-cw-carousel-track>{s.children}</div>
9
+ </div>
10
+ </div>}class Y extends E{#o;#t;#f;#E;#a;#u;#m;#i;#e;#h;#n;#r;#c;#p;#w;#b;#l;#d;#v;#s;#L;#A;#y;#C;constructor(e){super(e,{styleElementIsFunction:!0}),this.#o="index"in e||"activeIndex"in e,this.#t=null,this.#f=null,this.#E=null,this.#a=null,this.#u=null,this.#m=null,this.#i=[],this.#e=Math.max(0,w(e)),this.#h=void 0,this.#n=f(()=>e.orientation??"horizontal"),this.#r=!1,this.#c=void 0,this.#p=0,this.#w=[],this.#b=new Set,this.#l=void 0,this.#d=void 0,this.#v=!1,this.#s=void 0,this.#L=!1,this.#A=0,this.#y=void 0,this.#C=void 0,H(()=>this.#g()),z(()=>this.#ee())}#x(){return this.props.layout??"full-screen"}#M(){const e=this.#t;return e===null?0:this.#n==="vertical"?e.scrollTop:e.scrollLeft*(this.#r?-1:1)}#q(){const e=this.#f;this.#i=e===null?[]:Array.from(e.children).filter(t=>t.hasAttribute(W)),this.#b.clear()}#g(){this.#t?.isConnected===!0&&(this.#C===void 0&&this.#Q(),this.#q(),this.#I(),this.#O(),this.#$())}#I(){const e=this.#t,t=this.#x(),i=this.#n==="vertical",n=this.#i;if(e===null)return;const o=e.ownerDocument.defaultView,r=i?e.clientHeight:e.clientWidth,d=Math.max(J,this.props.itemSize??X),h=Math.max(0,this.props.itemGap??q),m=i?"scroll-margin-block-start":"scroll-margin-inline-start",b=i?"scroll-margin-inline-start":"scroll-margin-block-start";this.#A=r,this.#r=!i&&o?.getComputedStyle(e).direction==="rtl",this.#c=!j(t)||r<=0?void 0:B(t,r,d,h,n.length),e.style.setProperty("--cw-carousel-item-gap",`${h}px`),e.style.setProperty("--cw-carousel-item-size",`${this.#c?.itemSize??d}px`);const c=this.#c;if(c!==void 0){const l=c.itemSize+c.itemSpacing;this.#p=O(c,n.length),this.#w=n.map((u,y)=>{const x=N(c,y,n.length);return u.style.setProperty(m,`${x}px`),u.style.removeProperty(b),Math.min(this.#p,Math.max(0,y*l-x))});for(const u of n)u.style.visibility="hidden",u.inert=!0;this.#T();return}this.#p=0;for(const l of n)l.style.removeProperty(m),l.style.removeProperty(b),l.style.removeProperty("--cw-carousel-item-offset"),l.style.removeProperty("--cw-carousel-item-inset"),l.style.removeProperty("visibility");const a=this.#f?.getBoundingClientRect();this.#w=a===void 0?[]:n.map(l=>{const u=l.getBoundingClientRect();return i?u.top-a.top:this.#r?a.right-u.right:u.left-a.left})}#T(){const e=this.#c,t=this.#i;if(e===void 0)return;const i=Math.max(0,Math.min(this.#p,this.#M())),n=_(e,i,this.#p),o=e.itemSize+e.itemSpacing,r=n.length,d=Math.max(0,Math.floor(i/o)-r),h=Math.ceil((i+e.availableSpace)/o),m=Math.min(t.length-1,h+r),b=this.#r?-1:1,c=new Set;for(let a=d;a<=m;a++){const l=F(e,n,a,i),u=t[a];l.visible&&(u.style.setProperty("--cw-carousel-item-offset",`${l.translation*b}px`),u.style.setProperty("--cw-carousel-item-inset",`${Math.max(0,(e.itemSize-l.maskSize)/2)}px`),this.#b.has(a)||(u.style.removeProperty("visibility"),u.inert=!1),c.add(a))}for(const a of this.#b){const l=t[a];l!==void 0&&!c.has(a)&&(l.style.visibility="hidden",l.inert=!0)}this.#b=c}#_(){const e=this.#w,t=this.#M();let i=0,n=e.length-1;for(;i<n;){const o=Math.floor((i+n)/2);e[o]<t?i=o+1:n=o}return i>0&&t-e[i-1]<e[i]-t?i-1:i}#O(){const e=this.#i,t=this.#x(),i=this.#c!==void 0;this.#o&&(this.#e=C(this.props.index??this.props.activeIndex)),this.#e=Math.max(0,Math.min(this.#e,e.length-1));for(const[n,o]of e.entries())(!o.hasAttribute("aria-label")||o.hasAttribute(p))&&(o.setAttribute("aria-label",`Slide ${n+1} of ${e.length}`),o.setAttribute(p,"true")),o.setAttribute("aria-current",n===this.#e?"true":"false"),t==="full-screen"?o.inert=n!==this.#e:i||(o.inert=!1);this.#D()}#P(e,t){const i=this.#x()==="full-screen";for(const[n,o]of[[e,!1],[t,!0]]){const r=this.#i[n];r!==void 0&&(r.setAttribute("aria-current",o?"true":"false"),i&&(r.inert=!o))}this.#D()}#D(){const e=this.props.loop===!0,t=this.#i.length;this.#a!==null&&(this.#a.disabled=t===0||!e&&this.#e<=0),this.#u!==null&&(this.#u.disabled=t===0||!e&&this.#e>=t-1)}#k(e,t,i){const n=this.#i.length,o=this.props.loop===!0?(e%n+n)%n:Math.max(0,Math.min(e,n-1)),r=this.#e;if(!(n===0||o===r)){if(this.#o){this.#S(o,t);return}this.#e=o,this.#P(r,o),this.#z(i),this.#S(o,t)}}#S(e,t){f(()=>this.props.onIndexChange?.(e,t))}#z(e){const t=this.#t,i=this.#i[this.#e],n=t?.ownerDocument.defaultView;if(t===null||i===void 0||n==null)return;const o=n.matchMedia("(prefers-reduced-motion: reduce)").matches;this.#N(o?"auto":"smooth"),e&&(i.inert=!1,i.style.removeProperty("visibility"),i.focus({preventScroll:!0}))}#N(e){const t=this.#t,i=this.#i[this.#e],n=this.#n==="vertical";if(t===null||i===void 0)return;if(this.#c!==void 0){const h=this.#w[this.#e]??0,m=this.#r?-h:h;if(Math.abs(h-this.#M())<g)return;this.#B(),t.scrollTo(n?{behavior:e,top:h}:{behavior:e,left:m});return}const o=t.getBoundingClientRect(),r=i.getBoundingClientRect(),d=n?r.top-o.top:this.#r?r.right-o.right:r.left-o.left;!Number.isFinite(d)||Math.abs(d)<g||(this.#B(),t.scrollBy({behavior:e,left:n?0:d,top:n?d:0}))}#B(){this.#v=!0,this.#F()}#F(){const e=this.#t?.ownerDocument.defaultView;this.#s!==void 0&&e?.clearTimeout(this.#s),this.#s=e?.setTimeout(this.#J,K)}#$(){const e=this.#t?.ownerDocument.defaultView;e!=null&&(this.#d!==void 0&&e.cancelAnimationFrame(this.#d),this.#d=e.requestAnimationFrame(()=>{this.#d=void 0,this.#N("auto"),this.#T()}))}#V(){this.#l=void 0,this.#T(),this.#v||this.#X()}#X(){const e=this.#i.length===0?this.#e:this.#_(),t=this.#e;if(!(e===t&&this.#h===void 0)){if(this.#o){e!==(this.#h??t)&&(this.#h=e===t?void 0:e,e!==t&&this.#S(e));return}this.#e=e,this.#P(t,e),this.#S(e)}}#G=()=>{const e=this.#t?.ownerDocument.defaultView;(this.#v||!this.#L)&&this.#F(),!(this.#l!==void 0||e==null)&&(this.#l=e.requestAnimationFrame(()=>this.#V()))};#J=()=>{const e=this.#t?.ownerDocument.defaultView;if(this.#s!==void 0&&e?.clearTimeout(this.#s),this.#s=void 0,this.#l!==void 0&&(e?.cancelAnimationFrame(this.#l),this.#V()),this.#v){this.#v=!1,this.#X();return}!this.#o||this.#i.length===0||(this.#h=void 0,this.#_()!==this.#e&&this.#z(!1))};#U=e=>v(e,this.#t,()=>this.#k(this.#e-1,e,!1),!1);#K=e=>v(e,this.#t,()=>this.#k(this.#e+1,e,!1),!1);#W=e=>{f(()=>this.props.onShowAll?.(e))};#Z=()=>{this.#x()==="uncontained-multi-aspect-ratio"&&this.#I(),this.#O()};#j=e=>{const t=this.#t,i=this.#n==="horizontal",n=i?this.#r?"ArrowLeft":"ArrowRight":"ArrowDown",o=i?this.#r?"ArrowRight":"ArrowLeft":"ArrowUp";if(e.defaultPrevented||t===null||e.target!==t&&V(e.target)&&$(e.target,t,e.composedPath()))return;const r=e.key==="Home"?0:e.key==="End"?this.#i.length-1:e.key===n?this.#e+1:e.key===o?this.#e-1:void 0;r!==void 0&&v(e,t,()=>this.#k(r,e,!0))};applyComponentProps(){const e=super.readProps(["activeIndex","index","itemGap","itemSize","label","layout","loop","nextLabel","onShowAll","orientation","previousLabel","showAllLabel","showControls","snap","attr:aria-label"]),t=e["attr:aria-label"]??e.label??"Carousel";let i=e.layoutChanged||e.itemSizeChanged||e.itemGapChanged;e.snapChanged&&super.setAttribute("data-cw-carousel-snap",e.snap===!0?"true":"false"),e.layoutChanged&&super.setAttribute("data-cw-carousel-layout",e.layout??"full-screen"),e.orientationChanged&&(this.#n=e.orientation??"horizontal",super.setAttribute("data-cw-carousel-orientation",this.#n),super.setClass("orientation",`_cw-Carousel-${this.#n}`),i=!0),super.styleElement?.getAttribute("aria-label")!==t&&super.setAttribute("aria-label",t),this.#m!==null&&(e.onShowAllChanged||e.showAllLabelChanged)&&(this.#m.hidden=e.onShowAll===void 0,this.#m.textContent=e.showAllLabel??"Show all"),e.previousLabelChanged&&this.#a!==null&&(this.#a.setAttribute("aria-label",e.previousLabel??"Previous"),this.#a.textContent=e.previousLabel??"Previous"),e.nextLabelChanged&&this.#u!==null&&(this.#u.setAttribute("aria-label",e.nextLabel??"Next"),this.#u.textContent=e.nextLabel??"Next"),e.showControlsChanged&&this.#E?.classList.toggle("cw-Carousel-controls-hidden",e.showControls===!1),i?this.#g():e.loopChanged&&this.#D(),this.#o&&(e.indexChanged||e.activeIndexChanged)&&this.#Y(C("index"in this.props?e.index:e.activeIndex))}#Y(e){const t=Math.max(0,Math.min(e,this.#i.length-1)),i=this.#e,n=t===this.#h;this.#h=void 0,!(this.#i.length===0||t===i)&&(this.#e=t,this.#P(i,t),n||this.#z(!1))}#H(e,t){const i=t?"addEventListener":"removeEventListener",n=this.#t;n?.[i]("scroll",this.#G,{passive:!0}),n?.[i]("scrollend",this.#J),n?.[i]("keydown",this.#j),this.#a?.[i]("click",this.#U),this.#u?.[i]("click",this.#K),this.#m?.[i]("click",this.#W),e?.[i](L,this.#Z)}#R(){this.#y?.disconnect(),this.#C?.disconnect(),this.#y=void 0,this.#C=void 0}#Q(){const e=this.#t,t=e?.ownerDocument.defaultView;this.#R(),!(t==null||e===null||this.#f===null)&&(this.#y=new t.MutationObserver(()=>this.#g()),this.#y.observe(this.#f,{childList:!0}),this.#C=new t.ResizeObserver(()=>{(this.#n==="vertical"?e.clientHeight:e.clientWidth)!==this.#A&&(this.#I(),this.#$())}),this.#C.observe(e))}onStyleElementChanged(e){this.#H(super.styleElement,!1),super.onStyleElementChanged(e),this.#t=e?.querySelector("[data-cw-carousel-viewport]")??null,this.#f=this.#t?.querySelector(":scope > [data-cw-carousel-track]")??null,this.#E=e?.querySelector(".cw-Carousel-controls")??null,this.#a=e?.querySelector("[data-cw-carousel-previous]")??null,this.#u=e?.querySelector("[data-cw-carousel-next]")??null,this.#m=e?.querySelector(".cw-Carousel-showAll")??null,this.#L=this.#t!==null&&"onscrollend"in this.#t,this.#H(e,!0),this.#R(),this.#g()}render(e){return f(()=>P({children:e},{index:this.#e,itemCount:this.props.itemCount,label:this.props["attr:aria-label"]??this.props.label,layout:this.props.layout,loop:this.props.loop,nextLabel:this.props.nextLabel,onShowAll:this.props.onShowAll,orientation:this.#n,previousLabel:this.props.previousLabel,showAllLabel:this.props.showAllLabel,showControls:this.props.showControls,snap:this.props.snap}))}#ee(){const e=this.#t?.ownerDocument.defaultView;this.#s!==void 0&&e?.clearTimeout(this.#s),this.#l!==void 0&&e?.cancelAnimationFrame(this.#l),this.#d!==void 0&&e?.cancelAnimationFrame(this.#d),this.#s=void 0,this.#l=void 0,this.#d=void 0,this.#R(),this.#H(super.styleElement,!1),this.#i=[],this.#b.clear()}}const Q=S(()=>P,()=>Y),de=s=>D(M.Provider,{value:f(()=>{const e=I(s.itemCount),t=Math.max(0,w(s));let i=0;return{layout:s.layout??"full-screen",currentIndex:e===void 0?t:Math.min(t,Math.max(0,e-1)),itemCount:e,nextItemIndex:()=>i++}}),get children(){return f(()=>Q(s))}});function ee(s,e){const t=R(M),i=t?.nextItemIndex()??0,n=s["aria-label"]??e.label,o=t===void 0?void 0:i===t.currentIndex?"true":"false",r=t?.itemCount===void 0?`Slide ${i+1}`:`Slide ${i+1} of ${t.itemCount}`;return<div{...s}aria-current={o}aria-label={n??r}aria-roledescription="slide"classList={{...s.classList,"cw-Carousel-slide":!0}}data-cw-carousel-generated-label={n===void 0?"true":void 0}data-cw-carousel-slide="true"inert={t?.layout==="full-screen"&&i!==t.currentIndex}role="group"style={{...s.style,"--cw-carousel-aspect-ratio":T(e.aspectRatio)}}tabIndex={-1}><div class="cw-Carousel-mask">{s.children}</div></div>}class te extends E{constructor(e){super(e,{styleElementIsFunction:!0})}#o(){super.styleElement?.dispatchEvent(new Event(L,{bubbles:!0}))}applyComponentProps(){const e=super.readProps(["aspectRatio","label","attr:aria-label"]),t=e["attr:aria-label"]??e.label,i=super.styleElement,n=i?.hasAttribute(p)===!0,o=t===void 0?n&&i?.hasAttribute("aria-label")===!0:!n&&i?.getAttribute("aria-label")===t;e.aspectRatioChanged&&(super.setStyle("--cw-carousel-aspect-ratio",T(e.aspectRatio)),this.#o()),!o&&(t===void 0?(super.setAttribute("aria-label",void 0),i?.setAttribute(p,"true")):(i?.removeAttribute(p),super.setAttribute("aria-label",t)),this.#o())}render(e){return<div aria-roledescription="slide"class="cw-Carousel-slide"data-cw-carousel-slide="true"role="group"tabIndex={-1}><div class="cw-Carousel-mask">{e}</div></div>}}const ie=S(()=>ee,()=>te),he=ie;export{de as Carousel,Y as CarouselController,ie as CarouselItem,he as CarouselSlide};
@@ -0,0 +1,35 @@
1
+ import{createUniqueId as l,untrack as F}from"solid-js";import{insert as B}from"solid-js/web";import{defineDomComponent as w}from"..";import{Button as D}from"../action/button";import{IconButton as P}from"../action/icon-button";import{ELEVATION_SHADOW_CSS_CLASS as v}from"../container/elevation-shadow";import{DomController as R}from"../dom/client";import{isElementNode as y,isTopModalLayer as H,registerModalLayer as _}from"../navigation/base";import{deferAfterDelegatedCancellation as X}from"../util/event";import{resolveSurfaceSlots as O}from"./slots";import"../container/elevation-shadow.css";import"./surface.css";const J="a[href], area[href], button, input:not([type=hidden]), select, textarea, summary, iframe, [contenteditable]:not([contenteditable=false]), [tabindex]",k="data-cw-dialog-action",M="cw-AlertDialog-noDismiss",T="cw-FullScreenDialog-noConfirm",q="cw-FullScreenDialog-scrolled";function E(n){const e=n.getRootNode().activeElement;return y(e)?e:null}function S(n,e){return!n.hidden&&!n.matches(":disabled")&&n.getAttribute("aria-disabled")!=="true"&&(!e||!n.hasAttribute("tabindex")||n.tabIndex>=0)&&n.closest("[hidden], [inert], [aria-hidden='true']")===null&&n.checkVisibility({visibilityProperty:!0})}function L(n,e){const t=Array.from(n.querySelectorAll(J));return e&&t.reverse(),t.find(i=>S(i,!0))}function I(n,e){const t=e.target,i=y(t)?t.closest(`[${k}]`):null;return n===null||i?.closest("dialog")!==n?null:i.getAttribute(k)}function N(n){const e=n,t={};for(const i of Object.keys(e))["children","aria-describedby","aria-label","aria-labelledby","aria-modal"].includes(i)||(t[i]=e[i]);return t}function C(n){return("open"in n?n.open:n.defaultOpen)===!0}function A(n,e,t){const i=n,s=i["aria-label"],o=i["aria-labelledby"]??(s===void 0?t.labelledBy:void 0);return{...N(n),"aria-describedby":i["aria-describedby"]??t.describedBy,"aria-label":s??(o===void 0?e.label??t.label:void 0),"aria-labelledby":o,"aria-modal":"aria-modal"in i?i["aria-modal"]:e.modal!==!1?"true":void 0,classList:{...n.classList,...t.classes},open:C(e),role:e.role??t.role,tabIndex:e.tabIndex}}function z(n,e){return<dialog{...A(n,e,{classes:{[v]:!0,"cw-Dialog":!0,"cw-Dialog-open":C(e)},label:"Dialog",role:"dialog"})}>{n.children}</dialog>}class x extends R{#r;#n;#o;#t;#s;#c;#e;#i;#l;#d;#f;#p;#g;#u;#h;#b;#a;#v;constructor(e,t="cw-Dialog"){super(e,{styleElementIsFunction:!0}),this.#r=t,this.#n="open"in e,this.#o="attr:aria-modal"in e,this.#e=null,this.#i=F(()=>(this.#n?e.open:e.defaultOpen)===!0),this.#l=F(()=>e.modal!==!1),this.#d=!1,this.#f=null,this.#p=0,this.#g=!1,this.#u=!1,this.#h=void 0,this.#b=!1,this.#a=void 0,this.#v=!1;const i=super.consumeProps([],["onOpenChange","onClose","onCancel"]);this.#t=i.onOpenChange,this.#s=i.onClose,this.#c=i.onCancel}defaultRole(){return"dialog"}defaultLabel(){return this.props.label??"Dialog"}defaultLabelledBy(){}defaultDescribedBy(){}allowDismiss(e,t){return!0}requestDismiss(e,t){this.allowDismiss(e,t)&&this.close(e,t)}onOpenStateChanged(e){}onShown(){}isOpen(){return this.#i}open(){this.#E(!0,!0,"programmatic")}close(e="programmatic",t){this.#E(!1,!0,e,t)}toggle(){this.#i?this.close():this.open()}#D(e,t,i){this.#t?.(e,t,i)}#k(e){this.#i=e,super.setClass(`${this.#r}-open`,e),this.onOpenStateChanged(e)}#E(e,t,i,s){const o=e!==this.#i;if(t&&this.#n){o&&this.#D(e,s,i);return}!o&&(this.#e===null||this.#e.open===e)||(this.#k(e),e?this.#m():this.#M(),t&&o&&this.#D(e,s,i))}#m(){const e=this.#e;if(!(e===null||!this.#i)){if(!e.isConnected){this.#T(e);return}if(this.#y(),this.#f===null){const t=E(e);t!==null&&!e.contains(t)&&(this.#f=t)}if(e.open){if(this.#d===this.#l)return;this.#d?(this.#p++,e.close()):e.removeAttribute("open")}this.#l&&this.props.returnFocus===!1&&E(e)?.blur();try{this.#l?e.showModal():e.show(),this.#d=this.#l}catch{e.setAttribute("open",""),this.#d=!1}this.#I(),this.#a?.(),this.#a=this.#l?_(e):void 0,this.onShown()}}#M(){const e=this.#e;if(this.#y(),this.#a?.(),this.#a=void 0,e===null)return;const t=this.#C(e);if(e.open)try{e.close()}catch{e.removeAttribute("open")}this.#d=!1,this.#P(t)}#T(e){const t=()=>{const i=e.ownerDocument.defaultView;this.#h=void 0,!(!this.#u||this.#e!==e)&&(e.isConnected?(this.#u=!1,this.#m()):i!==null&&(this.#h=i.requestAnimationFrame(t)))};this.#u||(this.#u=!0,queueMicrotask(t))}#y(){const e=this.#h;this.#u=!1,this.#h=void 0,e!==void 0&&this.#e?.ownerDocument.defaultView?.cancelAnimationFrame(e)}#C(e){const t=E(e);return t===null||t===e.ownerDocument.body||e.contains(t)}#P(e){const t=this.#f;this.#f=null,!(t===null||!e||this.props.returnFocus===!1)&&queueMicrotask(()=>{const i=this.#e;t.isConnected&&(i===null||this.#C(i))&&t.focus()})}#I(){this.#g||(this.#g=!0,queueMicrotask(()=>{const e=this.#e,t=this.props.initialFocus;let i=null;if(this.#g=!1,!this.#i||e===null)return;if(typeof t=="string")try{i=e.querySelector(t)}catch{}else y(t)&&e.contains(t)&&(i=t);(i!==null&&S(i,!1)?i:Array.from(e.querySelectorAll("[autofocus]")).find(o=>S(o,!1))??L(e,!1)??e).focus()}))}#B(e,t){const i=L(e,!1),s=L(e,!0),o=E(e);i===void 0||s===void 0?(t.preventDefault(),e.focus()):(t.shiftKey?o===i||o===e:o===s)&&(t.preventDefault(),(t.shiftKey?s:i).focus())}#O(e){const t=this.#e,i=t?.getBoundingClientRect();return t!==null&&e.target===t&&i!==void 0&&(e.clientX<i.left||e.clientX>i.right||e.clientY<i.top||e.clientY>i.bottom)}#L=e=>{const t=this.#e;t!==null&&this.#l&&!H(t)||(this.#c?.(e),!e.defaultPrevented&&(this.requestDismiss("cancel",e),e.preventDefault()))};#S=e=>{const t=this.#e;if(this.#p>0){this.#p--;return}if(this.#s?.(e),!(t===null||t.open||!this.#i)){if(this.#a?.(),this.#a=void 0,this.#d=!1,this.#n){this.#D(!1,e,"close"),queueMicrotask(()=>this.#m());return}this.#k(!1),this.#D(!1,e,"close"),this.#P(this.#C(t))}};#w=e=>{this.#b=this.#O(e)};#A=e=>{const t=this.#b;this.#b=!1,t&&this.#i&&this.props.closeOnBackdrop!==!1&&this.#O(e)&&this.requestDismiss("backdrop",e)};#x=e=>{const t=this.#e;if(!(t===null||e.defaultPrevented||!this.#i||!y(e.target)||e.target.closest("dialog")!==t))if(e.key==="Escape"){if(e.isTrusted&&this.#d)return;X(e,t,()=>{const i=t.ownerDocument.defaultView?.Event??Event;this.#e===t&&this.#i&&t.dispatchEvent(new i("cancel",{cancelable:!0}))})}else e.key==="Tab"&&this.#l&&this.#B(t,e)};#F(e,t){this.#e?.getAttribute(e)!==(t??null)&&super.setAttribute(e,t)}applyComponentProps(){const e=super.readProps(["attr:aria-describedby","attr:aria-label","attr:aria-labelledby","label","modal","open","role","tabIndex"]),t=e["attr:aria-label"],i=e["attr:aria-labelledby"]??(t===void 0?this.defaultLabelledBy():void 0);e.modalChanged&&(this.#l=e.modal!==!1,this.#o||super.setAttribute("aria-modal",this.#l?"true":void 0),this.#m()),e.roleChanged&&super.setAttribute("role",e.role??this.defaultRole()),e.tabIndexChanged&&super.setAttribute("tabindex",e.tabIndex),this.#F("aria-label",t??(i===void 0?this.defaultLabel():void 0)),this.#F("aria-labelledby",i),this.#F("aria-describedby",e["attr:aria-describedby"]??this.defaultDescribedBy()),this.#v||(this.#v=!0,super.setClass(`${this.#r}-open`,this.#i)),e.openChanged&&this.#n&&this.#E(e.open===!0,!1,"programmatic")}onStyleElementChanged(e){const t=this.#e;super.onStyleElementChanged(e),t!==null&&(t.removeEventListener("cancel",this.#L),t.removeEventListener("close",this.#S),t.removeEventListener("click",this.#A),t.removeEventListener("keydown",this.#x),t.removeEventListener("pointerdown",this.#w)),this.#e=e,this.#e!==null&&(this.#e.addEventListener("cancel",this.#L),this.#e.addEventListener("close",this.#S),this.#e.addEventListener("click",this.#A),this.#e.addEventListener("keydown",this.#x),this.#e.addEventListener("pointerdown",this.#w),this.#m())}render(e){const t=<dialog class={`cw-Dialog ${v}`}/>;return B(t,e),t}onControllerCleanup(){const e=this.#e;if(this.#i=!1,this.#y(),this.#a?.(),this.#a=void 0,e!==null&&(e.removeEventListener("cancel",this.#L),e.removeEventListener("close",this.#S),e.removeEventListener("click",this.#A),e.removeEventListener("keydown",this.#x),e.removeEventListener("pointerdown",this.#w),e.open))try{e.close()}catch{e.removeAttribute("open")}super.onControllerCleanup()}}const ce=w(()=>z,()=>x),K=["children","confirmLabel","dismissLabel","icon","supportingText","text","title"];function $(n,e){const t=l(),i=l();return<dialog{...A(n,e,{classes:{[v]:!0,[M]:e.showDismiss===!1,"cw-AlertDialog":!0,"cw-Dialog":!0,"cw-Dialog-open":C(e)},describedBy:i,label:e.title===void 0?"Alert dialog":void 0,labelledBy:e.label===void 0&&e.title!==void 0?t:void 0,role:"alertdialog"})}>
2
+ <div class="cw-AlertDialog-icon">{e.icon}</div>
3
+ <h2 class="cw-AlertDialog-title"id={t}>{e.title}</h2>
4
+ <div class="cw-AlertDialog-text"id={i}>
5
+ {e.text??e.supportingText??n.children}
6
+ </div>
7
+ <div class="cw-AlertDialog-actions">
8
+ <D attr:data-cw-dialog-action="dismiss"class="cw-AlertDialog-dismiss"size="sm"variant="text">{e.dismissLabel??"Cancel"}</D>
9
+ <D attr:data-cw-dialog-action="confirm"class="cw-AlertDialog-confirm"size="sm"variant="text">{e.confirmLabel??"OK"}</D>
10
+ </div>
11
+ </dialog>}class V extends x{#r;#n;#o;#t;constructor(e){super(e),this.#o=l(),this.#t=l();const t=super.consumeProps([],["onConfirm","onDismiss"]);this.#r=t.onConfirm,this.#n=t.onDismiss}defaultRole(){return"alertdialog"}defaultLabel(){return this.props.label??(this.props.title===void 0?"Alert dialog":void 0)}defaultLabelledBy(){return this.props.label===void 0&&this.props.title!==void 0?this.#o:void 0}defaultDescribedBy(){return this.#t}#s=e=>{const t=I(this.styleElement,e);t==="confirm"?(this.#r?.(e),e.defaultPrevented||this.close("confirm",e)):t==="dismiss"&&(this.#n?.(e),e.defaultPrevented||this.close("dismiss",e))};applyComponentProps(){const e=super.readProps(["showDismiss"]);super.applyComponentProps(),e.showDismissChanged&&super.setClass(M,e.showDismiss===!1)}onStyleElementChanged(e){this.styleElement?.removeEventListener("click",this.#s),super.onStyleElementChanged(e),e?.addEventListener("click",this.#s)}render(e){const t=this.props,i=this.#o,s=this.#t;return<dialog class={`cw-Dialog cw-AlertDialog ${v}`}>
12
+ <div class="cw-AlertDialog-icon">{t.icon}</div>
13
+ <h2 class="cw-AlertDialog-title"id={i}>{t.title}</h2>
14
+ <div class="cw-AlertDialog-text"id={s}>
15
+ {t.text??t.supportingText??e}
16
+ </div>
17
+ <div class="cw-AlertDialog-actions">
18
+ <D attr:data-cw-dialog-action="dismiss"class="cw-AlertDialog-dismiss"size="sm"variant="text">{t.dismissLabel??"Cancel"}</D>
19
+ <D attr:data-cw-dialog-action="confirm"class="cw-AlertDialog-confirm"size="sm"variant="text">{t.confirmLabel??"OK"}</D>
20
+ </div>
21
+ </dialog>}onControllerCleanup(){this.styleElement?.removeEventListener("click",this.#s),super.onControllerCleanup()}}const U=w(()=>$,()=>V),ue=n=>U(O(n,K)),j=["children","closeIcon","confirmLabel","title"];function G(n,e){const t=l();return<dialog{...A(n,e,{classes:{[T]:e.confirmLabel===void 0,"cw-FullScreenDialog":!0,"cw-FullScreenDialog-open":C(e)},label:e.title===void 0?"Dialog":void 0,labelledBy:e.label===void 0&&e.title!==void 0?t:void 0,role:"dialog"})}>
22
+ <div class={`cw-FullScreenDialog-header ${v}`}>
23
+ <P attr:aria-label={e.closeLabel??"Close"}attr:data-cw-dialog-action="dismiss"class="cw-FullScreenDialog-close"size="sm">{e.closeIcon??"close"}</P>
24
+ <h2 class="cw-FullScreenDialog-title"id={t}>{e.title}</h2>
25
+ <D attr:data-cw-dialog-action="confirm"class="cw-FullScreenDialog-confirm"size="sm"variant="text">{e.confirmLabel}</D>
26
+ </div>
27
+ <div class="cw-FullScreenDialog-content">{n.children}</div>
28
+ </dialog>}class Y extends x{#r;#n;#o;#t;#s;constructor(e){super(e,"cw-FullScreenDialog"),this.#o=l(),this.#t=null,this.#s=!1;const t=super.consumeProps([],["onConfirm","onDismiss"]);this.#r=t.onConfirm,this.#n=t.onDismiss}defaultLabel(){return this.props.label??(this.props.title===void 0?"Dialog":void 0)}defaultLabelledBy(){return this.props.label===void 0&&this.props.title!==void 0?this.#o:void 0}#c=e=>{const t=I(this.styleElement,e);t==="confirm"?(this.#r?.(e),e.defaultPrevented||this.close("confirm",e)):t==="dismiss"&&(this.#n?.(e),e.defaultPrevented||this.close("dismiss",e))};#e=()=>{const e=(this.#t?.scrollTop??0)>0;e!==this.#s&&(this.#s=e,super.setClass(q,e))};applyComponentProps(){const e=super.readProps(["confirmLabel"]);super.applyComponentProps(),e.confirmLabelChanged&&super.setClass(T,e.confirmLabel===void 0)}onStyleElementChanged(e){this.styleElement?.removeEventListener("click",this.#c),this.#t?.removeEventListener("scroll",this.#e),super.onStyleElementChanged(e),this.#t=e?.querySelector(".cw-FullScreenDialog-content")??null,e?.addEventListener("click",this.#c),this.#t?.addEventListener("scroll",this.#e,{passive:!0})}render(e){const t=this.props,i=this.#o;return<dialog class="cw-FullScreenDialog">
29
+ <div class={`cw-FullScreenDialog-header ${v}`}>
30
+ <P attr:aria-label={t.closeLabel??"Close"}attr:data-cw-dialog-action="dismiss"class="cw-FullScreenDialog-close"size="sm">{t.closeIcon??"close"}</P>
31
+ <h2 class="cw-FullScreenDialog-title"id={i}>{t.title}</h2>
32
+ <D attr:data-cw-dialog-action="confirm"class="cw-FullScreenDialog-confirm"size="sm"variant="text">{t.confirmLabel}</D>
33
+ </div>
34
+ <div class="cw-FullScreenDialog-content">{e}</div>
35
+ </dialog>}onControllerCleanup(){this.styleElement?.removeEventListener("click",this.#c),this.#t?.removeEventListener("scroll",this.#e),super.onControllerCleanup()}}const Q=w(()=>G,()=>Y),fe=n=>Q(O(n,j));export{ue as AlertDialog,V as AlertDialogController,ce as Dialog,x as DialogController,fe as FullScreenDialog,Y as FullScreenDialogController,I as actionOf,E as activeElementOf,A as dialogAttributesOf,C as isInitiallyOpen};
@@ -0,0 +1 @@
1
+ import{insert as s}from"solid-js/web";import{defineDomComponent as a}from"..";import{DomController as d}from"../dom/client";import"./surface.css";function r(i,e){return i===!0?"vertical":e??"horizontal"}function o(i){return typeof i!="number"?i:Number.isFinite(i)?`${Math.max(0,i)}px`:void 0}function c(i,e){const t=r(e.vertical,e.orientation),n=e.semantic!==!1;return<div aria-orientation={n&&t==="vertical"?"vertical":void 0}{...i}classList={{...i.classList,[`_cw-Divider-${t}`]:!0,[`_cw-Divider-inset-${e.inset??"none"}`]:!0,"cw-Divider":!0}}role={n?"separator":void 0}style={{...i.style,"--_cw-Divider-thickness":o(e.thickness)}}/>}class m extends d{#e;constructor(e){super(e,{styleElementIsFunction:!0}),this.#e="attr:aria-orientation"in e}applyComponentProps(){const e=super.readProps(["inset","orientation","semantic","thickness","vertical"]),t=r(e.vertical,e.orientation),n=e.semantic!==!1;(e.orientationChanged||e.verticalChanged)&&super.setClass("orientation",`_cw-Divider-${t}`),e.insetChanged&&super.setClass("inset",`_cw-Divider-inset-${e.inset??"none"}`),e.semanticChanged&&super.setAttribute("role",n?"separator":void 0),!this.#e&&(e.semanticChanged||e.orientationChanged||e.verticalChanged)&&super.setAttribute("aria-orientation",n&&t==="vertical"?"vertical":void 0),e.thicknessChanged&&super.setStyle("--_cw-Divider-thickness",o(e.thickness))}render(e){const t=<div class="cw-Divider"/>;return s(t,e),t}}const f=a(()=>c,()=>m);export{f as Divider,m as DividerController};