@panphora/bevel 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (539) hide show
  1. package/LICENSE +16 -0
  2. package/README.md +226 -0
  3. package/bevel-fonts.css +16 -0
  4. package/bevel.css +3075 -0
  5. package/bevel.js +2126 -0
  6. package/dist/react/components/activity-feed.d.ts +89 -0
  7. package/dist/react/components/activity-feed.js +54 -0
  8. package/dist/react/components/alert-dialog.d.ts +14 -0
  9. package/dist/react/components/alert-dialog.js +19 -0
  10. package/dist/react/components/app-shell.d.ts +98 -0
  11. package/dist/react/components/app-shell.js +86 -0
  12. package/dist/react/components/app-toolbar.d.ts +19 -0
  13. package/dist/react/components/app-toolbar.js +22 -0
  14. package/dist/react/components/avatar-group.d.ts +67 -0
  15. package/dist/react/components/avatar-group.js +49 -0
  16. package/dist/react/components/badge-and-pill.d.ts +34 -0
  17. package/dist/react/components/badge-and-pill.js +12 -0
  18. package/dist/react/components/breadcrumbs.d.ts +56 -0
  19. package/dist/react/components/breadcrumbs.js +44 -0
  20. package/dist/react/components/bulk-bar.d.ts +22 -0
  21. package/dist/react/components/bulk-bar.js +59 -0
  22. package/dist/react/components/button.d.ts +15 -0
  23. package/dist/react/components/button.js +20 -0
  24. package/dist/react/components/callout-and-hint.d.ts +17 -0
  25. package/dist/react/components/callout-and-hint.js +8 -0
  26. package/dist/react/components/checkbox.d.ts +5 -0
  27. package/dist/react/components/checkbox.js +13 -0
  28. package/dist/react/components/chip.d.ts +149 -0
  29. package/dist/react/components/chip.js +29 -0
  30. package/dist/react/components/code-block.d.ts +50 -0
  31. package/dist/react/components/code-block.js +77 -0
  32. package/dist/react/components/code-editor.d.ts +122 -0
  33. package/dist/react/components/code-editor.js +695 -0
  34. package/dist/react/components/column-manager.d.ts +28 -0
  35. package/dist/react/components/column-manager.js +85 -0
  36. package/dist/react/components/combobox.d.ts +32 -0
  37. package/dist/react/components/combobox.js +37 -0
  38. package/dist/react/components/data-grid.d.ts +108 -0
  39. package/dist/react/components/data-grid.js +159 -0
  40. package/dist/react/components/data-table.d.ts +2 -0
  41. package/dist/react/components/data-table.js +6 -0
  42. package/dist/react/components/date.d.ts +23 -0
  43. package/dist/react/components/date.js +11 -0
  44. package/dist/react/components/details.d.ts +13 -0
  45. package/dist/react/components/details.js +20 -0
  46. package/dist/react/components/dialog.d.ts +74 -0
  47. package/dist/react/components/dialog.js +31 -0
  48. package/dist/react/components/diff-view.d.ts +73 -0
  49. package/dist/react/components/diff-view.js +68 -0
  50. package/dist/react/components/documents.d.ts +70 -0
  51. package/dist/react/components/documents.js +10 -0
  52. package/dist/react/components/drawer.d.ts +45 -0
  53. package/dist/react/components/drawer.js +35 -0
  54. package/dist/react/components/editable-grid-cells.d.ts +32 -0
  55. package/dist/react/components/editable-grid-cells.js +116 -0
  56. package/dist/react/components/eyebrow-kicker-lede-pull-quote.d.ts +39 -0
  57. package/dist/react/components/eyebrow-kicker-lede-pull-quote.js +12 -0
  58. package/dist/react/components/field.d.ts +32 -0
  59. package/dist/react/components/field.js +27 -0
  60. package/dist/react/components/file-tree.d.ts +75 -0
  61. package/dist/react/components/file-tree.js +247 -0
  62. package/dist/react/components/file.d.ts +43 -0
  63. package/dist/react/components/file.js +73 -0
  64. package/dist/react/components/files-table.d.ts +174 -0
  65. package/dist/react/components/files-table.js +237 -0
  66. package/dist/react/components/filter-builder.d.ts +37 -0
  67. package/dist/react/components/filter-builder.js +109 -0
  68. package/dist/react/components/form-error-summary.d.ts +16 -0
  69. package/dist/react/components/form-error-summary.js +49 -0
  70. package/dist/react/components/icon-button.d.ts +8 -0
  71. package/dist/react/components/icon-button.js +14 -0
  72. package/dist/react/components/icon.d.ts +7 -0
  73. package/dist/react/components/icon.js +15 -0
  74. package/dist/react/components/image.d.ts +72 -0
  75. package/dist/react/components/image.js +24 -0
  76. package/dist/react/components/inline-edit.d.ts +70 -0
  77. package/dist/react/components/inline-edit.js +149 -0
  78. package/dist/react/components/input.d.ts +29 -0
  79. package/dist/react/components/input.js +20 -0
  80. package/dist/react/components/kanban-board.d.ts +140 -0
  81. package/dist/react/components/kanban-board.js +374 -0
  82. package/dist/react/components/layout.d.ts +51 -0
  83. package/dist/react/components/layout.js +28 -0
  84. package/dist/react/components/list.d.ts +28 -0
  85. package/dist/react/components/list.js +6 -0
  86. package/dist/react/components/masthead-and-verdict.d.ts +60 -0
  87. package/dist/react/components/masthead-and-verdict.js +8 -0
  88. package/dist/react/components/menu.d.ts +26 -0
  89. package/dist/react/components/menu.js +31 -0
  90. package/dist/react/components/multi-select-picker.d.ts +49 -0
  91. package/dist/react/components/multi-select-picker.js +20 -0
  92. package/dist/react/components/note.d.ts +33 -0
  93. package/dist/react/components/note.js +8 -0
  94. package/dist/react/components/number-field.d.ts +16 -0
  95. package/dist/react/components/number-field.js +17 -0
  96. package/dist/react/components/pagination.d.ts +45 -0
  97. package/dist/react/components/pagination.js +87 -0
  98. package/dist/react/components/persistent-action-banner.d.ts +71 -0
  99. package/dist/react/components/persistent-action-banner.js +39 -0
  100. package/dist/react/components/popconfirm.d.ts +42 -0
  101. package/dist/react/components/popconfirm.js +59 -0
  102. package/dist/react/components/popover.d.ts +16 -0
  103. package/dist/react/components/popover.js +21 -0
  104. package/dist/react/components/progress-and-gauge.d.ts +44 -0
  105. package/dist/react/components/progress-and-gauge.js +19 -0
  106. package/dist/react/components/radio.d.ts +7 -0
  107. package/dist/react/components/radio.js +13 -0
  108. package/dist/react/components/rich-text-toolbar.d.ts +26 -0
  109. package/dist/react/components/rich-text-toolbar.js +64 -0
  110. package/dist/react/components/rows-and-card.d.ts +88 -0
  111. package/dist/react/components/rows-and-card.js +10 -0
  112. package/dist/react/components/save-status-indicator.d.ts +11 -0
  113. package/dist/react/components/save-status-indicator.js +33 -0
  114. package/dist/react/components/segmented-control.d.ts +21 -0
  115. package/dist/react/components/segmented-control.js +15 -0
  116. package/dist/react/components/select.d.ts +29 -0
  117. package/dist/react/components/select.js +29 -0
  118. package/dist/react/components/selectable-cards.d.ts +30 -0
  119. package/dist/react/components/selectable-cards.js +29 -0
  120. package/dist/react/components/settings-rows.d.ts +51 -0
  121. package/dist/react/components/settings-rows.js +8 -0
  122. package/dist/react/components/sidebar-nav.d.ts +77 -0
  123. package/dist/react/components/sidebar-nav.js +41 -0
  124. package/dist/react/components/skeleton-and-empty.d.ts +51 -0
  125. package/dist/react/components/skeleton-and-empty.js +14 -0
  126. package/dist/react/components/slider.d.ts +19 -0
  127. package/dist/react/components/slider.js +17 -0
  128. package/dist/react/components/small-charts.d.ts +60 -0
  129. package/dist/react/components/small-charts.js +76 -0
  130. package/dist/react/components/sortable.d.ts +30 -0
  131. package/dist/react/components/sortable.js +85 -0
  132. package/dist/react/components/split-button.d.ts +38 -0
  133. package/dist/react/components/split-button.js +43 -0
  134. package/dist/react/components/split-panes.d.ts +35 -0
  135. package/dist/react/components/split-panes.js +102 -0
  136. package/dist/react/components/stat-tiles.d.ts +54 -0
  137. package/dist/react/components/stat-tiles.js +8 -0
  138. package/dist/react/components/steps.d.ts +11 -0
  139. package/dist/react/components/steps.js +13 -0
  140. package/dist/react/components/switch.d.ts +6 -0
  141. package/dist/react/components/switch.js +13 -0
  142. package/dist/react/components/table.d.ts +61 -0
  143. package/dist/react/components/table.js +6 -0
  144. package/dist/react/components/tabs.d.ts +7 -0
  145. package/dist/react/components/tabs.js +13 -0
  146. package/dist/react/components/tags.d.ts +33 -0
  147. package/dist/react/components/tags.js +83 -0
  148. package/dist/react/components/textarea.d.ts +10 -0
  149. package/dist/react/components/textarea.js +6 -0
  150. package/dist/react/components/toast.d.ts +35 -0
  151. package/dist/react/components/toast.js +90 -0
  152. package/dist/react/components/tooltip-and-key.d.ts +20 -0
  153. package/dist/react/components/tooltip-and-key.js +20 -0
  154. package/dist/react/components/tree-view.d.ts +34 -0
  155. package/dist/react/components/tree-view.js +118 -0
  156. package/dist/react/components/upload-dropzone.d.ts +92 -0
  157. package/dist/react/components/upload-dropzone.js +116 -0
  158. package/dist/react/components/wizard-shell.d.ts +78 -0
  159. package/dist/react/components/wizard-shell.js +176 -0
  160. package/dist/react/fonts.css.d.ts +1 -0
  161. package/dist/react/index.d.ts +76 -0
  162. package/dist/react/index.js +77 -0
  163. package/dist/react/integrations/quickcrop.d.ts +58 -0
  164. package/dist/react/integrations/quickcrop.js +137 -0
  165. package/dist/react/integrations/richclay.d.ts +43 -0
  166. package/dist/react/integrations/richclay.js +129 -0
  167. package/dist/react/internal/classes.d.ts +3 -0
  168. package/dist/react/internal/classes.js +10 -0
  169. package/dist/react/internal/close-mark.d.ts +1 -0
  170. package/dist/react/internal/close-mark.js +10 -0
  171. package/dist/react/internal/controllable-state.d.ts +9 -0
  172. package/dist/react/internal/controllable-state.js +22 -0
  173. package/dist/react/internal/drop-effect.d.ts +28 -0
  174. package/dist/react/internal/drop-effect.js +8 -0
  175. package/dist/react/internal/form-reset.d.ts +2 -0
  176. package/dist/react/internal/form-reset.js +22 -0
  177. package/dist/react/internal/format.d.ts +1 -0
  178. package/dist/react/internal/format.js +14 -0
  179. package/dist/react/internal/link.d.ts +2 -0
  180. package/dist/react/internal/link.js +8 -0
  181. package/dist/react/internal/part.d.ts +20 -0
  182. package/dist/react/internal/part.js +47 -0
  183. package/dist/react/internal/pointer-session.d.ts +8 -0
  184. package/dist/react/internal/pointer-session.js +60 -0
  185. package/dist/react/internal/refs.d.ts +2 -0
  186. package/dist/react/internal/refs.js +22 -0
  187. package/dist/react/internal/rich-text.d.ts +28 -0
  188. package/dist/react/internal/rich-text.js +4 -0
  189. package/dist/react/internal/table-context.d.ts +39 -0
  190. package/dist/react/internal/table-context.js +12 -0
  191. package/dist/react/internal/use-object-url.d.ts +1 -0
  192. package/dist/react/internal/use-object-url.js +15 -0
  193. package/dist/react/layout.css +274 -0
  194. package/dist/react/layout.css.d.ts +1 -0
  195. package/dist/react/models/filter.d.ts +31 -0
  196. package/dist/react/models/filter.js +79 -0
  197. package/dist/react/models/kanban.d.ts +51 -0
  198. package/dist/react/models/kanban.js +35 -0
  199. package/dist/react/models/reorder.d.ts +9 -0
  200. package/dist/react/models/reorder.js +23 -0
  201. package/dist/react/models/table.d.ts +85 -0
  202. package/dist/react/models/table.js +144 -0
  203. package/dist/react/models/tree.d.ts +16 -0
  204. package/dist/react/models/tree.js +26 -0
  205. package/dist/react/provider.d.ts +18 -0
  206. package/dist/react/provider.js +31 -0
  207. package/dist/react/recipes/context-hypercms.d.ts +17 -0
  208. package/dist/react/recipes/context-hypercms.js +71 -0
  209. package/dist/react/recipes/context-quickcrop.d.ts +8 -0
  210. package/dist/react/recipes/context-quickcrop.js +49 -0
  211. package/dist/react/theme.css +8004 -0
  212. package/dist/react/theme.css.d.ts +1 -0
  213. package/examples/README.md +34 -0
  214. package/examples/components/activity-feed.html +28 -0
  215. package/examples/components/app-shell.html +12 -0
  216. package/examples/components/app-toolbar.html +38 -0
  217. package/examples/components/avatar-group.html +27 -0
  218. package/examples/components/breadcrumbs.html +26 -0
  219. package/examples/components/bulk-bar.html +22 -0
  220. package/examples/components/code-block.html +12 -0
  221. package/examples/components/code-editor.html +25 -0
  222. package/examples/components/column-manager.html +9 -0
  223. package/examples/components/combobox.html +13 -0
  224. package/examples/components/context-hypercms.css +41 -0
  225. package/examples/components/context-hypercms.html +40 -0
  226. package/examples/components/context-hypercms.js +62 -0
  227. package/examples/components/context-quickcrop.html +137 -0
  228. package/examples/components/diff-view.html +9 -0
  229. package/examples/components/drawer.html +11 -0
  230. package/examples/components/editable-grid-cells.html +9 -0
  231. package/examples/components/file-browser.html +53 -0
  232. package/examples/components/file-tree.html +34 -0
  233. package/examples/components/files-table.html +80 -0
  234. package/examples/components/filter-builder.html +11 -0
  235. package/examples/components/form-error-summary.html +11 -0
  236. package/examples/components/index.html +51 -0
  237. package/examples/components/inline-edit.html +42 -0
  238. package/examples/components/kanban-board.html +42 -0
  239. package/examples/components/manifest.json +3279 -0
  240. package/examples/components/modal.html +11 -0
  241. package/examples/components/multi-select-picker.html +13 -0
  242. package/examples/components/pagination.html +32 -0
  243. package/examples/components/persistent-action-banner.html +23 -0
  244. package/examples/components/popconfirm.html +13 -0
  245. package/examples/components/popover-menu.html +13 -0
  246. package/examples/components/reference/baseline/DECISIONS.md +85 -0
  247. package/examples/components/reference/baseline/README.md +58 -0
  248. package/examples/components/reference/baseline/bevel-fonts.css +16 -0
  249. package/examples/components/reference/baseline/bevel.css +1339 -0
  250. package/examples/components/reference/baseline/bevel.js +496 -0
  251. package/examples/components/reference/baseline/fonts/LICENSE-ibm-plex-mono.txt +93 -0
  252. package/examples/components/reference/baseline/fonts/LICENSE-ibm-plex-sans.txt +93 -0
  253. package/examples/components/reference/baseline/fonts/LICENSE-newsreader.txt +93 -0
  254. package/examples/components/reference/baseline/fonts/ibm-plex-mono-latin-400-normal.woff2 +0 -0
  255. package/examples/components/reference/baseline/fonts/ibm-plex-mono-latin-500-normal.woff2 +0 -0
  256. package/examples/components/reference/baseline/fonts/ibm-plex-mono-latin-600-normal.woff2 +0 -0
  257. package/examples/components/reference/baseline/fonts/ibm-plex-sans-latin-400-italic.woff2 +0 -0
  258. package/examples/components/reference/baseline/fonts/ibm-plex-sans-latin-400-normal.woff2 +0 -0
  259. package/examples/components/reference/baseline/fonts/ibm-plex-sans-latin-500-normal.woff2 +0 -0
  260. package/examples/components/reference/baseline/fonts/ibm-plex-sans-latin-600-normal.woff2 +0 -0
  261. package/examples/components/reference/baseline/fonts/newsreader-latin-opsz-italic.woff2 +0 -0
  262. package/examples/components/reference/baseline/fonts/newsreader-latin-opsz-normal.woff2 +0 -0
  263. package/examples/components/reference/fable/IMPROVEMENTS.md +106 -0
  264. package/examples/components/reference/fable/PARENT-REPAIRS.md +17 -0
  265. package/examples/components/reference/fable/__pycache__/build_repairs.cpython-311.pyc +0 -0
  266. package/examples/components/reference/fable/__pycache__/kanban.cpython-311.pyc +0 -0
  267. package/examples/components/reference/fable/as-authored/IMPROVEMENTS-completed.md +106 -0
  268. package/examples/components/reference/fable/as-authored/base-astra.css +17 -0
  269. package/examples/components/reference/fable/as-authored/base-parent.css +416 -0
  270. package/examples/components/reference/fable/as-authored/build.py +858 -0
  271. package/examples/components/reference/fable/as-authored/fable.css +823 -0
  272. package/examples/components/reference/fable/as-authored/kanban-completed.css +235 -0
  273. package/examples/components/reference/fable/as-authored/kanban-completed.html +53 -0
  274. package/examples/components/reference/fable/as-authored/kanban-completed.py +212 -0
  275. package/examples/components/reference/fable/as-authored/kanban.py +207 -0
  276. package/examples/components/reference/fable/base-astra.css +17 -0
  277. package/examples/components/reference/fable/base-parent.css +416 -0
  278. package/examples/components/reference/fable/build.py +858 -0
  279. package/examples/components/reference/fable/build_repairs.py +25 -0
  280. package/examples/components/reference/fable/components/activity-feed.html +3 -0
  281. package/examples/components/reference/fable/components/app-toolbar.html +3 -0
  282. package/examples/components/reference/fable/components/avatar-group.html +4 -0
  283. package/examples/components/reference/fable/components/breadcrumbs.html +3 -0
  284. package/examples/components/reference/fable/components/code-block.html +9 -0
  285. package/examples/components/reference/fable/components/column-manager.html +3 -0
  286. package/examples/components/reference/fable/components/combobox.html +6 -0
  287. package/examples/components/reference/fable/components/context-hypercms.html +3 -0
  288. package/examples/components/reference/fable/components/context-quickcrop.html +4 -0
  289. package/examples/components/reference/fable/components/diff-view.html +13 -0
  290. package/examples/components/reference/fable/components/drawer.html +3 -0
  291. package/examples/components/reference/fable/components/editable-grid-cells.html +3 -0
  292. package/examples/components/reference/fable/components/filter-builder.html +3 -0
  293. package/examples/components/reference/fable/components/form-error-summary.html +4 -0
  294. package/examples/components/reference/fable/components/inline-edit.html +3 -0
  295. package/examples/components/reference/fable/components/kanban-board.html +53 -0
  296. package/examples/components/reference/fable/components/modal.html +3 -0
  297. package/examples/components/reference/fable/components/multi-select-picker.html +5 -0
  298. package/examples/components/reference/fable/components/pagination.html +3 -0
  299. package/examples/components/reference/fable/components/persistent-action-banner.html +4 -0
  300. package/examples/components/reference/fable/components/popconfirm.html +5 -0
  301. package/examples/components/reference/fable/components/popover-menu.html +3 -0
  302. package/examples/components/reference/fable/components/rich-text-toolbar.html +3 -0
  303. package/examples/components/reference/fable/components/save-status-indicator.html +2 -0
  304. package/examples/components/reference/fable/components/selectable-cards.html +3 -0
  305. package/examples/components/reference/fable/components/settings-rows.html +3 -0
  306. package/examples/components/reference/fable/components/sidebar-nav.html +4 -0
  307. package/examples/components/reference/fable/components/small-charts.html +5 -0
  308. package/examples/components/reference/fable/components/split-button.html +4 -0
  309. package/examples/components/reference/fable/components/split-panes.html +8 -0
  310. package/examples/components/reference/fable/components/stat-tiles.html +3 -0
  311. package/examples/components/reference/fable/components/toast-stack.html +5 -0
  312. package/examples/components/reference/fable/components/tree-view.html +4 -0
  313. package/examples/components/reference/fable/components/upload-dropzone.html +6 -0
  314. package/examples/components/reference/fable/components/wizard-shell.html +3 -0
  315. package/examples/components/reference/fable/coverage.json +414 -0
  316. package/examples/components/reference/fable/fable.css +823 -0
  317. package/examples/components/reference/fable/index.html +5 -0
  318. package/examples/components/reference/fable/kanban.css +237 -0
  319. package/examples/components/reference/fable/kanban.py +212 -0
  320. package/examples/components/reference/fable/parent-repairs.css +9 -0
  321. package/examples/components/reference/fixtures/data.json +102 -0
  322. package/examples/components/reference/fixtures/host.js +47 -0
  323. package/examples/components/reference/fixtures/static-host.js +39 -0
  324. package/examples/components/reference/fixtures/workspace.jpg +0 -0
  325. package/examples/components/reference/parent/CHANGES.md +179 -0
  326. package/examples/components/reference/parent/__pycache__/kanban.cpython-311.pyc +0 -0
  327. package/examples/components/reference/parent/base-astra.css +17 -0
  328. package/examples/components/reference/parent/base-parent.css +416 -0
  329. package/examples/components/reference/parent/build.py +148 -0
  330. package/examples/components/reference/parent/components/activity-feed.html +2 -0
  331. package/examples/components/reference/parent/components/app-toolbar.html +2 -0
  332. package/examples/components/reference/parent/components/avatar-group.html +4 -0
  333. package/examples/components/reference/parent/components/breadcrumbs.html +2 -0
  334. package/examples/components/reference/parent/components/code-block.html +8 -0
  335. package/examples/components/reference/parent/components/column-manager.html +2 -0
  336. package/examples/components/reference/parent/components/combobox.html +6 -0
  337. package/examples/components/reference/parent/components/context-hypercms.html +2 -0
  338. package/examples/components/reference/parent/components/context-quickcrop.html +4 -0
  339. package/examples/components/reference/parent/components/diff-view.html +4 -0
  340. package/examples/components/reference/parent/components/drawer.html +2 -0
  341. package/examples/components/reference/parent/components/editable-grid-cells.html +2 -0
  342. package/examples/components/reference/parent/components/filter-builder.html +2 -0
  343. package/examples/components/reference/parent/components/form-error-summary.html +2 -0
  344. package/examples/components/reference/parent/components/inline-edit.html +2 -0
  345. package/examples/components/reference/parent/components/kanban-board.html +84 -0
  346. package/examples/components/reference/parent/components/modal.html +2 -0
  347. package/examples/components/reference/parent/components/multi-select-picker.html +5 -0
  348. package/examples/components/reference/parent/components/pagination.html +2 -0
  349. package/examples/components/reference/parent/components/persistent-action-banner.html +4 -0
  350. package/examples/components/reference/parent/components/popconfirm.html +5 -0
  351. package/examples/components/reference/parent/components/popover-menu.html +2 -0
  352. package/examples/components/reference/parent/components/rich-text-toolbar.html +2 -0
  353. package/examples/components/reference/parent/components/save-status-indicator.html +2 -0
  354. package/examples/components/reference/parent/components/selectable-cards.html +2 -0
  355. package/examples/components/reference/parent/components/settings-rows.html +2 -0
  356. package/examples/components/reference/parent/components/sidebar-nav.html +4 -0
  357. package/examples/components/reference/parent/components/small-charts.html +2 -0
  358. package/examples/components/reference/parent/components/split-button.html +5 -0
  359. package/examples/components/reference/parent/components/split-panes.html +8 -0
  360. package/examples/components/reference/parent/components/stat-tiles.html +2 -0
  361. package/examples/components/reference/parent/components/toast-stack.html +5 -0
  362. package/examples/components/reference/parent/components/tree-view.html +4 -0
  363. package/examples/components/reference/parent/components/upload-dropzone.html +6 -0
  364. package/examples/components/reference/parent/components/wizard-shell.html +2 -0
  365. package/examples/components/reference/parent/coverage.json +414 -0
  366. package/examples/components/reference/parent/index.html +1 -0
  367. package/examples/components/reference/parent/kanban.css +114 -0
  368. package/examples/components/reference/parent/kanban.py +55 -0
  369. package/examples/components/reference/parent/refinement.css +53 -0
  370. package/examples/components/reference/selected/build.py +70 -0
  371. package/examples/components/reference/selected/components/activity-feed.html +3 -0
  372. package/examples/components/reference/selected/components/app-toolbar.html +3 -0
  373. package/examples/components/reference/selected/components/avatar-group.html +4 -0
  374. package/examples/components/reference/selected/components/breadcrumbs.html +3 -0
  375. package/examples/components/reference/selected/components/code-block.html +9 -0
  376. package/examples/components/reference/selected/components/column-manager.html +3 -0
  377. package/examples/components/reference/selected/components/combobox.html +6 -0
  378. package/examples/components/reference/selected/components/context-hypercms.html +3 -0
  379. package/examples/components/reference/selected/components/context-quickcrop.html +4 -0
  380. package/examples/components/reference/selected/components/diff-view.html +13 -0
  381. package/examples/components/reference/selected/components/drawer.html +3 -0
  382. package/examples/components/reference/selected/components/editable-grid-cells.html +3 -0
  383. package/examples/components/reference/selected/components/filter-builder.html +3 -0
  384. package/examples/components/reference/selected/components/form-error-summary.html +4 -0
  385. package/examples/components/reference/selected/components/inline-edit.html +3 -0
  386. package/examples/components/reference/selected/components/kanban-board.html +53 -0
  387. package/examples/components/reference/selected/components/modal.html +2 -0
  388. package/examples/components/reference/selected/components/multi-select-picker.html +5 -0
  389. package/examples/components/reference/selected/components/pagination.html +3 -0
  390. package/examples/components/reference/selected/components/persistent-action-banner.html +4 -0
  391. package/examples/components/reference/selected/components/popconfirm.html +5 -0
  392. package/examples/components/reference/selected/components/popover-menu.html +3 -0
  393. package/examples/components/reference/selected/components/rich-text-toolbar.html +3 -0
  394. package/examples/components/reference/selected/components/save-status-indicator.html +2 -0
  395. package/examples/components/reference/selected/components/selectable-cards.html +3 -0
  396. package/examples/components/reference/selected/components/settings-rows.html +3 -0
  397. package/examples/components/reference/selected/components/sidebar-nav.html +4 -0
  398. package/examples/components/reference/selected/components/small-charts.html +5 -0
  399. package/examples/components/reference/selected/components/split-button.html +4 -0
  400. package/examples/components/reference/selected/components/split-panes.html +8 -0
  401. package/examples/components/reference/selected/components/stat-tiles.html +3 -0
  402. package/examples/components/reference/selected/components/toast-stack.html +5 -0
  403. package/examples/components/reference/selected/components/tree-view.html +4 -0
  404. package/examples/components/reference/selected/components/upload-dropzone.html +6 -0
  405. package/examples/components/reference/selected/components/wizard-shell.html +3 -0
  406. package/examples/components/reference/selected/corrections.css +11 -0
  407. package/examples/components/reference/selected/coverage.json +413 -0
  408. package/examples/components/reference/selected/gallery-build.mjs +49 -0
  409. package/examples/components/reference/selected/gallery-spec.json +12 -0
  410. package/examples/components/reference/selected/index.html +1 -0
  411. package/examples/components/reference/selected/kanban-comparison.json +6 -0
  412. package/examples/components/reference/selected/manifest.json +476 -0
  413. package/examples/components/reference/sha256.json +142 -0
  414. package/examples/components/reference/sources/diagonal-close.svg +1 -0
  415. package/examples/components/reference/sources/hyperclay/public-assets/css/hyperclay-app-source.css +614 -0
  416. package/examples/components/reference/sources/hyperclay/public-assets/js/app.js +94 -0
  417. package/examples/components/reference/sources/hyperclayjs/src/ui/theModal.js +897 -0
  418. package/examples/components/reference/sources/hypercms/scripts/build-theme.js +203 -0
  419. package/examples/components/reference/sources/hypercms/src/anchor.js +24 -0
  420. package/examples/components/reference/sources/hypercms/src/apply-loop.js +167 -0
  421. package/examples/components/reference/sources/hypercms/src/diagnostics.js +44 -0
  422. package/examples/components/reference/sources/hypercms/src/enhance.js +173 -0
  423. package/examples/components/reference/sources/hypercms/src/events.js +955 -0
  424. package/examples/components/reference/sources/hypercms/src/form-builder.js +518 -0
  425. package/examples/components/reference/sources/hypercms/src/form-rules.js +208 -0
  426. package/examples/components/reference/sources/hypercms/src/hooks.js +100 -0
  427. package/examples/components/reference/sources/hypercms/src/hypercms-bundle.js +10 -0
  428. package/examples/components/reference/sources/hypercms/src/hypercms.js +347 -0
  429. package/examples/components/reference/sources/hypercms/src/morph.js +10 -0
  430. package/examples/components/reference/sources/hypercms/src/path.js +61 -0
  431. package/examples/components/reference/sources/hypercms/src/place.js +131 -0
  432. package/examples/components/reference/sources/hypercms/src/platform.js +131 -0
  433. package/examples/components/reference/sources/hypercms/src/refresh.js +87 -0
  434. package/examples/components/reference/sources/hypercms/src/richclay-bridge.js +140 -0
  435. package/examples/components/reference/sources/hypercms/src/row-identity.js +111 -0
  436. package/examples/components/reference/sources/hypercms/src/scaffold.js +10 -0
  437. package/examples/components/reference/sources/hypercms/src/session.js +303 -0
  438. package/examples/components/reference/sources/hypercms/src/shell.js +248 -0
  439. package/examples/components/reference/sources/hypercms/src/styles.css +298 -0
  440. package/examples/components/reference/sources/hypercms/src/targets.js +144 -0
  441. package/examples/components/reference/sources/hypercms/src/templates.js +656 -0
  442. package/examples/components/reference/sources/hypercms/src/theme/pixel-quiet.overrides.css +761 -0
  443. package/examples/components/reference/sources/hypercms/src/theme.generated.css +1772 -0
  444. package/examples/components/reference/sources/hypercms/src/toggle.js +666 -0
  445. package/examples/components/reference/sources/hypercms/src/unresolved.js +211 -0
  446. package/examples/components/reference/sources/hypercms/src/vendor/mirk.vendor.js +212 -0
  447. package/examples/components/reference/sources/hypercms/src/views/inline-layer.js +421 -0
  448. package/examples/components/reference/sources/hypercms/src/views/inline.js +1072 -0
  449. package/examples/components/reference/sources/hypercms/src/views/sidebar.js +97 -0
  450. package/examples/components/reference/sources/modal-reference.html +301 -0
  451. package/examples/components/reference/sources/quickcrop/quickcrop.css +124 -0
  452. package/examples/components/reference/sources/quickcrop/quickcrop.js +400 -0
  453. package/examples/components/reference/sources/richclay/richclay.css +416 -0
  454. package/examples/components/reference/sources/richclay/richclay.js +2962 -0
  455. package/examples/components/reference/sources/richclay/src/a11y.js +67 -0
  456. package/examples/components/reference/sources/richclay/src/browser-global.js +7 -0
  457. package/examples/components/reference/sources/richclay/src/buttons.js +254 -0
  458. package/examples/components/reference/sources/richclay/src/hyperclay.js +470 -0
  459. package/examples/components/reference/sources/richclay/src/normalize.js +380 -0
  460. package/examples/components/reference/sources/richclay/src/richclay.js +1356 -0
  461. package/examples/components/reference/sources/richclay/src/sanitize.js +189 -0
  462. package/examples/components/reference/sources/richclay/src/styles.js +23 -0
  463. package/examples/components/reference/sources/richclay/src/toolbar-float.js +175 -0
  464. package/examples/components/reference/sources/richclay/src/toolbar.js +394 -0
  465. package/examples/components/reference/sources/richclay/src/vendor-bundle.js +15 -0
  466. package/examples/components/reference/sources/richclay/vendor/DOMPURIFY-LICENSE +202 -0
  467. package/examples/components/reference/sources/richclay/vendor/DOMPURIFY-LICENSE-MPL +373 -0
  468. package/examples/components/reference/sources/richclay/vendor/SQUIRE-LICENSE +21 -0
  469. package/examples/components/reference/sources/richclay/vendor/purify.es.mjs +2249 -0
  470. package/examples/components/reference/sources/richclay/vendor/purify.min.js +3 -0
  471. package/examples/components/reference/sources/richclay/vendor/squire.js +22 -0
  472. package/examples/components/reference/sources/richclay/vendor/squire.mjs +22 -0
  473. package/examples/components/reference/sources/richclay/vendor/squire.provenance.json +19 -0
  474. package/examples/components/rich-text-toolbar.html +43 -0
  475. package/examples/components/save-status-indicator.html +11 -0
  476. package/examples/components/selectable-cards.html +9 -0
  477. package/examples/components/settings-rows.html +10 -0
  478. package/examples/components/sidebar-nav.html +9 -0
  479. package/examples/components/small-charts.html +21 -0
  480. package/examples/components/split-button.html +13 -0
  481. package/examples/components/split-panes-editor.html +6 -0
  482. package/examples/components/split-panes.html +9 -0
  483. package/examples/components/stat-tiles.html +23 -0
  484. package/examples/components/toast-stack.html +21 -0
  485. package/examples/components/tree-view.html +9 -0
  486. package/examples/components/upload-dropzone.html +88 -0
  487. package/examples/components/wizard-shell.html +50 -0
  488. package/examples/datastar/index.html +38 -0
  489. package/examples/datastar/server.mjs +31 -0
  490. package/examples/fixtures/field-guide.pdf +14 -0
  491. package/examples/fixtures/workspace.jpg +0 -0
  492. package/examples/setup-peers.mjs +35 -0
  493. package/fonts/LICENSE-ibm-plex-mono.txt +93 -0
  494. package/fonts/LICENSE-ibm-plex-sans.txt +93 -0
  495. package/fonts/LICENSE-newsreader.txt +93 -0
  496. package/fonts/ibm-plex-mono-latin-400-normal.woff2 +0 -0
  497. package/fonts/ibm-plex-mono-latin-500-normal.woff2 +0 -0
  498. package/fonts/ibm-plex-mono-latin-600-normal.woff2 +0 -0
  499. package/fonts/ibm-plex-sans-latin-400-italic.woff2 +0 -0
  500. package/fonts/ibm-plex-sans-latin-400-normal.woff2 +0 -0
  501. package/fonts/ibm-plex-sans-latin-500-normal.woff2 +0 -0
  502. package/fonts/ibm-plex-sans-latin-600-normal.woff2 +0 -0
  503. package/fonts/newsreader-latin-opsz-italic.woff2 +0 -0
  504. package/fonts/newsreader-latin-opsz-normal.woff2 +0 -0
  505. package/icons/LICENSE +21 -0
  506. package/icons/house.json +71 -0
  507. package/icons/icons.d.ts +17 -0
  508. package/icons/icons.js +648 -0
  509. package/icons/icons.svg +126 -0
  510. package/icons/marks/build-tray.source.mjs +45 -0
  511. package/icons/marks/hyperclay-local.svg +11 -0
  512. package/icons/phosphor.json +53 -0
  513. package/icons/round.json +8 -0
  514. package/integrations/datastar.js +202 -0
  515. package/integrations/quickcrop.css +26 -0
  516. package/integrations/quickcrop.js +56 -0
  517. package/integrations/richclay.css +100 -0
  518. package/integrations/richclay.js +131 -0
  519. package/package.json +630 -0
  520. package/react/README.md +244 -0
  521. package/src/README.md +83 -0
  522. package/vendor/datastar/datastar-1.0.3.js +10 -0
  523. package/vendor/datastar/provenance.json +6 -0
  524. package/vendor/floating-ui/LICENSE-core +20 -0
  525. package/vendor/floating-ui/LICENSE-dom +20 -0
  526. package/vendor/floating-ui/floating-ui.core.umd.min.js +1 -0
  527. package/vendor/floating-ui/floating-ui.dom.umd.min.js +1 -0
  528. package/vendor/floating-ui/provenance.json +17 -0
  529. package/vendor/richclay/LICENSE +16 -0
  530. package/vendor/richclay/THIRD-PARTY-NOTICES.md +45 -0
  531. package/vendor/richclay/provenance.json +17 -0
  532. package/vendor/richclay/richclay.css +404 -0
  533. package/vendor/richclay/richclay.js +2940 -0
  534. package/vendor/richclay/vendor/DOMPURIFY-LICENSE +202 -0
  535. package/vendor/richclay/vendor/DOMPURIFY-LICENSE-MPL +373 -0
  536. package/vendor/richclay/vendor/SQUIRE-LICENSE +21 -0
  537. package/vendor/richclay/vendor/purify.min.js +3 -0
  538. package/vendor/richclay/vendor/squire.js +22 -0
  539. package/vendor/richclay/vendor/squire.provenance.json +30 -0
package/examples/components/small-charts.html ADDED
@@ -0,0 +1,21 @@
1
+ <!doctype html>
2
+ <html data-theme="light" lang="en">
3
+ <head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="stylesheet" href="../../bevel-fonts.css"><link rel="stylesheet" href="../../bevel.css"><title>Small charts · Bevel</title></head>
4
+ <body>
5
+ <main class="bevel-display-example">
6
+ <section class="bevel-chart" data-chart-state="bars" aria-labelledby="bars-title"><header class="bevel-chart__header"><div><span class="bevel-eyebrow">Document views</span><h2 id="bars-title">The week in view.</h2></div><span class="bevel-badge">Sep 01–07</span></header>
7
+ <svg class="bevel-chart__plot" role="img" aria-labelledby="bars-svg-title bars-svg-desc" viewBox="0 0 640 280"><title id="bars-svg-title">Weekly document views bar chart</title><desc id="bars-svg-desc">Monday 12, Tuesday 18, Wednesday 14, Thursday 28, Friday 24, Saturday 35, Sunday 31.</desc><g class="bevel-chart__grid"><line x1="40" x2="625" y1="230" y2="230"/><line x1="40" x2="625" y1="180" y2="180"/><line x1="40" x2="625" y1="130" y2="130"/><line x1="40" x2="625" y1="80" y2="80"/><line x1="40" x2="625" y1="30" y2="30"/></g><g><text x="8" y="234">0</text><text x="8" y="184">10</text><text x="8" y="134">20</text><text x="8" y="84">30</text><text x="8" y="34">40</text></g><g data-bevel-series-key="views"><rect class="bevel-chart__data" height="60" opacity=".6" width="42" x="57" y="170"/><text text-anchor="middle" x="78" y="160">12</text><rect class="bevel-chart__data" height="90" opacity=".6" width="42" x="138" y="140"/><text text-anchor="middle" x="159" y="130">18</text><rect class="bevel-chart__data" height="70" opacity=".6" width="42" x="219" y="160"/><text text-anchor="middle" x="240" y="150">14</text><rect class="bevel-chart__data" height="140" opacity=".6" width="42" x="300" y="90"/><text text-anchor="middle" x="321" y="80">28</text><rect class="bevel-chart__data" height="120" opacity=".6" width="42" x="381" y="110"/><text text-anchor="middle" x="402" y="100">24</text><rect class="bevel-chart__data" height="175" width="42" x="462" y="55"/><text text-anchor="middle" x="483" y="45">35</text><rect class="bevel-chart__data" height="155" opacity=".6" width="42" x="543" y="75"/><text text-anchor="middle" x="564" y="65">31</text></g><g><text text-anchor="middle" x="78" y="258">Mon</text><text text-anchor="middle" x="159" y="258">Tue</text><text text-anchor="middle" x="240" y="258">Wed</text><text text-anchor="middle" x="321" y="258">Thu</text><text text-anchor="middle" x="402" y="258">Fri</text><text text-anchor="middle" x="483" y="258">Sat</text><text text-anchor="middle" x="564" y="258">Sun</text></g></svg>
8
+ <div class="bevel-chart__legend"><button class="bevel-chart__series" data-bevel-series="views" type="button" aria-pressed="true"><i class="bevel-chart__swatch" aria-hidden="true"></i>Views across all documents</button><span class="bevel-chart__total">162 TOTAL</span></div><table class="bevel-chart__table"><caption>Weekly document views</caption><thead><tr><th>Day</th><th>Views</th></tr></thead><tbody><tr><th>Monday</th><td>12</td></tr><tr><th>Tuesday</th><td>18</td></tr><tr><th>Wednesday</th><td>14</td></tr><tr><th>Thursday</th><td>28</td></tr><tr><th>Friday</th><td>24</td></tr><tr><th>Saturday</th><td>35</td></tr><tr><th>Sunday</th><td>31</td></tr></tbody></table></section>
9
+
10
+ <section class="bevel-chart" data-chart-state="line" hidden aria-labelledby="line-title"><header class="bevel-chart__header"><div><span class="bevel-eyebrow">Document views</span><h2 id="line-title">The week in view.</h2></div><span class="bevel-badge">Sep 01–07</span></header>
11
+ <svg class="bevel-chart__plot" role="img" aria-labelledby="line-svg-title line-svg-desc" viewBox="0 0 640 280"><title id="line-svg-title">Weekly document views line chart</title><desc id="line-svg-desc">Monday 12, Tuesday 18, Wednesday 14, Thursday 28, Friday 24, Saturday 35, Sunday 31.</desc><g class="bevel-chart__grid"><line x1="40" x2="625" y1="230" y2="230"/><line x1="40" x2="625" y1="180" y2="180"/><line x1="40" x2="625" y1="130" y2="130"/><line x1="40" x2="625" y1="80" y2="80"/><line x1="40" x2="625" y1="30" y2="30"/></g><g><text x="8" y="234">0</text><text x="8" y="184">10</text><text x="8" y="134">20</text><text x="8" y="84">30</text><text x="8" y="34">40</text></g><g data-bevel-series-key="views"><polyline class="bevel-chart__line" points="78,170 159,140 240,160 321,90 402,110 483,55 564,75"/><circle cx="78" cy="170" fill="var(--bevel-surface)" r="4" stroke="var(--bevel-brass)" stroke-width="2"/><circle cx="159" cy="140" fill="var(--bevel-surface)" r="4" stroke="var(--bevel-brass)" stroke-width="2"/><circle cx="240" cy="160" fill="var(--bevel-surface)" r="4" stroke="var(--bevel-brass)" stroke-width="2"/><circle cx="321" cy="90" fill="var(--bevel-surface)" r="4" stroke="var(--bevel-brass)" stroke-width="2"/><circle cx="402" cy="110" fill="var(--bevel-surface)" r="4" stroke="var(--bevel-brass)" stroke-width="2"/><circle cx="483" cy="55" fill="var(--bevel-surface)" r="4" stroke="var(--bevel-brass)" stroke-width="2"/><circle cx="564" cy="75" fill="var(--bevel-surface)" r="4" stroke="var(--bevel-brass)" stroke-width="2"/></g><g><text text-anchor="middle" x="78" y="258">Mon</text><text text-anchor="middle" x="159" y="258">Tue</text><text text-anchor="middle" x="240" y="258">Wed</text><text text-anchor="middle" x="321" y="258">Thu</text><text text-anchor="middle" x="402" y="258">Fri</text><text text-anchor="middle" x="483" y="258">Sat</text><text text-anchor="middle" x="564" y="258">Sun</text></g></svg>
12
+ <div class="bevel-chart__legend"><button class="bevel-chart__series" data-bevel-series="views" type="button" aria-pressed="true"><i class="bevel-chart__swatch" aria-hidden="true"></i>Views across all documents</button><span class="bevel-chart__total">162 TOTAL</span></div><p class="bevel-chart__table">Monday 12, Tuesday 18, Wednesday 14, Thursday 28, Friday 24, Saturday 35, Sunday 31.</p></section>
13
+
14
+ <section class="bevel-chart" data-chart-state="spark" hidden aria-labelledby="spark-title"><h2 class="bevel-sr-only" id="spark-title">Weekly document views sparkline</h2><div class="bevel-chart__spark"><div class="bevel-chart__spark-value"><strong>162</strong><span class="bevel-stats__delta" data-bevel-direction="up"><svg aria-hidden="true" height="12" width="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="square" stroke-linejoin="miter"><path d="M12 20V4m-6 6 6-6 6 6"/></svg><span class="bevel-sr-only">Increased by </span>18% this week</span></div><div class="bevel-chart__spark-body"><svg class="bevel-chart__plot" role="img" preserveAspectRatio="none" aria-labelledby="spark-svg-title spark-svg-desc" viewBox="0 0 160 42"><title id="spark-svg-title">Views by day</title><desc id="spark-svg-desc">Views rose through the week and peaked on Saturday.</desc><g data-bevel-series-key="views"><polyline class="bevel-chart__line" points="0,36 26,29 53,33 80,16 106,20 133,5 160,10"/><circle cx="133" cy="5" fill="currentColor" r="3"/></g><line class="bevel-chart__grid" x1="0" x2="160" y1="41" y2="41"/></svg><div class="bevel-chart__days" aria-hidden="true"><span><b>12</b>Mon</span><span><b>18</b>Tue</span><span><b>14</b>Wed</span><span><b>28</b>Thu</span><span><b>24</b>Fri</span><span data-bevel-peak><b>35</b>Sat</span><span><b>31</b>Sun</span></div></div></div><div class="bevel-chart__legend"><button class="bevel-chart__series" data-bevel-series="views" type="button" aria-pressed="true"><i class="bevel-chart__swatch" aria-hidden="true"></i>Views across all documents</button><span class="bevel-chart__total">162 TOTAL</span></div><p class="bevel-chart__table">Monday 12, Tuesday 18, Wednesday 14, Thursday 28, Friday 24, Saturday 35, Sunday 31.</p></section>
15
+ </main>
16
+ <script src="../../bevel.js"></script>
17
+ <script>((host, { standalone = true, assetRoot = "../../", ready } = {}) => {
18
+ const wanted=new URLSearchParams(location.search).get("state")||"bars";for(const section of host.querySelectorAll("[data-chart-state]"))section.hidden=section.dataset.chartState!==wanted;
19
+ })(document.body, {standalone:true,assetRoot:"../../",ready:callback => { if (document.readyState === "loading") document.addEventListener("DOMContentLoaded", callback, {once:true}); else callback(); }});</script>
20
+ </body>
21
+ </html>
package/examples/components/split-button.html ADDED
@@ -0,0 +1,13 @@
1
+ <!doctype html>
2
+ <html data-theme="light" lang="en">
3
+ <head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="stylesheet" href="../../bevel-fonts.css"><link rel="stylesheet" href="../../bevel.css"><title>Split button · Bevel</title></head>
4
+ <body>
5
+ <main class="bevel-anchor-example"><header class="bevel-anchor-example__header"><div class="bevel-overlay__eyebrow">Actions / 12</div><h1>One action, a few ways</h1><p>Keep the usual action easy to reach.</p></header><section class="bevel-document-panel"><p class="bevel-document-panel__label">Selected divider: slight inset bevel</p><div class="bevel-document-panel__row"><div><h2>Field notes</h2><p class="bevel-document-panel__description">A working guide for Northstar Studio</p></div><div class="bevel-split-button" id="export-split"><button class="bevel-button" type="button" data-bevel-split-default="export-pdf" data-bevel-key="pdf"><span class="bevel-button__label"><svg aria-hidden="true" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="square" stroke-linejoin="miter"><path d="M5 3h9l5 5v13H5ZM14 3v6h5"/></svg><span class="bevel-button__label-text">Export PDF</span></span></button><button class="bevel-split-button__caret" type="button" aria-label="Other export formats" aria-controls="export-menu" aria-expanded="false" data-bevel-open="export-menu"><svg aria-hidden="true" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="square" stroke-linejoin="miter"><path d="m5 9 7 7 7-7"/></svg></button><div id="export-menu" class="bevel-menu" popover="manual" role="menu" aria-label="Export formats"><div class="bevel-menu__title">Export document</div><button type="button" role="menuitem" data-bevel-action="export-pdf" data-bevel-key="pdf">PDF document</button><button type="button" role="menuitem" data-bevel-action="export-html" data-bevel-key="html" data-bevel-update-default data-bevel-default-label="Export HTML">HTML file</button><button type="button" role="menuitem" data-bevel-action="export-markdown" data-bevel-key="markdown">Markdown</button></div></div></div><p class="bevel-document-panel__note">12 pages · last saved at 10:42</p></section><div class="bevel-split-button" id="disabled-split" hidden><button disabled>Export PDF</button><button disabled aria-label="Other export formats">⌄</button></div><output id="actions" aria-live="polite"></output></main>
6
+ <script src="../../vendor/floating-ui/floating-ui.core.umd.min.js"></script>
7
+ <script src="../../vendor/floating-ui/floating-ui.dom.umd.min.js"></script>
8
+ <script src="../../bevel.js"></script>
9
+ <script>((host, { standalone = true, assetRoot = "../../", ready } = {}) => {
10
+ host.addEventListener('bevel:action',e=>{host.querySelector('#actions').textContent+=(e.detail.action+':'+e.detail.key+';')})
11
+ })(document.body, {standalone:true,assetRoot:"../../",ready:callback => { if (document.readyState === "loading") document.addEventListener("DOMContentLoaded", callback, {once:true}); else callback(); }});</script>
12
+ </body>
13
+ </html>
package/examples/components/split-panes-editor.html ADDED
@@ -0,0 +1,6 @@
1
+ <!doctype html>
2
+ <html lang="en" class="light"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Split panes · Bevel</title><link rel="stylesheet" href="../../bevel-fonts.css"><link rel="stylesheet" href="../../bevel.css"></head><body><main class="bevel-example bevel-reference-example"><header class="bevel-example__header" data-part="heading"><div><div class="bevel-eyebrow">Workspace / 31</div><h1>Give each side enough room</h1><p>A clear divider between the list and the detail.</p></div></header><div class="bevel-split" data-bevel-split="46" data-bevel-label="Source"><section class="bevel-split__pane"><div class="bevel-split__eyebrow">Source</div><pre><span class="bevel-code__tag">&lt;article&gt;</span>
3
+ <span class="bevel-code__tag">&lt;h1&gt;</span>Field notes<span class="bevel-code__tag">&lt;/h1&gt;</span>
4
+ <span class="bevel-code__tag">&lt;p&gt;</span>Keep the useful
5
+ things close.<span class="bevel-code__tag">&lt;/p&gt;</span>
6
+ <span class="bevel-code__tag">&lt;/article&gt;</span></pre></section><div class="bevel-split__divider" role="separator" tabindex="0" aria-label="Resize panes"><svg aria-hidden="true" height="14" width="14" viewBox="0 0 256 256" fill="currentColor"><path d="M104,60A12,12,0,1,1,92,48,12,12,0,0,1,104,60Zm60,12a12,12,0,1,0-12-12A12,12,0,0,0,164,72ZM92,116a12,12,0,1,0,12,12A12,12,0,0,0,92,116Zm72,0a12,12,0,1,0,12,12A12,12,0,0,0,164,116ZM92,184a12,12,0,1,0,12,12A12,12,0,0,0,92,184Zm72,0a12,12,0,1,0,12,12A12,12,0,0,0,164,184Z"/></svg></div><section class="bevel-split__pane bevel-split__pane--detail"><div class="bevel-split__eyebrow">Preview</div><h2>Field notes</h2><p>Keep the useful things close. Field notes brings the documents, decisions and small details of a project into one place.</p><div class="bevel-split__byline"><span aria-hidden="true" class="bevel-split__avatar" data-who="MC">MC</span><span class="bevel-split__time">Edited today at 10:42</span></div></section></div><p class="bevel-split__caption"><svg aria-hidden="true" height="12" width="12" viewBox="0 0 256 256" fill="currentColor"><path d="M104,60A12,12,0,1,1,92,48,12,12,0,0,1,104,60Zm60,12a12,12,0,1,0-12-12A12,12,0,0,0,164,72ZM92,116a12,12,0,1,0,12,12A12,12,0,0,0,92,116Zm72,0a12,12,0,1,0,12,12A12,12,0,0,0,164,116ZM92,184a12,12,0,1,0,12,12A12,12,0,0,0,92,184Zm72,0a12,12,0,1,0,12,12A12,12,0,0,0,164,184Z"/></svg><output>Source 46% · minimum 25% · drag the divider</output></p></main><script src="../../bevel.js"></script></body></html>
package/examples/components/split-panes.html ADDED
@@ -0,0 +1,9 @@
1
+ <!doctype html>
2
+ <html lang="en" class="light">
3
+ <head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Split panes · Bevel</title><link rel="stylesheet" href="../../bevel-fonts.css"><link rel="stylesheet" href="../../bevel.css"></head>
4
+ <body>
5
+ <main class="bevel-example bevel-reference-example"><header class="bevel-example__header" data-part="heading"><div><div class="bevel-eyebrow">Workspace / 31</div><h1>Give each side enough room</h1><p>A clear divider between the list and the detail.</p></div></header><div class="bevel-split" data-bevel-split="32" data-bevel-label="List"><section class="bevel-split__pane"><div class="bevel-split__eyebrow">Documents</div><div class="bevel-split__item" aria-current="page"><svg aria-hidden="true" height="15" width="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="square" stroke-linejoin="miter"><path d="M5 3h9l5 5v13H5ZM14 3v6h5"/></svg> Field notes</div><div class="bevel-split__item"><svg aria-hidden="true" height="15" width="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="square" stroke-linejoin="miter"><path d="M5 3h9l5 5v13H5ZM14 3v6h5"/></svg> Project brief</div><div class="bevel-split__item"><svg aria-hidden="true" height="15" width="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="square" stroke-linejoin="miter"><path d="M5 3h9l5 5v13H5ZM14 3v6h5"/></svg> Shared references</div></section><div class="bevel-split__divider" role="separator" tabindex="0" aria-label="Resize panes"><svg aria-hidden="true" height="14" width="14" viewBox="0 0 256 256" fill="currentColor"><path d="M104,60A12,12,0,1,1,92,48,12,12,0,0,1,104,60Zm60,12a12,12,0,1,0-12-12A12,12,0,0,0,164,72ZM92,116a12,12,0,1,0,12,12A12,12,0,0,0,92,116Zm72,0a12,12,0,1,0,12,12A12,12,0,0,0,164,116ZM92,184a12,12,0,1,0,12,12A12,12,0,0,0,92,184Zm72,0a12,12,0,1,0,12,12A12,12,0,0,0,164,184Z"/></svg></div><section class="bevel-split__pane bevel-split__pane--detail"><div class="bevel-split__eyebrow">Document</div><h2>Field notes</h2><p>Keep the useful things close. Field notes brings the documents, decisions and small details of a project into one place.</p><div class="bevel-split__byline"><span aria-hidden="true" class="bevel-split__avatar" data-who="MC">MC</span><span class="bevel-split__time">Edited today at 10:42</span></div></section></div><p class="bevel-split__caption"><svg aria-hidden="true" height="12" width="12" viewBox="0 0 256 256" fill="currentColor"><path d="M104,60A12,12,0,1,1,92,48,12,12,0,0,1,104,60Zm60,12a12,12,0,1,0-12-12A12,12,0,0,0,164,72ZM92,116a12,12,0,1,0,12,12A12,12,0,0,0,92,116Zm72,0a12,12,0,1,0,12,12A12,12,0,0,0,164,116ZM92,184a12,12,0,1,0,12,12A12,12,0,0,0,92,184Zm72,0a12,12,0,1,0,12,12A12,12,0,0,0,164,184Z"/></svg><output>List 32% · minimum 25% · drag the divider</output></p></main>
6
+ <script src="../../bevel.js"></script>
7
+
8
+ </body>
9
+ </html>
package/examples/components/stat-tiles.html ADDED
@@ -0,0 +1,23 @@
1
+ <!doctype html>
2
+ <html data-theme="light" lang="en">
3
+ <head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="stylesheet" href="../../bevel-fonts.css"><link rel="stylesheet" href="../../bevel.css"><title>Stat tiles · Bevel</title></head>
4
+ <body>
5
+ <main class="bevel-display-example"><header class="bevel-example__header"><div class="bevel-eyebrow">Northstar Studio / Field notes</div><h1>A week, at a glance.</h1><p>A little perspective on the work in motion.</p></header>
6
+ <section data-stat-state="default"><dl class="bevel-stats">
7
+ <div class="bevel-stats__tile"><dt class="bevel-stats__label">Weekly views</dt><dd class="bevel-stats__value">162</dd><dd class="bevel-stats__delta" data-bevel-direction="up"><svg aria-hidden="true" height="12" width="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="square" stroke-linejoin="miter"><path d="M12 20V4m-6 6 6-6 6 6"/></svg><span class="bevel-sr-only">Increased by </span>18% this week</dd><dd><svg aria-hidden="true" class="bevel-stats__spark" viewBox="0 0 160 42"><polyline fill="none" points="0,36 26,29 53,33 80,16 106,20 133,5 160,10" stroke="currentColor" stroke-width="2"/><circle cx="160" cy="10" fill="currentColor" r="3"/><line stroke="var(--bevel-line)" x1="0" x2="160" y1="41" y2="41"/></svg></dd></div>
8
+ <div class="bevel-stats__tile"><dt class="bevel-stats__label">Documents</dt><dd class="bevel-stats__value">12</dd><dd class="bevel-stats__delta" data-bevel-direction="up"><svg aria-hidden="true" height="12" width="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="square" stroke-linejoin="miter"><path d="M12 20V4m-6 6 6-6 6 6"/></svg><span class="bevel-sr-only">Increased by </span>3 this week</dd><dd><svg aria-hidden="true" class="bevel-stats__spark" viewBox="0 0 160 42"><polyline fill="none" points="0,30 26,30 53,22 80,22 106,14 133,14 160,6" stroke="currentColor" stroke-width="2"/><circle cx="160" cy="6" fill="currentColor" r="3"/><line stroke="var(--bevel-line)" x1="0" x2="160" y1="41" y2="41"/></svg></dd></div>
9
+ <div class="bevel-stats__tile"><dt class="bevel-stats__label">Open reviews</dt><dd class="bevel-stats__value">4</dd><dd class="bevel-stats__delta" data-bevel-direction="up" data-bevel-tone="bad"><svg aria-hidden="true" height="12" width="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="square" stroke-linejoin="miter"><path d="M12 20V4m-6 6 6-6 6 6"/></svg><span class="bevel-sr-only">Increased by </span>2 more than last week</dd><dd><svg aria-hidden="true" class="bevel-stats__spark" viewBox="0 0 160 42"><polyline fill="none" points="0,20 26,28 53,24 80,14 106,18 133,8 160,4" stroke="currentColor" stroke-width="2"/><circle cx="160" cy="4" fill="currentColor" r="3"/><line stroke="var(--bevel-line)" x1="0" x2="160" y1="41" y2="41"/></svg></dd></div>
10
+ </dl></section>
11
+ <section data-stat-state="zero" hidden><dl class="bevel-stats">
12
+ <div class="bevel-stats__tile"><dt class="bevel-stats__label">Weekly views</dt><dd class="bevel-stats__value">0</dd><dd class="bevel-stats__delta">No activity yet</dd><dd><svg aria-hidden="true" class="bevel-stats__spark" viewBox="0 0 160 42"><line stroke="var(--bevel-line-2)" stroke-dasharray="2 4" x1="0" x2="160" y1="30" y2="30"/></svg></dd></div>
13
+ <div class="bevel-stats__tile"><dt class="bevel-stats__label">Documents</dt><dd class="bevel-stats__value">0</dd><dd class="bevel-stats__delta">No activity yet</dd><dd><svg aria-hidden="true" class="bevel-stats__spark" viewBox="0 0 160 42"><line stroke="var(--bevel-line-2)" stroke-dasharray="2 4" x1="0" x2="160" y1="30" y2="30"/></svg></dd></div>
14
+ <div class="bevel-stats__tile"><dt class="bevel-stats__label">Net change</dt><dd class="bevel-stats__value">−12,450</dd><dd class="bevel-stats__delta" data-bevel-direction="down"><span class="bevel-sr-only">Decreased by </span>12% this week</dd><dd><svg aria-hidden="true" class="bevel-stats__spark" viewBox="0 0 160 42"><polyline fill="none" points="0,7 26,11 53,9 80,22 106,18 133,31 160,36" stroke="currentColor" stroke-width="2"/><circle cx="160" cy="36" fill="currentColor" r="3"/><line stroke="var(--bevel-line)" x1="0" x2="160" y1="41" y2="41"/></svg></dd></div>
15
+ </dl></section>
16
+ <footer class="bevel-display-example__foot"><small>Northstar Studio</small><time datetime="2026-09-01/2026-09-07">Sep 01–07, 2026</time></footer></main>
17
+
18
+ <script src="../../bevel.js"></script>
19
+ <script>((host, { standalone = true, assetRoot = "../../", ready } = {}) => {
20
+ const wanted=new URLSearchParams(location.search).get("state")||"default";for(const section of host.querySelectorAll("[data-stat-state]"))section.hidden=section.dataset.statState!==wanted;
21
+ })(document.body, {standalone:true,assetRoot:"../../",ready:callback => { if (document.readyState === "loading") document.addEventListener("DOMContentLoaded", callback, {once:true}); else callback(); }});</script>
22
+ </body>
23
+ </html>
package/examples/components/toast-stack.html ADDED
@@ -0,0 +1,21 @@
1
+ <!doctype html>
2
+ <html data-theme="light" lang="en">
3
+ <head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="stylesheet" href="../../bevel-fonts.css"><link rel="stylesheet" href="../../bevel.css"><title>Toast stack · Bevel</title></head>
4
+ <body>
5
+ <main class="bevel-anchor-example"><header class="bevel-anchor-example__header"><div class="bevel-overlay__eyebrow">Feedback / 19</div><h1>A small acknowledgement</h1><p>Enough feedback to know what happened.</p></header><div class="bevel-toast-stage"><div class="bevel-toasts" aria-live="polite"><template data-bevel-toast-template><article class="bevel-toast"><span class="bevel-toast__icon"></span><div class="bevel-toast__body"><h2 class="bevel-toast__title"></h2><p class="bevel-toast__message"></p><button class="bevel-toast__action bevel-button bevel-button--small" type="button"></button></div><button class="bevel-toast__close" type="button"></button></article></template></div></div><div class="bevel-buttons"><button class="bevel-button bevel-button--small" id="show-stack" type="button">Show notices</button><button class="bevel-button bevel-button--small" id="show-focused" type="button">Report a finished move</button></div></main>
6
+ <script src="../../bevel.js"></script>
7
+ <script>((host, { standalone = true, assetRoot = "../../", ready } = {}) => {
8
+
9
+ const show = host.querySelector("#show-stack");
10
+ show.addEventListener("click", () => {
11
+ Bevel.notify({ key:"saved", tone:"success", title:"Changes saved", message:"Field notes is up to date.", duration:4000 });
12
+ Bevel.notify({ key:"archived", title:"Document archived", message:"You can bring it back whenever you need it.", action:{ id:"undo", label:"Undo" } });
13
+ Bevel.notify({ key:"upload", tone:"error", title:"Upload interrupted", message:"workspace.jpg did not finish uploading.", action:{ id:"retry", label:"Try again" } });
14
+ });
15
+ host.querySelector("#show-focused").addEventListener("click", () => Bevel.notify({ key:"moved", tone:"success", title:"Moved 3 items to client-work", message:"No change was needed for logo.png.", focus:true }));
16
+ host.querySelector(".bevel-toasts").addEventListener("bevel:action", event => { document.body.dataset.lastAction = `${event.detail.action}:${event.detail.key}`; });
17
+ if (standalone) ready(() => show.click());
18
+
19
+ })(document.body, {standalone:true,assetRoot:"../../",ready:callback => { if (document.readyState === "loading") document.addEventListener("DOMContentLoaded", callback, {once:true}); else callback(); }});</script>
20
+ </body>
21
+ </html>
package/examples/components/tree-view.html ADDED
@@ -0,0 +1,9 @@
1
+ <!doctype html>
2
+ <html class="light" lang="en">
3
+ <head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Tree view · Bevel</title><link rel="stylesheet" href="../../bevel-fonts.css"><link rel="stylesheet" href="../../bevel.css"></head>
4
+ <body>
5
+ <main class="bevel-example bevel-navigation-example"><header class="bevel-example__header"><div class="bevel-eyebrow">Navigation / 17</div><h1>A place for every document</h1><p>Folders open in place and keep their contents aligned.</p></header><div class="bevel-tree" data-bevel-selected="project-brief" aria-label="Northstar documents"><div class="bevel-tree__head"><strong>Northstar Studio</strong><span class="bevel-badge">12 files · 4 folders</span></div><details data-bevel-key="projects" open><summary role="treeitem" data-bevel-key="projects" data-bevel-label="Projects"><i class="bevel-tree__caret" aria-hidden="true">›</i><svg aria-hidden="true" height="16" width="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="square" stroke-linejoin="miter"><path d="M3 7V4h6l3 3h9v13H3Z"/></svg>Projects</summary><div class="bevel-tree__group" role="group"><details data-bevel-key="field-notes" open><summary role="treeitem" data-bevel-key="field-notes" data-bevel-label="Field notes"><i class="bevel-tree__caret" aria-hidden="true">›</i><svg aria-hidden="true" height="16" width="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="square" stroke-linejoin="miter"><path d="M3 7V4h6l3 3h9v13H3Z"/></svg>Field notes</summary><div class="bevel-tree__group" role="group"><button class="bevel-tree__item" role="treeitem" data-bevel-key="project-brief" data-bevel-label="Project brief" type="button"><svg aria-hidden="true" height="15" width="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="square" stroke-linejoin="miter"><path d="M5 3h9l5 5v13H5ZM14 3v6h5"/></svg><span>Project brief</span><span class="bevel-badge">Open</span></button><button class="bevel-tree__item" role="treeitem" data-bevel-key="research" type="button"><svg aria-hidden="true" height="15" width="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="square" stroke-linejoin="miter"><path d="M5 3h9l5 5v13H5ZM14 3v6h5"/></svg>Research notes</button><button class="bevel-tree__item" role="treeitem" data-bevel-key="references" type="button"><svg aria-hidden="true" height="15" width="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="square" stroke-linejoin="miter"><path d="M5 3h9l5 5v13H5ZM14 3v6h5"/></svg>Shared references</button></div></details><details data-bevel-key="website"><summary role="treeitem" data-bevel-key="website"><i class="bevel-tree__caret" aria-hidden="true">›</i><svg aria-hidden="true" height="16" width="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="square" stroke-linejoin="miter"><path d="M3 7V4h6l3 3h9v13H3Z"/></svg>Website</summary><div class="bevel-tree__group" role="group"><button class="bevel-tree__item" role="treeitem" data-bevel-key="home" type="button"><svg aria-hidden="true" height="15" width="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="square" stroke-linejoin="miter"><path d="M5 3h9l5 5v13H5ZM14 3v6h5"/></svg>Home page</button></div></details></div></details><details data-bevel-key="archive"><summary role="treeitem" data-bevel-key="archive"><i class="bevel-tree__caret" aria-hidden="true">›</i><svg aria-hidden="true" height="16" width="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="square" stroke-linejoin="miter"><path d="M3 7V4h6l3 3h9v13H3Z"/></svg>Archive <span class="bevel-badge">0</span></summary><div class="bevel-tree__empty" role="group">No documents here yet.</div></details><button class="bevel-tree__item" role="treeitem" data-bevel-key="guide" type="button"><svg aria-hidden="true" height="15" width="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="square" stroke-linejoin="miter"><path d="M5 3h9l5 5v13H5ZM14 3v6h5"/></svg>Workspace guide</button></div></main>
6
+ <script src="../../bevel.js"></script>
7
+
8
+ </body>
9
+ </html>
package/examples/components/upload-dropzone.html ADDED
@@ -0,0 +1,88 @@
1
+ <!doctype html>
2
+ <html data-theme="light" lang="en">
3
+ <head>
4
+ <meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
5
+ <link rel="stylesheet" href="../../bevel-fonts.css"><link rel="stylesheet" href="../../bevel.css"><link rel="stylesheet" href="../../integrations/quickcrop.css">
6
+ <title>Upload dropzone · Bevel</title>
7
+ </head>
8
+ <body data-bevel-example="upload-dropzone">
9
+ <main class="bevel-anchor-example">
10
+ <header class="bevel-anchor-example__header"><div class="bevel-overlay__eyebrow">Files / 08</div><h1>Bring your work along</h1><p>Images and documents, ready for the project.</p></header>
11
+ <section class="bevel-dropzone" data-bevel-max-bytes="10485760" data-bevel-download>
12
+ <div class="bevel-dropzone__target">
13
+ <svg aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="square" stroke-linejoin="miter"><path d="M8.5 18H6a4 4 0 0 1 0-8c0-3.5 2.5-6 6-6s6 2.5 6 6a4 4 0 0 1 0 8h-2.5M12 21v-9m-3 3 3-3 3 3"/></svg>
14
+ <h2 class="bevel-dropzone__title">Drop a file here</h2>
15
+ <p class="bevel-dropzone__hint">Images, PDFs and documents · up to 10 MB each</p>
16
+ <label class="bevel-button bevel-button--small"><input class="bevel-sr-only" type="file" accept="image/*,.pdf,.doc,.docx" multiple><span class="bevel-button__label">Choose a file</span></label>
17
+ </div>
18
+ <div class="bevel-upload" data-bevel-upload-list>
19
+ <article class="bevel-upload__row" data-bevel-file-key="field-guide" data-bevel-name="field-guide.pdf" data-bevel-status="uploaded" data-bevel-url="../fixtures/field-guide.pdf">
20
+ <div class="bevel-upload__preview" aria-hidden="true">PDF</div><div class="bevel-upload__copy"><strong class="bevel-upload__name">field-guide.pdf</strong><span class="bevel-upload__meta">420 KB</span><span class="bevel-upload__status" role="status">Uploaded</span><progress class="bevel-upload__progress" max="100" value="100" aria-label="Upload progress"></progress></div><span class="bevel-upload__state" aria-hidden="true">✓</span><div class="bevel-upload__actions"><a class="bevel-upload__link" href="../fixtures/field-guide.pdf" rel="noopener noreferrer" download>Open file</a><button class="bevel-button bevel-button--small" type="button" data-bevel-upload-remove>Remove</button></div>
21
+ </article>
22
+ <p class="bevel-upload__rejection" hidden>Rejected files appear here with their reason.</p>
23
+ </div>
24
+ <p class="bevel-dropzone__transport">Example transport: simulated locally with deterministic progress. Production applications provide the upload operation.</p>
25
+ </section>
26
+ </main>
27
+ <script src="../../bevel.js"></script>
28
+ <script src="../../integrations/quickcrop.js"></script>
29
+ <script type="module">(async (host, { standalone = true, assetRoot = "../../", ready } = {}) => {
30
+
31
+ const root = host.querySelector(".bevel-dropzone");
32
+ const files = new Map();
33
+ let quickcrop;
34
+ try { ({ default: quickcrop } = await import(assetRoot + "examples/peers/quickcrop/quickcrop.js")); } catch {}
35
+
36
+ const transport = async (key, file) => {
37
+ if (window.bevelUploadTransport) return window.bevelUploadTransport({ root, key, file });
38
+ Bevel.upload.update(root, key, { status: "uploading", progress: 0, error: null });
39
+ for (const progress of [25, 50, 75, 100]) {
40
+ await new Promise(resolve => setTimeout(resolve, 80));
41
+ if (!root.querySelector(`[data-bevel-file-key="${CSS.escape(key)}"]`)) return;
42
+ Bevel.upload.update(root, key, { status: "uploading", progress });
43
+ }
44
+ Bevel.upload.update(root, key, { status: "uploaded", progress: 100, url: "../fixtures/workspace.jpg", name: file.name });
45
+ };
46
+
47
+ const crop = async (key, trigger) => {
48
+ const original = files.get(key);
49
+ if (!original || !quickcrop) return;
50
+ let aspect = 1;
51
+ while (root.querySelector(`[data-bevel-file-key="${CSS.escape(key)}"]`)) {
52
+ let nextPreset = null;
53
+ const result = await Bevel.crop(original, {
54
+ quickcrop,
55
+ aspect,
56
+ trigger,
57
+ presets: [{ label: "Square", value: "square" }, { label: "Free", value: "free" }, { label: "Reset", value: "reset" }],
58
+ onPreset(value) { nextPreset = value; }
59
+ });
60
+ if (nextPreset) { if (nextPreset === "square") aspect = 1; else if (nextPreset === "free") aspect = null; continue; }
61
+ if (!result) return;
62
+ const cropped = new File([result.blob], original.name, { type: result.blob.type, lastModified: Date.now() });
63
+ files.set(key, cropped);
64
+ const row = root.querySelector(`[data-bevel-file-key="${CSS.escape(key)}"]`);
65
+ row?.querySelector(".bevel-upload__meta")?.replaceChildren(`${result.width} × ${result.height} pixels after crop`);
66
+ await transport(key, cropped);
67
+ return;
68
+ }
69
+ };
70
+
71
+ root.addEventListener("bevel:files", event => {
72
+ for (const { key, file } of event.detail.files) {
73
+ files.set(key, file);
74
+ const row = root.querySelector(`[data-bevel-file-key="${CSS.escape(key)}"]`);
75
+ const actions = row.querySelector(".bevel-upload__actions");
76
+ const upload = document.createElement("button"); upload.type = "button"; upload.className = "bevel-button bevel-button--small"; upload.textContent = "Use original"; upload.addEventListener("click", () => transport(key, files.get(key)));
77
+ upload.dataset.bevelTransient = "upload-file-action"; upload.dataset.bevelUploadSelectAction = ""; actions.prepend(upload);
78
+ if (file.type.startsWith("image/")) { const edit = document.createElement("button"); edit.type = "button"; edit.className = "bevel-button bevel-button--small"; edit.dataset.bevelTransient = "upload-file-action"; edit.dataset.bevelUploadSelectAction = ""; edit.textContent = quickcrop ? "Crop" : "Crop unavailable"; edit.disabled = !quickcrop; edit.addEventListener("click", () => crop(key, edit)); actions.prepend(edit); }
79
+ }
80
+ });
81
+ root.addEventListener("bevel:action", event => {
82
+ if (event.detail.action === "retry") transport(event.detail.key, files.get(event.detail.key));
83
+ if (event.detail.action === "remove") files.delete(event.detail.key);
84
+ });
85
+
86
+ })(document.body, {standalone:true,assetRoot:"../../",ready:callback => { if (document.readyState === "loading") document.addEventListener("DOMContentLoaded", callback, {once:true}); else callback(); }});</script>
87
+ </body>
88
+ </html>
package/examples/components/wizard-shell.html ADDED
@@ -0,0 +1,50 @@
1
+ <!doctype html>
2
+ <html data-theme="light" lang="en">
3
+ <head>
4
+ <meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
5
+ <link rel="stylesheet" href="../../bevel-fonts.css"><link rel="stylesheet" href="../../bevel.css">
6
+ <title>Wizard shell · Bevel</title>
7
+ </head>
8
+ <body data-bevel-example="wizard-shell">
9
+ <main class="bevel-anchor-example">
10
+ <header class="bevel-anchor-example__header"><div class="bevel-overlay__eyebrow">Northstar Studio / Field notes</div><h1>Make a space for good work.</h1><p>A few thoughtful choices to get started.</p></header>
11
+ <form id="workspace-wizard" class="bevel-validation-form" data-bevel-validate>
12
+ <section class="bevel-errors" role="alert" hidden><svg aria-hidden="true" width="18" height="18" viewBox="0 0 256 256" fill="currentColor"><path d="M236.8,188.09,149.35,36.22h0a24.76,24.76,0,0,0-42.7,0L19.2,188.09a23.51,23.51,0,0,0,0,23.72A24.35,24.35,0,0,0,40.55,224h174.9a24.35,24.35,0,0,0,21.33-12.19A23.51,23.51,0,0,0,236.8,188.09ZM222.93,203.8a8.5,8.5,0,0,1-7.48,4.2H40.55a8.5,8.5,0,0,1-7.48-4.2,7.59,7.59,0,0,1,0-7.72L120.52,44.21a8.75,8.75,0,0,1,15,0l87.45,151.87A7.59,7.59,0,0,1,222.93,203.8ZM120,144V104a8,8,0,0,1,16,0v40a8,8,0,0,1-16,0Zm20,36a12,12,0,1,1-12-12A12,12,0,0,1,140,180Z"/></svg><div><strong>Check the highlighted field.</strong><ul class="bevel-errors__list"></ul></div></section>
13
+ <div class="bevel-wizard" data-bevel-step="basics">
14
+ <nav class="bevel-wizard__steps" aria-label="Setup progress">
15
+ <button class="bevel-wizard__step" type="button" data-bevel-step="basics"><span class="bevel-wizard__marker"><span>01</span><svg aria-hidden="true" height="13" width="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.85" stroke-linecap="square" stroke-linejoin="miter"><path d="m5 12 4 4L19 6"/></svg></span>The basics<small class="bevel-wizard__step-note">Current step</small></button>
16
+ <button class="bevel-wizard__step" type="button" data-bevel-step="people"><span class="bevel-wizard__marker"><span>02</span><svg aria-hidden="true" height="13" width="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.85" stroke-linecap="square" stroke-linejoin="miter"><path d="m5 12 4 4L19 6"/></svg></span>Invite people<small class="bevel-wizard__step-note">Up next</small></button>
17
+ <button class="bevel-wizard__step" type="button" data-bevel-step="ready"><span class="bevel-wizard__marker"><span>03</span><svg aria-hidden="true" height="13" width="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.85" stroke-linecap="square" stroke-linejoin="miter"><path d="m5 12 4 4L19 6"/></svg></span>Ready to go<small class="bevel-wizard__step-note">Up next</small></button>
18
+ </nav>
19
+ <div>
20
+ <section class="bevel-wizard__panel" data-bevel-key="basics" aria-labelledby="wizard-basics-heading">
21
+ <div class="bevel-overlay__eyebrow">Step 01 of 03</div><h2 id="wizard-basics-heading">Start with the essentials.</h2><p class="bevel-wizard__lede">Name the private space where your team will work.</p>
22
+ <div class="bevel-validation-form__field"><label for="wizard-name">Project name</label><input class="bevel-input" id="wizard-name" name="project" required data-bevel-validation-message="Enter a project name." placeholder="e.g. Field notes"></div>
23
+ <div class="bevel-wizard__actions"><button class="bevel-button bevel-button--primary" type="button" data-bevel-step="next">Next step</button></div>
24
+ </section>
25
+ <section class="bevel-wizard__panel" data-bevel-key="people" aria-labelledby="wizard-people-heading" hidden inert>
26
+ <div class="bevel-overlay__eyebrow">Step 02 of 03</div><h2 id="wizard-people-heading">Good work needs good people.</h2><p class="bevel-wizard__lede">Invite someone to help shape Field notes.</p>
27
+ <div class="bevel-validation-form__field"><label for="wizard-email">Email address</label><input class="bevel-input" id="wizard-email" name="email" type="email" required data-bevel-validation-message="Enter a complete email address, like mira@example.test." value="mira@example.test"></div>
28
+ <div class="bevel-validation-form__field"><label for="wizard-role">Role</label><label class="bevel-select"><span class="bevel-sr-only">Role</span><select class="bevel-select__field" id="wizard-role" name="role"><option>Editor</option><option>Viewer</option><option>Owner</option></select></label></div>
29
+ <div class="bevel-wizard__actions"><button class="bevel-button" type="button" data-bevel-step="prev">Back</button><button class="bevel-button bevel-button--primary" type="button" data-bevel-step="next">Next step</button></div><p class="bevel-wizard__note">Only invited people can join this workspace.</p>
30
+ </section>
31
+ <section class="bevel-wizard__panel" data-bevel-key="ready" aria-labelledby="wizard-ready-heading" hidden inert>
32
+ <div class="bevel-overlay__eyebrow">Step 03 of 03</div><h2 id="wizard-ready-heading">Your space is ready.</h2><p class="bevel-wizard__lede">Field notes brings your documents, decisions and people together.</p>
33
+ <div class="bevel-wizard__complete-card"><svg aria-hidden="true" height="22" width="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="square" stroke-linejoin="miter"><path d="M3 7V4h6l3 3h9v13H3Z"/></svg><div><strong>Field notes</strong><small>Northstar Studio · Private project · 1 collaborator invited</small></div><span class="bevel-badge">Ready</span></div>
34
+ <div class="bevel-wizard__actions"><button class="bevel-button" type="button" data-bevel-step="prev">Back</button><button class="bevel-button bevel-button--primary" type="submit">Finish setup</button></div>
35
+ </section>
36
+ </div>
37
+ </div>
38
+ <button type="reset" hidden>Reset</button><output id="wizard-result" class="bevel-local-result" aria-live="polite"></output>
39
+ </form>
40
+ </main>
41
+ <script src="../../bevel.js"></script>
42
+ <script>((host, { standalone = true, assetRoot = "../../", ready } = {}) => {
43
+
44
+ const form = host.querySelector("#workspace-wizard");
45
+ form.addEventListener("submit", event => { event.preventDefault(); host.querySelector("#wizard-result").textContent = "Setup request received."; });
46
+ form.addEventListener("reset", () => requestAnimationFrame(() => { host.querySelector(".bevel-wizard").dataset.bevelStep = "basics"; host.querySelector("#wizard-result").textContent = ""; Bevel.refresh(form); }));
47
+
48
+ })(document.body, {standalone:true,assetRoot:"../../",ready:callback => { if (document.readyState === "loading") document.addEventListener("DOMContentLoaded", callback, {once:true}); else callback(); }});</script>
49
+ </body>
50
+ </html>
package/examples/datastar/index.html ADDED
@@ -0,0 +1,38 @@
1
+ <!doctype html>
2
+ <html lang="en" data-theme="light">
3
+ <head>
4
+ <meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1">
5
+ <title>Bevel with Datastar 1.0.3</title>
6
+ <link rel="stylesheet" href="../../bevel-fonts.css"><link rel="stylesheet" href="../../bevel.css">
7
+ </head>
8
+ <body class="bevel-page" data-signals="{query:document.getElementById('query').value,customerId:document.getElementById('customer-key').value}">
9
+ <main id="datastar-example" data-bevel-datastar>
10
+ <h1>Bevel with Datastar 1.0.3</h1>
11
+ <p>This local example uses Datastar for application state and requests. Bevel owns the component interaction and saved DOM attributes.</p>
12
+ <form id="search-form">
13
+ <label class="bevel-field" for="query">Query<input id="query" class="bevel-input" name="query" value="" data-bind:query data-effect="Bevel.datastar.control(el,$query)"></label>
14
+ <section class="bevel-combobox" id="customer-picker" data-bevel-value="mira" data-effect="Bevel.datastar.state(el,{value:$customerId})" data-on:bevel:change="if(evt.detail.component==='combobox' &amp;&amp; evt.detail.action==='select') $customerId=evt.detail.next">
15
+ <label class="bevel-picker__label" for="customer-search">Customer</label>
16
+ <div class="bevel-combobox__control">
17
+ <input id="customer-search" role="combobox" aria-autocomplete="list" aria-controls="customer-options" aria-expanded="false" value="Mira" autocomplete="off">
18
+ <button class="bevel-button" type="button" data-bevel-open="customer-options" aria-controls="customer-options" aria-expanded="false" aria-label="Choose customer">⌄</button>
19
+ </div>
20
+ <input id="customer-key" type="hidden" name="customer" value="mira">
21
+ <div class="bevel-combobox__listbox" id="customer-options" role="listbox" aria-label="Customers" popover="manual">
22
+ <button class="bevel-combobox__option" id="customer-mira" type="button" role="option" data-bevel-key="mira" data-bevel-label="Mira">Mira</button>
23
+ <button class="bevel-combobox__option" id="customer-sanford" type="button" role="option" data-bevel-key="sanford" data-bevel-label="Sanford">Sanford</button>
24
+ <p class="bevel-combobox__empty" role="status" hidden>No customer matches that search.</p>
25
+ </div>
26
+ </section>
27
+ <button class="bevel-button bevel-button--primary" id="search-button" type="button" data-on:click="@get('/search')">Run local request</button>
28
+ </form>
29
+ <p>Current signal values: <output id="signal-values" data-text="JSON.stringify({query:$query,customerId:$customerId})"></output></p>
30
+ <section id="results" aria-live="polite">No request yet.</section>
31
+ </main>
32
+ <script src="../../vendor/floating-ui/floating-ui.core.umd.min.js"></script>
33
+ <script src="../../vendor/floating-ui/floating-ui.dom.umd.min.js"></script>
34
+ <script src="../../bevel.js"></script><script src="../../integrations/datastar.js"></script>
35
+ <script>Bevel.datastar.mount(document.getElementById('datastar-example'))</script>
36
+ <script type="module" src="../../vendor/datastar/datastar-1.0.3.js"></script>
37
+ </body>
38
+ </html>
package/examples/datastar/server.mjs ADDED
@@ -0,0 +1,31 @@
1
+ import { createServer } from "node:http";
2
+ import { readFileSync } from "node:fs";
3
+ import { dirname, extname, resolve, sep } from "node:path";
4
+ import { fileURLToPath } from "node:url";
5
+
6
+ const root = dirname(dirname(dirname(fileURLToPath(import.meta.url))));
7
+ const types = { ".html": "text/html", ".js": "text/javascript", ".css": "text/css", ".woff2": "font/woff2" };
8
+ const escape = value => String(value).replace(/[&<>"']/g, character => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" })[character]);
9
+ export function handleRequest(request, response) {
10
+ const url = new URL(request.url, "http://localhost");
11
+ if (request.method !== "GET") { response.writeHead(405).end("GET only"); return; }
12
+ if (url.pathname === "/search") {
13
+ let values;
14
+ try { values = JSON.parse(url.searchParams.get("datastar") || "{}"); }
15
+ catch { response.writeHead(400).end("Invalid signal values"); return; }
16
+ if (!values || typeof values !== "object" || Array.isArray(values)) { response.writeHead(400).end("Signal values must be an object"); return; }
17
+ response.setHeader("content-type", "text/html");
18
+ response.setHeader("datastar-selector", "#results");
19
+ response.setHeader("datastar-mode", "inner");
20
+ response.end(`<p>Local request received.</p><dl><dt>Query</dt><dd>${escape(values.query ?? "")}</dd><dt>Customer key</dt><dd>${escape(values.customerId ?? "")}</dd></dl>`);
21
+ return;
22
+ }
23
+ const path = resolve(root, url.pathname === "/" ? "examples/datastar/index.html" : `.${url.pathname}`);
24
+ if (!path.startsWith(root + sep)) { response.writeHead(404).end("not found"); return; }
25
+ try { response.setHeader("content-type", types[extname(path)] || "application/octet-stream"); response.end(readFileSync(path)); }
26
+ catch { response.statusCode = 404; response.end("not found"); }
27
+ }
28
+ if (process.argv[1] && resolve(process.argv[1]) === fileURLToPath(import.meta.url)) {
29
+ const server = createServer(handleRequest);
30
+ server.listen(Number(process.env.PORT || 7384), "127.0.0.1", () => console.log(`Bevel Datastar example: http://127.0.0.1:${server.address().port}`));
31
+ }
package/examples/fixtures/field-guide.pdf ADDED
@@ -0,0 +1,14 @@
1
+ %PDF-1.4
2
+ 1 0 obj <</Type/Catalog/Pages 2 0 R>> endobj
3
+ 2 0 obj <</Type/Pages/Count 1/Kids[3 0 R]>> endobj
4
+ 3 0 obj <</Type/Page/Parent 2 0 R/MediaBox[0 0 300 200]/Contents 4 0 R>> endobj
5
+ 4 0 obj <</Length 44>> stream
6
+ BT /F1 18 Tf 40 120 Td (Field guide) Tj ET
7
+ endstream endobj
8
+ xref
9
+ 0 5
10
+ 0000000000 65535 f
11
+ trailer <</Root 1 0 R/Size 5>>
12
+ startxref
13
+ 0
14
+ %%EOF
package/examples/fixtures/workspace.jpg ADDED
Binary file
package/examples/setup-peers.mjs ADDED
@@ -0,0 +1,35 @@
1
+ import { copyFile, mkdir, readFile, writeFile } from "node:fs/promises";
2
+ import { createHash } from "node:crypto";
3
+ import { dirname, join, resolve } from "node:path";
4
+ import { fileURLToPath } from "node:url";
5
+
6
+ const distributions = {
7
+ richclay: ["richclay.js", "richclay.css", "LICENSE", "THIRD-PARTY-NOTICES.md", "vendor/squire.js", "vendor/squire.provenance.json", "vendor/SQUIRE-LICENSE", "vendor/purify.min.js", "vendor/DOMPURIFY-LICENSE", "vendor/DOMPURIFY-LICENSE-MPL"],
8
+ quickcrop: ["quickcrop.js", "quickcrop.css", "LICENSE"],
9
+ hypercms: ["dist/hypercms.min.js", "LICENSE"],
10
+ "clay-mutation": ["src/lib/mutation.js", "src/lib/extension-noise.js", "src/lib/region-policy.js", "src/lib/region-capabilities.js", "src/lib/root-attrs.js", "src/lib/user-gesture.js", "LICENSE"]
11
+ };
12
+ const packageNames = { hypercms: "@panphora/hyper-cms", "clay-mutation": "@panphora/clayjs" };
13
+ const [name, source] = process.argv.slice(2);
14
+ if (!distributions[name] || !source) throw new Error("Usage: node examples/setup-peers.mjs <richclay|quickcrop|hypercms|clay-mutation> <supplied-package-directory>");
15
+ const directory = resolve(source);
16
+ let metadata;
17
+ try { metadata = JSON.parse(await readFile(join(directory, "package.json"), "utf8")); }
18
+ catch (error) {
19
+ if (error.code !== "ENOENT") throw error;
20
+ metadata = JSON.parse(await readFile(join(directory, "provenance.json"), "utf8"));
21
+ }
22
+ if (metadata.name !== (packageNames[name] || name)) throw new Error(`Expected ${packageNames[name] || name}, received ${metadata.name}`);
23
+ const files = {};
24
+ for (const file of distributions[name]) {
25
+ const bytes = await readFile(join(directory, file));
26
+ files[file] = createHash("sha256").update(bytes).digest("hex");
27
+ if (metadata.files && !Array.isArray(metadata.files) && metadata.files[file] !== files[file]) throw new Error(`Fixture hash mismatch: ${file}`);
28
+ }
29
+ const destination = join(dirname(fileURLToPath(import.meta.url)), "peers", name);
30
+ for (const file of distributions[name]) {
31
+ await mkdir(dirname(join(destination, file)), { recursive: true });
32
+ await copyFile(join(directory, file), join(destination, file));
33
+ }
34
+ await writeFile(join(destination, "provenance.json"), `${JSON.stringify({ name: metadata.name, version: metadata.version, source: "Explicitly supplied distribution; hashes identify these bytes, not a published release claim.", files }, null, 2)}\n`);
35
+ console.log(`Prepared ${name} ${metadata.version}: ${distributions[name].length} files in examples/peers/${name}`);
package/fonts/LICENSE-ibm-plex-mono.txt ADDED
@@ -0,0 +1,93 @@
1
+ Copyright 2017 IBM Corp. All rights reserved. IBMPlexMono-ThinItalic.ttf: Copyright 2017 IBM Corp. All rights reserved. IBMPlexMono-ExtraLight.ttf: Copyright 2017 IBM Corp. All rights reserved. IBMPlexMono-ExtraLightItalic.ttf: Copyright 2017 IBM Corp. All rights reserved. IBMPlexMono-Light.ttf: Copyright 2017 IBM Corp. All rights reserved. IBMPlexMono-LightItalic.ttf: Copyright 2017 IBM Corp. All rights reserved. IBMPlexMono-Regular.ttf: Copyright 2017 IBM Corp. All rights reserved. IBMPlexMono-Italic.ttf: Copyright 2017 IBM Corp. All rights reserved. IBMPlexMono-Medium.ttf: Copyright 2017 IBM Corp. All rights reserved. IBMPlexMono-MediumItalic.ttf: Copyright 2017 IBM Corp. All rights reserved. IBMPlexMono-SemiBold.ttf: Copyright 2017 IBM Corp. All rights reserved. IBMPlexMono-SemiBoldItalic.ttf: Copyright 2017 IBM Corp. All rights reserved. IBMPlexMono-Bold.ttf: Copyright 2017 IBM Corp. All rights reserved. IBMPlexMono-BoldItalic.ttf: Copyright 2017 IBM Corp. All rights reserved.
2
+
3
+ This Font Software is licensed under the SIL Open Font License, Version 1.1.
4
+ This license is copied below, and is also available with a FAQ at:
5
+ http://scripts.sil.org/OFL
6
+
7
+
8
+ -----------------------------------------------------------
9
+ SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
10
+ -----------------------------------------------------------
11
+
12
+ PREAMBLE
13
+ The goals of the Open Font License (OFL) are to stimulate worldwide
14
+ development of collaborative font projects, to support the font creation
15
+ efforts of academic and linguistic communities, and to provide a free and
16
+ open framework in which fonts may be shared and improved in partnership
17
+ with others.
18
+
19
+ The OFL allows the licensed fonts to be used, studied, modified and
20
+ redistributed freely as long as they are not sold by themselves. The
21
+ fonts, including any derivative works, can be bundled, embedded,
22
+ redistributed and/or sold with any software provided that any reserved
23
+ names are not used by derivative works. The fonts and derivatives,
24
+ however, cannot be released under any other type of license. The
25
+ requirement for fonts to remain under this license does not apply
26
+ to any document created using the fonts or their derivatives.
27
+
28
+ DEFINITIONS
29
+ "Font Software" refers to the set of files released by the Copyright
30
+ Holder(s) under this license and clearly marked as such. This may
31
+ include source files, build scripts and documentation.
32
+
33
+ "Reserved Font Name" refers to any names specified as such after the
34
+ copyright statement(s).
35
+
36
+ "Original Version" refers to the collection of Font Software components as
37
+ distributed by the Copyright Holder(s).
38
+
39
+ "Modified Version" refers to any derivative made by adding to, deleting,
40
+ or substituting -- in part or in whole -- any of the components of the
41
+ Original Version, by changing formats or by porting the Font Software to a
42
+ new environment.
43
+
44
+ "Author" refers to any designer, engineer, programmer, technical
45
+ writer or other person who contributed to the Font Software.
46
+
47
+ PERMISSION & CONDITIONS
48
+ Permission is hereby granted, free of charge, to any person obtaining
49
+ a copy of the Font Software, to use, study, copy, merge, embed, modify,
50
+ redistribute, and sell modified and unmodified copies of the Font
51
+ Software, subject to the following conditions:
52
+
53
+ 1) Neither the Font Software nor any of its individual components,
54
+ in Original or Modified Versions, may be sold by itself.
55
+
56
+ 2) Original or Modified Versions of the Font Software may be bundled,
57
+ redistributed and/or sold with any software, provided that each copy
58
+ contains the above copyright notice and this license. These can be
59
+ included either as stand-alone text files, human-readable headers or
60
+ in the appropriate machine-readable metadata fields within text or
61
+ binary files as long as those fields can be easily viewed by the user.
62
+
63
+ 3) No Modified Version of the Font Software may use the Reserved Font
64
+ Name(s) unless explicit written permission is granted by the corresponding
65
+ Copyright Holder. This restriction only applies to the primary font name as
66
+ presented to the users.
67
+
68
+ 4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
69
+ Software shall not be used to promote, endorse or advertise any
70
+ Modified Version, except to acknowledge the contribution(s) of the
71
+ Copyright Holder(s) and the Author(s) or with their explicit written
72
+ permission.
73
+
74
+ 5) The Font Software, modified or unmodified, in part or in whole,
75
+ must be distributed entirely under this license, and must not be
76
+ distributed under any other license. The requirement for fonts to
77
+ remain under this license does not apply to any document created
78
+ using the Font Software.
79
+
80
+ TERMINATION
81
+ This license becomes null and void if any of the above conditions are
82
+ not met.
83
+
84
+ DISCLAIMER
85
+ THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
86
+ EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
87
+ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
88
+ OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
89
+ COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
90
+ INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
91
+ DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
92
+ FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
93
+ OTHER DEALINGS IN THE FONT SOFTWARE.