@kerfjs/ui 5.0.0-beta.23 → 5.0.0-beta.24

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 (193) hide show
  1. package/README.md +1 -0
  2. package/ai/compile-time-contracts-v1.json +2 -1
  3. package/ai/component-catalog-v2-overrides.json +5 -12
  4. package/ai/component-catalog-v2.json +43 -32
  5. package/ai/component-catalog.json +56 -37
  6. package/ai/public-api-signatures-v1.md +29 -16
  7. package/ai/skill.md +4 -4
  8. package/ai/webawesome-jsx-signatures-v1.md +1 -1
  9. package/dist/app-tab.js +1 -1
  10. package/dist/browser/list.js +3 -0
  11. package/dist/catalog.d.ts +8 -4
  12. package/dist/catalog.js +19 -10
  13. package/dist/catalog.js.map +1 -1
  14. package/dist/{chunk-RYRIFZCT.js → chunk-7XRDUG4Y.js} +5 -5
  15. package/dist/{chunk-RYRIFZCT.js.map → chunk-7XRDUG4Y.js.map} +1 -1
  16. package/dist/{chunk-OHU6CI22.js → chunk-B3A3IVO5.js} +2 -2
  17. package/dist/{chunk-OHU6CI22.js.map → chunk-B3A3IVO5.js.map} +1 -1
  18. package/dist/{chunk-ELSJX4W7.js → chunk-FEAMR7S4.js} +2 -2
  19. package/dist/{chunk-ELSJX4W7.js.map → chunk-FEAMR7S4.js.map} +1 -1
  20. package/dist/{chunk-OZWU5ZPZ.js → chunk-IJBSZ4NX.js} +2 -2
  21. package/dist/{chunk-OZWU5ZPZ.js.map → chunk-IJBSZ4NX.js.map} +1 -1
  22. package/dist/chunk-J5BFYY7Q.js +35 -0
  23. package/dist/chunk-J5BFYY7Q.js.map +1 -0
  24. package/dist/{chunk-QQFJMRIB.js → chunk-KWWR5VMS.js} +2 -2
  25. package/dist/{chunk-QQFJMRIB.js.map → chunk-KWWR5VMS.js.map} +1 -1
  26. package/dist/{chunk-K57KRAOV.js → chunk-NWSEP5RT.js} +2 -2
  27. package/dist/{chunk-K57KRAOV.js.map → chunk-NWSEP5RT.js.map} +1 -1
  28. package/dist/{chunk-GP5DP5DL.js → chunk-OJWWHFH3.js} +39 -4
  29. package/dist/chunk-OJWWHFH3.js.map +1 -0
  30. package/dist/{chunk-DSNIYOZ3.js → chunk-PSKN344N.js} +2 -2
  31. package/dist/{chunk-DSNIYOZ3.js.map → chunk-PSKN344N.js.map} +1 -1
  32. package/dist/{chunk-W7YD6E4N.js → chunk-R7ZWUN64.js} +2 -2
  33. package/dist/{chunk-W7YD6E4N.js.map → chunk-R7ZWUN64.js.map} +1 -1
  34. package/dist/{chunk-PZQVSDLH.js → chunk-RKVQEH4J.js} +1 -1
  35. package/dist/chunk-RKVQEH4J.js.map +1 -0
  36. package/dist/{chunk-7L6EHUMV.js → chunk-SYDMYBPG.js} +3 -3
  37. package/dist/chunk-SYDMYBPG.js.map +1 -0
  38. package/dist/{chunk-W4CXQYSG.js → chunk-TB6DY7H5.js} +3 -1
  39. package/dist/chunk-TB6DY7H5.js.map +1 -0
  40. package/dist/{chunk-BBRXX6PF.js → chunk-UFZKLBCF.js} +2 -2
  41. package/dist/{chunk-BBRXX6PF.js.map → chunk-UFZKLBCF.js.map} +1 -1
  42. package/dist/{chunk-AASLYRGE.js → chunk-UKKSMZYT.js} +18 -7
  43. package/dist/chunk-UKKSMZYT.js.map +1 -0
  44. package/dist/{chunk-VLYV65LK.js → chunk-W5L2JSBY.js} +5 -3
  45. package/dist/chunk-W5L2JSBY.js.map +1 -0
  46. package/dist/{chunk-PIDTEQ3U.js → chunk-Y45PPBDV.js} +2 -2
  47. package/dist/{chunk-PIDTEQ3U.js.map → chunk-Y45PPBDV.js.map} +1 -1
  48. package/dist/divider-sides-267FA7sY.d.ts +4 -0
  49. package/dist/index.d.ts +3 -1
  50. package/dist/index.js +16 -15
  51. package/dist/list-action-row.js +1 -1
  52. package/dist/list-header.js +1 -1
  53. package/dist/list-item.js +1 -1
  54. package/dist/list.d.ts +19 -0
  55. package/dist/list.js +3 -0
  56. package/dist/list.js.map +1 -0
  57. package/dist/nav-stack.js +1 -1
  58. package/dist/panel-header.js +1 -1
  59. package/dist/segmented-control.js +1 -1
  60. package/dist/select.js +1 -1
  61. package/dist/skeleton.d.ts +1 -1
  62. package/dist/skeleton.js +1 -1
  63. package/dist/split-view.js +1 -1
  64. package/dist/state-banner.d.ts +4 -2
  65. package/dist/state-banner.js +1 -1
  66. package/dist/styles/catalog.css +8 -2
  67. package/dist/styles/list-item.css +6 -6
  68. package/dist/styles/list.css +43 -0
  69. package/dist/styles/state-banner.css +32 -1
  70. package/dist/styles/styles.css +1 -0
  71. package/dist/styles/sunken-panel.css +4 -0
  72. package/dist/styles/toolbar.css +38 -2
  73. package/dist/sunken-panel.d.ts +5 -2
  74. package/dist/sunken-panel.js +1 -1
  75. package/dist/toolbar-text.js +1 -1
  76. package/dist/toolbar.d.ts +5 -3
  77. package/dist/toolbar.js +1 -1
  78. package/dist/value-table.js +1 -1
  79. package/dist/wire-catalog.d.ts +4 -2
  80. package/dist/wire-catalog.js +95 -36
  81. package/dist/wire-catalog.js.map +1 -1
  82. package/dist/wire-tab-bars.js +1 -1
  83. package/dist/wire-token-search-fields.d.ts +1 -1
  84. package/dist/wire-token-search-fields.js +1 -1
  85. package/docs/accessibility.md +12 -3
  86. package/docs/catalog.md +17 -12
  87. package/docs/component-contract.md +14 -1
  88. package/docs/component-selection.md +6 -2
  89. package/docs/design/templates/empty-state/filtered-dark.svg +1 -1
  90. package/docs/design/templates/empty-state/filtered.svg +1 -1
  91. package/docs/design/templates/empty-state/with-action-dark.svg +1 -1
  92. package/docs/design/templates/empty-state/with-action.svg +1 -1
  93. package/docs/design/templates/empty-state-dark.svg +1 -7
  94. package/docs/design/templates/empty-state.svg +1 -7
  95. package/docs/design/templates/list/compact-dark.svg +1 -0
  96. package/docs/design/templates/list/compact.svg +1 -0
  97. package/docs/design/templates/list/stack-dark.svg +1 -0
  98. package/docs/design/templates/list/stack.svg +1 -0
  99. package/docs/design/templates/list-action-row/default-dark.svg +1 -1
  100. package/docs/design/templates/list-action-row/default.svg +1 -1
  101. package/docs/design/templates/list-action-row/selected-dark.svg +1 -1
  102. package/docs/design/templates/list-action-row/selected.svg +1 -1
  103. package/docs/design/templates/list-action-row-dark.svg +1 -7
  104. package/docs/design/templates/list-action-row.svg +1 -7
  105. package/docs/design/templates/list-dark.svg +1 -0
  106. package/docs/design/templates/list-header/action-dark.svg +1 -1
  107. package/docs/design/templates/list-header/action.svg +1 -1
  108. package/docs/design/templates/list-header/toggle-collapsed-dark.svg +1 -1
  109. package/docs/design/templates/list-header/toggle-collapsed.svg +1 -1
  110. package/docs/design/templates/list-header/toggle-expanded-dark.svg +1 -1
  111. package/docs/design/templates/list-header/toggle-expanded.svg +1 -1
  112. package/docs/design/templates/list-header-dark.svg +1 -11
  113. package/docs/design/templates/list-header.svg +1 -11
  114. package/docs/design/templates/list-item/default-dark.svg +1 -1
  115. package/docs/design/templates/list-item/default.svg +1 -1
  116. package/docs/design/templates/list-item/multiline-dark.svg +1 -1
  117. package/docs/design/templates/list-item/multiline.svg +1 -1
  118. package/docs/design/templates/list-item/selected-dark.svg +1 -1
  119. package/docs/design/templates/list-item/selected.svg +1 -1
  120. package/docs/design/templates/list-item/trailing-dark.svg +1 -1
  121. package/docs/design/templates/list-item/trailing.svg +1 -1
  122. package/docs/design/templates/list-item-dark.svg +1 -11
  123. package/docs/design/templates/list-item.svg +1 -11
  124. package/docs/design/templates/list.svg +1 -0
  125. package/docs/design/templates/panel-header/icon-actions-dark.svg +1 -1
  126. package/docs/design/templates/panel-header/icon-actions.svg +1 -1
  127. package/docs/design/templates/panel-header/icon-summary-actions-dark.svg +1 -1
  128. package/docs/design/templates/panel-header/icon-summary-actions.svg +1 -1
  129. package/docs/design/templates/panel-header-dark.svg +1 -13
  130. package/docs/design/templates/panel-header.svg +1 -13
  131. package/docs/design/templates/segmented-control-dark.svg +1 -7
  132. package/docs/design/templates/segmented-control.svg +1 -7
  133. package/docs/design/templates/skeleton-dark.svg +1 -9
  134. package/docs/design/templates/skeleton.svg +1 -9
  135. package/docs/design/templates/state-banner/danger-dark.svg +1 -1
  136. package/docs/design/templates/state-banner/danger.svg +1 -1
  137. package/docs/design/templates/state-banner/info-badge-dark.svg +1 -0
  138. package/docs/design/templates/state-banner/info-badge.svg +1 -0
  139. package/docs/design/templates/state-banner/info-dark.svg +1 -1
  140. package/docs/design/templates/state-banner/info.svg +1 -1
  141. package/docs/design/templates/state-banner/success-dark.svg +1 -1
  142. package/docs/design/templates/state-banner/success.svg +1 -1
  143. package/docs/design/templates/state-banner/warning-dark.svg +1 -1
  144. package/docs/design/templates/state-banner/warning.svg +1 -1
  145. package/docs/design/templates/state-banner-dark.svg +1 -11
  146. package/docs/design/templates/state-banner.svg +1 -11
  147. package/docs/design/templates/tab-bar/workspace-tabs-dark.svg +1 -1
  148. package/docs/design/templates/tab-bar/workspace-tabs.svg +1 -1
  149. package/docs/design/templates/tab-bar-dark.svg +1 -5
  150. package/docs/design/templates/tab-bar.svg +1 -5
  151. package/docs/design/templates/token-search-field/empty-dark.svg +1 -1
  152. package/docs/design/templates/token-search-field/empty.svg +1 -1
  153. package/docs/design/templates/token-search-field/tokens-dark.svg +1 -1
  154. package/docs/design/templates/token-search-field/tokens.svg +1 -1
  155. package/docs/design/templates/token-search-field-dark.svg +1 -7
  156. package/docs/design/templates/token-search-field.svg +1 -7
  157. package/docs/design/templates/toolbar/title-and-actions-dark.svg +1 -1
  158. package/docs/design/templates/toolbar/title-and-actions.svg +1 -1
  159. package/docs/design/templates/toolbar-control-group/borderless-single-dark.svg +1 -1
  160. package/docs/design/templates/toolbar-control-group/borderless-single.svg +1 -1
  161. package/docs/design/templates/toolbar-control-group/icon-buttons-dark.svg +1 -1
  162. package/docs/design/templates/toolbar-control-group/icon-buttons.svg +1 -1
  163. package/docs/design/templates/toolbar-control-group/push-buttons-dark.svg +1 -1
  164. package/docs/design/templates/toolbar-control-group/push-buttons.svg +1 -1
  165. package/docs/design/templates/toolbar-control-group/with-text-dark.svg +1 -1
  166. package/docs/design/templates/toolbar-control-group/with-text.svg +1 -1
  167. package/docs/design/templates/toolbar-control-group-dark.svg +1 -11
  168. package/docs/design/templates/toolbar-control-group.svg +1 -11
  169. package/docs/design/templates/toolbar-dark.svg +1 -5
  170. package/docs/design/templates/toolbar-text-dark.svg +1 -9
  171. package/docs/design/templates/toolbar-text.svg +1 -9
  172. package/docs/design/templates/toolbar.svg +1 -5
  173. package/docs/design/templates/value-table/details-dark.svg +1 -1
  174. package/docs/design/templates/value-table/details.svg +1 -1
  175. package/docs/design/templates/value-table-dark.svg +1 -5
  176. package/docs/design/templates/value-table.svg +1 -5
  177. package/docs/design/templates.md +25 -14
  178. package/docs/sunken-panel.md +11 -1
  179. package/docs/type-contracts.md +6 -3
  180. package/docs/ui-doctor.md +6 -4
  181. package/docs/ux-demo.md +1 -1
  182. package/doctor/index.mjs +5 -2
  183. package/llms.txt +15 -3
  184. package/package.json +8 -2
  185. package/traversal-exclusions.mjs +7 -1
  186. package/ux-demo/recipes/collapsible-sidebar.tsx +1 -1
  187. package/ux-demo/recipes/navigation-sidebar.tsx +1 -1
  188. package/dist/chunk-7L6EHUMV.js.map +0 -1
  189. package/dist/chunk-AASLYRGE.js.map +0 -1
  190. package/dist/chunk-GP5DP5DL.js.map +0 -1
  191. package/dist/chunk-PZQVSDLH.js.map +0 -1
  192. package/dist/chunk-VLYV65LK.js.map +0 -1
  193. package/dist/chunk-W4CXQYSG.js.map +0 -1
package/docs/design/templates/toolbar-control-group-dark.svg CHANGED
@@ -1,11 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="552" height="552" viewBox="0 0 552 552">
2
- <rect width="552" height="552" fill="#1c1c1e"/>
3
- <text x="16" y="30" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#aeaeb2">Bordered group of icon buttons</text>
4
- <svg x="16" y="38" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 520 96" width="520" height="96"><defs><clipPath id="v0-cp0"><rect x="34" y="34" width="16" height="16"/></clipPath><clipPath id="v0-cp1"><rect x="74" y="34" width="16" height="16"/></clipPath><clipPath id="v0-cp2"><rect x="114" y="34" width="16" height="16"/></clipPath></defs><rect x="20" y="20" width="124" height="44" rx="22" fill="rgb(58,58,60)"/><rect x="20.5" y="20.5" width="123" height="43" rx="21.5" fill="none" stroke="rgb(72,72,74)" stroke-width="1"/><rect x="22.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v0-cp0)"><g transform="translate(34 34)" color="rgb(174, 174, 178)"><svg data-lucide="list" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="16" height="16"><path d="M3 5z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 12z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 19z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 5h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 12h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 19h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g><rect x="62.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v0-cp1)"><g transform="translate(74 34)" color="rgb(174, 174, 178)"><svg data-lucide="columns-3" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="16" height="16"><rect width="18" height="18" x="3" y="3" rx="2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M15 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g><rect x="102.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v0-cp2)"><g transform="translate(114 34)" color="rgb(174, 174, 178)"><svg data-lucide="settings" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="16" height="16"><path d="M9.7 4.1a2.3 2.3 0 0 1 4.6 0 2.3 2.3 0 0 0 3.3 2 2.3 2.3 0 0 1 2.4 4 2.3 2.3 0 0 0 0 3.8 2.3 2.3 0 0 1-2.4 4 2.3 2.3 0 0 0-3.3 2 2.3 2.3 0 0 1-4.6 0 2.3 2.3 0 0 0-3.3-2A2.3 2.3 0 0 1 4 14a2.3 2.3 0 0 0 0-3.8 2.3 2.3 0 0 1 2.3-4 2.3 2.3 0 0 0 3.4-2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><circle cx="12" cy="12" r="3" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g></svg>
5
- <text x="16" y="164" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#aeaeb2">Borderless single control</text>
6
- <svg x="16" y="172" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 520 96" width="520" height="96"><defs><clipPath id="v1-cp0"><rect x="34" y="34" width="16" height="16"/></clipPath></defs><rect x="20.5" y="20.5" width="43" height="43" rx="21.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><rect x="22.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v1-cp0)"><g transform="translate(34 34)" color="rgb(174, 174, 178)"><svg data-lucide="plus" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="16" height="16"><path d="M5 12h14" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M12 5v14" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g></svg>
7
- <text x="16" y="298" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#aeaeb2">Label text beside a control</text>
8
- <svg x="16" y="306" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 520 96" width="520" height="96"><defs><clipPath id="v2-cp0"><rect x="22" y="22" width="80.8" height="40"/></clipPath><clipPath id="v2-ov1"><rect x="22" y="22" width="80.8" height="40" rx="0"/></clipPath><clipPath id="v2-cp2"><rect x="30" y="36" width="64.8" height="12"/></clipPath><clipPath id="v2-ct3"><rect x="30" y="36" width="64.8" height="12"/></clipPath><clipPath id="v2-cp4"><rect x="114.8" y="34" width="16.2" height="16"/></clipPath></defs><rect x="20.5" y="20.5" width="124" height="43" rx="21.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v2-cp0)"><g clip-path="url(#v2-ov1)"><g clip-path="url(#v2-cp2)"><g clip-path="url(#v2-ct3)"><text x="30" y="45" font-family="&quot;Courier New&quot;, monospace" font-size="12" font-weight="650" fill="rgb(174,174,178)">Workspace</text></g></g></g></g><rect x="103.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v2-cp4)"><g transform="translate(114.8 34)" color="rgb(174, 174, 178)"><svg data-lucide="bell" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="16" height="16"><path d="M10.3 21a2 2 0 0 0 3.4 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3.3 15.3A1 1 0 0 0 4 17h16a1 1 0 0 0 .7-1.7C19.4 14 18 12.5 18 8A6 6 0 0 0 6 8c0 4.5-1.4 6-2.7 7.3" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g></svg>
9
- <text x="16" y="432" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#aeaeb2">Push-appearance buttons</text>
10
- <svg x="16" y="440" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 520 96" width="520" height="96"><defs><clipPath id="v3-cp0"><rect x="34" y="34" width="16" height="16"/></clipPath><clipPath id="v3-cp1"><rect x="74" y="34" width="16" height="16"/></clipPath></defs><rect x="20" y="20" width="84" height="44" rx="22" fill="rgb(58,58,60)"/><rect x="20.5" y="20.5" width="83" height="43" rx="21.5" fill="none" stroke="rgb(72,72,74)" stroke-width="1"/><rect x="22.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v3-cp0)"><g transform="translate(34 34)" color="rgb(174, 174, 178)"><svg data-lucide="list" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="16" height="16"><path d="M3 5z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 12z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 19z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 5h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 12h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 19h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g><rect x="62.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v3-cp1)"><g transform="translate(74 34)" color="rgb(174, 174, 178)"><svg data-lucide="columns-3" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="16" height="16"><rect width="18" height="18" x="3" y="3" rx="2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M15 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g></svg>
11
- </svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 552 552" width="552" height="552"><defs><clipPath id="cp0"><rect x="16" y="38" width="520" height="96"/></clipPath><clipPath id="cp1"><rect x="16" y="172" width="520" height="96"/></clipPath><clipPath id="cp2"><rect x="16" y="306" width="520" height="96"/></clipPath><clipPath id="cp3"><rect x="16" y="440" width="520" height="96"/></clipPath><clipPath id="ct4"><rect x="16" y="16" width="520" height="22"/></clipPath><clipPath id="irc5"><rect x="16" y="38" width="520" height="96" rx="0"/></clipPath><clipPath id="ct7"><rect x="16" y="150" width="520" height="22"/></clipPath><clipPath id="irc8"><rect x="16" y="172" width="520" height="96" rx="0"/></clipPath><clipPath id="ct10"><rect x="16" y="284" width="520" height="22"/></clipPath><clipPath id="irc11"><rect x="16" y="306" width="520" height="96" rx="0"/></clipPath><clipPath id="ct13"><rect x="16" y="418" width="520" height="22"/></clipPath><clipPath id="irc14"><rect x="16" y="440" width="520" height="96" rx="0"/></clipPath></defs><rect x="0" y="0" width="552" height="552" rx="0" fill="rgb(28,28,30)"/><text x="16" y="28" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(174,174,178)">Bordered group of icon buttons</text><g clip-path="url(#cp0)"><g clip-path="url(#irc5)"><clipPath id="svgimg6vclip"><rect x="16" y="38" width="520" height="96"/></clipPath><g clip-path="url(#svgimg6vclip)"><g transform="translate(16 38)"><defs><clipPath id="svgimg6cp0"><rect x="34" y="34" width="16" height="16"/></clipPath><clipPath id="svgimg6cp2"><rect x="74" y="34" width="16" height="16"/></clipPath><clipPath id="svgimg6cp4"><rect x="114" y="34" width="16" height="16"/></clipPath></defs><rect x="20" y="20" width="124" height="44" rx="22" fill="rgb(58,58,60)"/><rect x="20.5" y="20.5" width="123" height="43" rx="21.5" fill="none" stroke="rgb(72,72,74)" stroke-width="1"/><rect x="22.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg6cp0)"><g color="rgb(174, 174, 178)"><clipPath id="svgimg6svgic1"><rect x="34" y="34" width="16" height="16"/></clipPath><g clip-path="url(#svgimg6svgic1)"><g transform="translate(34 34)scale(.66667)"><path d="M3 5z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 12z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 19z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 5h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 12h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 19h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="62.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg6cp2)"><g color="rgb(174, 174, 178)"><clipPath id="svgimg6svgic3"><rect x="74" y="34" width="16" height="16"/></clipPath><g clip-path="url(#svgimg6svgic3)"><g transform="translate(74 34)scale(.66667)"><rect width="18" height="18" x="3" y="3" rx="2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M15 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="102.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg6cp4)"><g color="rgb(174, 174, 178)"><clipPath id="svgimg6svgic5"><rect x="114" y="34" width="16" height="16"/></clipPath><g clip-path="url(#svgimg6svgic5)"><g transform="translate(114 34)scale(.66667)"><path d="M9.7 4.1a2.3 2.3 0 0 1 4.6 0 2.3 2.3 0 0 0 3.3 2 2.3 2.3 0 0 1 2.4 4 2.3 2.3 0 0 0 0 3.8 2.3 2.3 0 0 1-2.4 4 2.3 2.3 0 0 0-3.3 2 2.3 2.3 0 0 1-4.6 0 2.3 2.3 0 0 0-3.3-2A2.3 2.3 0 0 1 4 14a2.3 2.3 0 0 0 0-3.8 2.3 2.3 0 0 1 2.3-4 2.3 2.3 0 0 0 3.4-2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><circle cx="12" cy="12" r="3" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g></g></g></g></g><text x="16" y="162" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(174,174,178)">Borderless single control</text><g clip-path="url(#cp1)"><g clip-path="url(#irc8)"><clipPath id="svgimg9vclip"><rect x="16" y="172" width="520" height="96"/></clipPath><g clip-path="url(#svgimg9vclip)"><g transform="translate(16 172)"><defs><clipPath id="svgimg9cp0"><rect x="34" y="34" width="16" height="16"/></clipPath></defs><rect x="20.5" y="20.5" width="43" height="43" rx="21.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><rect x="22.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg9cp0)"><g color="rgb(174, 174, 178)"><clipPath id="svgimg9svgic1"><rect x="34" y="34" width="16" height="16"/></clipPath><g clip-path="url(#svgimg9svgic1)"><g transform="translate(34 34)scale(.66667)"><path d="M5 12h14" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M12 5v14" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g></g></g></g></g><text x="16" y="296" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(174,174,178)">Label text beside a control</text><g clip-path="url(#cp2)"><g clip-path="url(#irc11)"><clipPath id="svgimg12vclip"><rect x="16" y="306" width="520" height="96"/></clipPath><g clip-path="url(#svgimg12vclip)"><g transform="translate(16 306)"><defs><clipPath id="svgimg12cp0"><rect x="22" y="22" width="80.8" height="40"/></clipPath><clipPath id="svgimg12ov1"><rect x="22" y="22" width="80.8" height="40" rx="0"/></clipPath><clipPath id="svgimg12cp2"><rect x="30" y="36" width="64.8" height="12"/></clipPath><clipPath id="svgimg12ct3"><rect x="30" y="36" width="64.8" height="12"/></clipPath><clipPath id="svgimg12cp4"><rect x="114.8" y="34" width="16.2" height="16"/></clipPath></defs><rect x="20.5" y="20.5" width="124" height="43" rx="21.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg12cp0)"><g clip-path="url(#svgimg12ov1)"><g clip-path="url(#svgimg12cp2)"><g clip-path="url(#svgimg12ct3)"><text x="30" y="45" font-family="&quot;Courier New&quot;, monospace" font-size="12" font-weight="650" fill="rgb(174,174,178)">Workspace</text></g></g></g></g><rect x="103.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg12cp4)"><g color="rgb(174, 174, 178)"><clipPath id="svgimg12svgic5"><rect x="114.8" y="34" width="16" height="16"/></clipPath><g clip-path="url(#svgimg12svgic5)"><g transform="translate(114.813 34)scale(.66667)"><path d="M10.3 21a2 2 0 0 0 3.4 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3.3 15.3A1 1 0 0 0 4 17h16a1 1 0 0 0 .7-1.7C19.4 14 18 12.5 18 8A6 6 0 0 0 6 8c0 4.5-1.4 6-2.7 7.3" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g></g></g></g></g><text x="16" y="430" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(174,174,178)">Push-appearance buttons</text><g clip-path="url(#cp3)"><g clip-path="url(#irc14)"><clipPath id="svgimg15vclip"><rect x="16" y="440" width="520" height="96"/></clipPath><g clip-path="url(#svgimg15vclip)"><g transform="translate(16 440)"><defs><clipPath id="svgimg15cp0"><rect x="34" y="34" width="16" height="16"/></clipPath><clipPath id="svgimg15cp2"><rect x="74" y="34" width="16" height="16"/></clipPath></defs><rect x="20" y="20" width="84" height="44" rx="22" fill="rgb(58,58,60)"/><rect x="20.5" y="20.5" width="83" height="43" rx="21.5" fill="none" stroke="rgb(72,72,74)" stroke-width="1"/><rect x="22.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg15cp0)"><g color="rgb(174, 174, 178)"><clipPath id="svgimg15svgic1"><rect x="34" y="34" width="16" height="16"/></clipPath><g clip-path="url(#svgimg15svgic1)"><g transform="translate(34 34)scale(.66667)"><path d="M3 5z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 12z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 19z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 5h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 12h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 19h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="62.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg15cp2)"><g color="rgb(174, 174, 178)"><clipPath id="svgimg15svgic3"><rect x="74" y="34" width="16" height="16"/></clipPath><g clip-path="url(#svgimg15svgic3)"><g transform="translate(74 34)scale(.66667)"><rect width="18" height="18" x="3" y="3" rx="2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M15 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g></g></g></g></g></svg>
package/docs/design/templates/toolbar-control-group.svg CHANGED
@@ -1,11 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="552" height="552" viewBox="0 0 552 552">
2
- <rect width="552" height="552" fill="#ffffff"/>
3
- <text x="16" y="30" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#6e6e73">Bordered group of icon buttons</text>
4
- <svg x="16" y="38" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 520 96" width="520" height="96"><defs><clipPath id="v0-cp0"><rect x="34" y="34" width="16" height="16"/></clipPath><clipPath id="v0-cp1"><rect x="74" y="34" width="16" height="16"/></clipPath><clipPath id="v0-cp2"><rect x="114" y="34" width="16" height="16"/></clipPath></defs><rect x="20" y="20" width="124" height="44" rx="22" fill="rgb(229,229,234)"/><rect x="20.5" y="20.5" width="123" height="43" rx="21.5" fill="none" stroke="rgb(209,209,214)" stroke-width="1"/><rect x="22.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v0-cp0)"><g transform="translate(34 34)" color="rgb(110, 110, 115)"><svg data-lucide="list" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="16" height="16"><path d="M3 5z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 12z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 19z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 5h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 12h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 19h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g><rect x="62.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v0-cp1)"><g transform="translate(74 34)" color="rgb(110, 110, 115)"><svg data-lucide="columns-3" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="16" height="16"><rect width="18" height="18" x="3" y="3" rx="2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M15 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g><rect x="102.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v0-cp2)"><g transform="translate(114 34)" color="rgb(110, 110, 115)"><svg data-lucide="settings" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="16" height="16"><path d="M9.7 4.1a2.3 2.3 0 0 1 4.6 0 2.3 2.3 0 0 0 3.3 2 2.3 2.3 0 0 1 2.4 4 2.3 2.3 0 0 0 0 3.8 2.3 2.3 0 0 1-2.4 4 2.3 2.3 0 0 0-3.3 2 2.3 2.3 0 0 1-4.6 0 2.3 2.3 0 0 0-3.3-2A2.3 2.3 0 0 1 4 14a2.3 2.3 0 0 0 0-3.8 2.3 2.3 0 0 1 2.3-4 2.3 2.3 0 0 0 3.4-2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><circle cx="12" cy="12" r="3" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g></svg>
5
- <text x="16" y="164" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#6e6e73">Borderless single control</text>
6
- <svg x="16" y="172" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 520 96" width="520" height="96"><defs><clipPath id="v1-cp0"><rect x="34" y="34" width="16" height="16"/></clipPath></defs><rect x="20.5" y="20.5" width="43" height="43" rx="21.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><rect x="22.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v1-cp0)"><g transform="translate(34 34)" color="rgb(110, 110, 115)"><svg data-lucide="plus" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="16" height="16"><path d="M5 12h14" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M12 5v14" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g></svg>
7
- <text x="16" y="298" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#6e6e73">Label text beside a control</text>
8
- <svg x="16" y="306" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 520 96" width="520" height="96"><defs><clipPath id="v2-cp0"><rect x="22" y="22" width="80.8" height="40"/></clipPath><clipPath id="v2-ov1"><rect x="22" y="22" width="80.8" height="40" rx="0"/></clipPath><clipPath id="v2-cp2"><rect x="30" y="36" width="64.8" height="12"/></clipPath><clipPath id="v2-ct3"><rect x="30" y="36" width="64.8" height="12"/></clipPath><clipPath id="v2-cp4"><rect x="114.8" y="34" width="16.2" height="16"/></clipPath></defs><rect x="20.5" y="20.5" width="124" height="43" rx="21.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v2-cp0)"><g clip-path="url(#v2-ov1)"><g clip-path="url(#v2-cp2)"><g clip-path="url(#v2-ct3)"><text x="30" y="45" font-family="&quot;Courier New&quot;, monospace" font-size="12" font-weight="650" fill="rgb(110,110,115)">Workspace</text></g></g></g></g><rect x="103.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v2-cp4)"><g transform="translate(114.8 34)" color="rgb(110, 110, 115)"><svg data-lucide="bell" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="16" height="16"><path d="M10.3 21a2 2 0 0 0 3.4 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3.3 15.3A1 1 0 0 0 4 17h16a1 1 0 0 0 .7-1.7C19.4 14 18 12.5 18 8A6 6 0 0 0 6 8c0 4.5-1.4 6-2.7 7.3" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g></svg>
9
- <text x="16" y="432" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#6e6e73">Push-appearance buttons</text>
10
- <svg x="16" y="440" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 520 96" width="520" height="96"><defs><clipPath id="v3-cp0"><rect x="34" y="34" width="16" height="16"/></clipPath><clipPath id="v3-cp1"><rect x="74" y="34" width="16" height="16"/></clipPath></defs><rect x="20" y="20" width="84" height="44" rx="22" fill="rgb(229,229,234)"/><rect x="20.5" y="20.5" width="83" height="43" rx="21.5" fill="none" stroke="rgb(209,209,214)" stroke-width="1"/><rect x="22.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v3-cp0)"><g transform="translate(34 34)" color="rgb(110, 110, 115)"><svg data-lucide="list" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="16" height="16"><path d="M3 5z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 12z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 19z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 5h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 12h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 19h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g><rect x="62.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v3-cp1)"><g transform="translate(74 34)" color="rgb(110, 110, 115)"><svg data-lucide="columns-3" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="16" height="16"><rect width="18" height="18" x="3" y="3" rx="2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M15 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g></svg>
11
- </svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 552 552" width="552" height="552"><defs><clipPath id="cp0"><rect x="16" y="38" width="520" height="96"/></clipPath><clipPath id="cp1"><rect x="16" y="172" width="520" height="96"/></clipPath><clipPath id="cp2"><rect x="16" y="306" width="520" height="96"/></clipPath><clipPath id="cp3"><rect x="16" y="440" width="520" height="96"/></clipPath><clipPath id="ct4"><rect x="16" y="16" width="520" height="22"/></clipPath><clipPath id="irc5"><rect x="16" y="38" width="520" height="96" rx="0"/></clipPath><clipPath id="ct7"><rect x="16" y="150" width="520" height="22"/></clipPath><clipPath id="irc8"><rect x="16" y="172" width="520" height="96" rx="0"/></clipPath><clipPath id="ct10"><rect x="16" y="284" width="520" height="22"/></clipPath><clipPath id="irc11"><rect x="16" y="306" width="520" height="96" rx="0"/></clipPath><clipPath id="ct13"><rect x="16" y="418" width="520" height="22"/></clipPath><clipPath id="irc14"><rect x="16" y="440" width="520" height="96" rx="0"/></clipPath></defs><rect x="0" y="0" width="552" height="552" rx="0" fill="rgb(255,255,255)"/><text x="16" y="28" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(110,110,115)">Bordered group of icon buttons</text><g clip-path="url(#cp0)"><g clip-path="url(#irc5)"><clipPath id="svgimg6vclip"><rect x="16" y="38" width="520" height="96"/></clipPath><g clip-path="url(#svgimg6vclip)"><g transform="translate(16 38)"><defs><clipPath id="svgimg6cp0"><rect x="34" y="34" width="16" height="16"/></clipPath><clipPath id="svgimg6cp2"><rect x="74" y="34" width="16" height="16"/></clipPath><clipPath id="svgimg6cp4"><rect x="114" y="34" width="16" height="16"/></clipPath></defs><rect x="20" y="20" width="124" height="44" rx="22" fill="rgb(229,229,234)"/><rect x="20.5" y="20.5" width="123" height="43" rx="21.5" fill="none" stroke="rgb(209,209,214)" stroke-width="1"/><rect x="22.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg6cp0)"><g color="rgb(110, 110, 115)"><clipPath id="svgimg6svgic1"><rect x="34" y="34" width="16" height="16"/></clipPath><g clip-path="url(#svgimg6svgic1)"><g transform="translate(34 34)scale(.66667)"><path d="M3 5z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 12z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 19z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 5h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 12h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 19h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="62.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg6cp2)"><g color="rgb(110, 110, 115)"><clipPath id="svgimg6svgic3"><rect x="74" y="34" width="16" height="16"/></clipPath><g clip-path="url(#svgimg6svgic3)"><g transform="translate(74 34)scale(.66667)"><rect width="18" height="18" x="3" y="3" rx="2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M15 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="102.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg6cp4)"><g color="rgb(110, 110, 115)"><clipPath id="svgimg6svgic5"><rect x="114" y="34" width="16" height="16"/></clipPath><g clip-path="url(#svgimg6svgic5)"><g transform="translate(114 34)scale(.66667)"><path d="M9.7 4.1a2.3 2.3 0 0 1 4.6 0 2.3 2.3 0 0 0 3.3 2 2.3 2.3 0 0 1 2.4 4 2.3 2.3 0 0 0 0 3.8 2.3 2.3 0 0 1-2.4 4 2.3 2.3 0 0 0-3.3 2 2.3 2.3 0 0 1-4.6 0 2.3 2.3 0 0 0-3.3-2A2.3 2.3 0 0 1 4 14a2.3 2.3 0 0 0 0-3.8 2.3 2.3 0 0 1 2.3-4 2.3 2.3 0 0 0 3.4-2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><circle cx="12" cy="12" r="3" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g></g></g></g></g><text x="16" y="162" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(110,110,115)">Borderless single control</text><g clip-path="url(#cp1)"><g clip-path="url(#irc8)"><clipPath id="svgimg9vclip"><rect x="16" y="172" width="520" height="96"/></clipPath><g clip-path="url(#svgimg9vclip)"><g transform="translate(16 172)"><defs><clipPath id="svgimg9cp0"><rect x="34" y="34" width="16" height="16"/></clipPath></defs><rect x="20.5" y="20.5" width="43" height="43" rx="21.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><rect x="22.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg9cp0)"><g color="rgb(110, 110, 115)"><clipPath id="svgimg9svgic1"><rect x="34" y="34" width="16" height="16"/></clipPath><g clip-path="url(#svgimg9svgic1)"><g transform="translate(34 34)scale(.66667)"><path d="M5 12h14" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M12 5v14" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g></g></g></g></g><text x="16" y="296" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(110,110,115)">Label text beside a control</text><g clip-path="url(#cp2)"><g clip-path="url(#irc11)"><clipPath id="svgimg12vclip"><rect x="16" y="306" width="520" height="96"/></clipPath><g clip-path="url(#svgimg12vclip)"><g transform="translate(16 306)"><defs><clipPath id="svgimg12cp0"><rect x="22" y="22" width="80.8" height="40"/></clipPath><clipPath id="svgimg12ov1"><rect x="22" y="22" width="80.8" height="40" rx="0"/></clipPath><clipPath id="svgimg12cp2"><rect x="30" y="36" width="64.8" height="12"/></clipPath><clipPath id="svgimg12ct3"><rect x="30" y="36" width="64.8" height="12"/></clipPath><clipPath id="svgimg12cp4"><rect x="114.8" y="34" width="16.2" height="16"/></clipPath></defs><rect x="20.5" y="20.5" width="124" height="43" rx="21.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg12cp0)"><g clip-path="url(#svgimg12ov1)"><g clip-path="url(#svgimg12cp2)"><g clip-path="url(#svgimg12ct3)"><text x="30" y="45" font-family="&quot;Courier New&quot;, monospace" font-size="12" font-weight="650" fill="rgb(110,110,115)">Workspace</text></g></g></g></g><rect x="103.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg12cp4)"><g color="rgb(110, 110, 115)"><clipPath id="svgimg12svgic5"><rect x="114.8" y="34" width="16" height="16"/></clipPath><g clip-path="url(#svgimg12svgic5)"><g transform="translate(114.813 34)scale(.66667)"><path d="M10.3 21a2 2 0 0 0 3.4 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3.3 15.3A1 1 0 0 0 4 17h16a1 1 0 0 0 .7-1.7C19.4 14 18 12.5 18 8A6 6 0 0 0 6 8c0 4.5-1.4 6-2.7 7.3" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g></g></g></g></g><text x="16" y="430" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(110,110,115)">Push-appearance buttons</text><g clip-path="url(#cp3)"><g clip-path="url(#irc14)"><clipPath id="svgimg15vclip"><rect x="16" y="440" width="520" height="96"/></clipPath><g clip-path="url(#svgimg15vclip)"><g transform="translate(16 440)"><defs><clipPath id="svgimg15cp0"><rect x="34" y="34" width="16" height="16"/></clipPath><clipPath id="svgimg15cp2"><rect x="74" y="34" width="16" height="16"/></clipPath></defs><rect x="20" y="20" width="84" height="44" rx="22" fill="rgb(229,229,234)"/><rect x="20.5" y="20.5" width="83" height="43" rx="21.5" fill="none" stroke="rgb(209,209,214)" stroke-width="1"/><rect x="22.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg15cp0)"><g color="rgb(110, 110, 115)"><clipPath id="svgimg15svgic1"><rect x="34" y="34" width="16" height="16"/></clipPath><g clip-path="url(#svgimg15svgic1)"><g transform="translate(34 34)scale(.66667)"><path d="M3 5z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 12z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 19z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 5h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 12h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 19h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="62.5" y="22.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg15cp2)"><g color="rgb(110, 110, 115)"><clipPath id="svgimg15svgic3"><rect x="74" y="34" width="16" height="16"/></clipPath><g clip-path="url(#svgimg15svgic3)"><g transform="translate(74 34)scale(.66667)"><rect width="18" height="18" x="3" y="3" rx="2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M15 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g></g></g></g></g></svg>
package/docs/design/templates/toolbar-dark.svg CHANGED
@@ -1,5 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="672" height="158" viewBox="0 0 672 158">
2
- <rect width="672" height="158" fill="#1c1c1e"/>
3
- <text x="16" y="30" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#aeaeb2">Title with a trailing group</text>
4
- <svg x="16" y="38" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 104" width="640" height="104"><defs><clipPath id="v0-cp0"><rect x="28" y="28" width="452" height="44"/></clipPath><clipPath id="v0-ov1"><rect x="28" y="28" width="452" height="44" rx="0"/></clipPath><clipPath id="v0-cp2"><rect x="30" y="30" width="88.1" height="40"/></clipPath><clipPath id="v0-ov3"><rect x="30" y="30" width="88.1" height="40" rx="0"/></clipPath><clipPath id="v0-cp4"><rect x="38" y="42" width="72.1" height="16"/></clipPath><clipPath id="v0-ct5"><rect x="38" y="42" width="72.1" height="16"/></clipPath><clipPath id="v0-cp6"><rect x="502" y="42" width="16" height="16"/></clipPath><clipPath id="v0-cp7"><rect x="542" y="42" width="16" height="16"/></clipPath><clipPath id="v0-cp8"><rect x="582" y="42" width="16" height="16"/></clipPath></defs><g clip-path="url(#v0-cp0)"><g clip-path="url(#v0-ov1)"><rect x="28.5" y="28.5" width="91" height="43" rx="21.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v0-cp2)"><g clip-path="url(#v0-ov3)"><g clip-path="url(#v0-cp4)"><g clip-path="url(#v0-ct5)"><text x="38" y="56" font-family="&quot;ui-sans-serif&quot;, &quot;-apple-system&quot;, &quot;system-ui&quot;, &quot;Segoe UI&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(174,174,178)">Northstar</text></g></g></g></g></g></g><rect x="488" y="28" width="124" height="44" rx="22" fill="rgb(58,58,60)"/><rect x="488.5" y="28.5" width="123" height="43" rx="21.5" fill="none" stroke="rgb(72,72,74)" stroke-width="1"/><rect x="490.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v0-cp6)"><g transform="translate(502 42)" color="rgb(174, 174, 178)"><svg data-lucide="list" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="ui-sans-serif, -apple-system, &quot;system-ui&quot;, &quot;Segoe UI&quot;, sans-serif" style="overflow:hidden" width="16" height="16"><path d="M3 5z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 12z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 19z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 5h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 12h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 19h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g><rect x="530.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v0-cp7)"><g transform="translate(542 42)" color="rgb(174, 174, 178)"><svg data-lucide="columns-3" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="ui-sans-serif, -apple-system, &quot;system-ui&quot;, &quot;Segoe UI&quot;, sans-serif" style="overflow:hidden" width="16" height="16"><rect width="18" height="18" x="3" y="3" rx="2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M15 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g><rect x="570.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v0-cp8)"><g transform="translate(582 42)" color="rgb(174, 174, 178)"><svg data-lucide="settings" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="ui-sans-serif, -apple-system, &quot;system-ui&quot;, &quot;Segoe UI&quot;, sans-serif" style="overflow:hidden" width="16" height="16"><path d="M9.7 4.1a2.3 2.3 0 0 1 4.6 0 2.3 2.3 0 0 0 3.3 2 2.3 2.3 0 0 1 2.4 4 2.3 2.3 0 0 0 0 3.8 2.3 2.3 0 0 1-2.4 4 2.3 2.3 0 0 0-3.3 2 2.3 2.3 0 0 1-4.6 0 2.3 2.3 0 0 0-3.3-2A2.3 2.3 0 0 1 4 14a2.3 2.3 0 0 0 0-3.8 2.3 2.3 0 0 1 2.3-4 2.3 2.3 0 0 0 3.4-2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><circle cx="12" cy="12" r="3" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g></svg>
5
- </svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 672 158" width="672" height="158"><defs><clipPath id="cp0"><rect x="16" y="38" width="640" height="104"/></clipPath><clipPath id="ct1"><rect x="16" y="16" width="640" height="22"/></clipPath><clipPath id="irc2"><rect x="16" y="38" width="640" height="104" rx="0"/></clipPath></defs><rect x="0" y="0" width="672" height="158" rx="0" fill="rgb(28,28,30)"/><text x="16" y="28" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(174,174,178)">Title with a trailing group</text><g clip-path="url(#cp0)"><g clip-path="url(#irc2)"><clipPath id="svgimg3vclip"><rect x="16" y="38" width="640" height="104"/></clipPath><g clip-path="url(#svgimg3vclip)"><g transform="translate(16 38)"><defs><clipPath id="svgimg3cp0"><rect x="28" y="28" width="452" height="44"/></clipPath><clipPath id="svgimg3ov1"><rect x="28" y="28" width="452" height="44" rx="0"/></clipPath><clipPath id="svgimg3cp2"><rect x="30" y="30" width="88.1" height="40"/></clipPath><clipPath id="svgimg3ov3"><rect x="30" y="30" width="88.1" height="40" rx="0"/></clipPath><clipPath id="svgimg3cp4"><rect x="38" y="42" width="72.1" height="16"/></clipPath><clipPath id="svgimg3ct5"><rect x="38" y="42" width="72.1" height="16"/></clipPath><clipPath id="svgimg3cp6"><rect x="502" y="42" width="16" height="16"/></clipPath><clipPath id="svgimg3cp8"><rect x="542" y="42" width="16" height="16"/></clipPath><clipPath id="svgimg3cp10"><rect x="582" y="42" width="16" height="16"/></clipPath></defs><g clip-path="url(#svgimg3cp0)"><g clip-path="url(#svgimg3ov1)"><rect x="28.5" y="28.5" width="91" height="43" rx="21.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg3cp2)"><g clip-path="url(#svgimg3ov3)"><g clip-path="url(#svgimg3cp4)"><g clip-path="url(#svgimg3ct5)"><text x="38" y="56" font-family="&quot;ui-sans-serif&quot;, &quot;-apple-system&quot;, &quot;system-ui&quot;, &quot;Segoe UI&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(174,174,178)">Northstar</text></g></g></g></g></g></g><rect x="488" y="28" width="124" height="44" rx="22" fill="rgb(58,58,60)"/><rect x="488.5" y="28.5" width="123" height="43" rx="21.5" fill="none" stroke="rgb(72,72,74)" stroke-width="1"/><rect x="490.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg3cp6)"><g color="rgb(174, 174, 178)"><clipPath id="svgimg3svgic7"><rect x="502" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgimg3svgic7)"><g transform="translate(502 42)scale(.66667)"><path d="M3 5z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 12z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 19z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 5h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 12h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 19h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="530.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg3cp8)"><g color="rgb(174, 174, 178)"><clipPath id="svgimg3svgic9"><rect x="542" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgimg3svgic9)"><g transform="translate(542 42)scale(.66667)"><rect width="18" height="18" x="3" y="3" rx="2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M15 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="570.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg3cp10)"><g color="rgb(174, 174, 178)"><clipPath id="svgimg3svgic11"><rect x="582" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgimg3svgic11)"><g transform="translate(582 42)scale(.66667)"><path d="M9.7 4.1a2.3 2.3 0 0 1 4.6 0 2.3 2.3 0 0 0 3.3 2 2.3 2.3 0 0 1 2.4 4 2.3 2.3 0 0 0 0 3.8 2.3 2.3 0 0 1-2.4 4 2.3 2.3 0 0 0-3.3 2 2.3 2.3 0 0 1-4.6 0 2.3 2.3 0 0 0-3.3-2A2.3 2.3 0 0 1 4 14a2.3 2.3 0 0 0 0-3.8 2.3 2.3 0 0 1 2.3-4 2.3 2.3 0 0 0 3.4-2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><circle cx="12" cy="12" r="3" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g></g></g></g></g></svg>
package/docs/design/templates/toolbar-text-dark.svg CHANGED
@@ -1,9 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="392" height="358" viewBox="0 0 392 358">
2
- <rect width="392" height="358" fill="#1c1c1e"/>
3
- <text x="16" y="30" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#aeaeb2">Large (title)</text>
4
- <svg x="16" y="38" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 360 80" width="360" height="80"><defs><clipPath id="v0-cp0"><rect x="20" y="20" width="163" height="40"/></clipPath><clipPath id="v0-ov1"><rect x="20" y="20" width="163" height="40" rx="0"/></clipPath><clipPath id="v0-cp2"><rect x="28" y="32" width="147" height="16"/></clipPath><clipPath id="v0-ct3"><rect x="28" y="32" width="147" height="16"/></clipPath></defs><g clip-path="url(#v0-cp0)"><g clip-path="url(#v0-ov1)"><g clip-path="url(#v0-cp2)"><g clip-path="url(#v0-ct3)"><text x="28" y="46" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(174,174,178)">Northstar migration</text></g></g></g></g></svg>
5
- <text x="16" y="148" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#aeaeb2">Default</text>
6
- <svg x="16" y="156" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 360 76" width="360" height="76"><defs><clipPath id="v1-cp0"><rect x="20" y="20" width="151.2" height="40"/></clipPath><clipPath id="v1-ov1"><rect x="20" y="20" width="151.2" height="40" rx="0"/></clipPath><clipPath id="v1-cp2"><rect x="28" y="33" width="135.2" height="14"/></clipPath><clipPath id="v1-ct3"><rect x="28" y="33" width="135.2" height="14"/></clipPath></defs><g clip-path="url(#v1-cp0)"><g clip-path="url(#v1-ov1)"><g clip-path="url(#v1-cp2)"><g clip-path="url(#v1-ct3)"><text x="28" y="45" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="14" font-weight="650" fill="rgb(174,174,178)">Workspace settings</text></g></g></g></g></svg>
7
- <text x="16" y="262" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#aeaeb2">Small (label)</text>
8
- <svg x="16" y="270" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 360 72" width="360" height="72"><defs><clipPath id="v2-cp0"><rect x="20" y="20" width="66.4" height="40"/></clipPath><clipPath id="v2-ov1"><rect x="20" y="20" width="66.4" height="40" rx="0"/></clipPath><clipPath id="v2-cp2"><rect x="28" y="34" width="50.4" height="12"/></clipPath><clipPath id="v2-ct3"><rect x="28" y="34" width="50.4" height="12"/></clipPath></defs><g clip-path="url(#v2-cp0)"><g clip-path="url(#v2-ov1)"><g clip-path="url(#v2-cp2)"><g clip-path="url(#v2-ct3)"><text x="28" y="43" font-family="&quot;Courier New&quot;, monospace" font-size="12" font-weight="650" fill="rgb(174,174,178)">Filters</text></g></g></g></g></svg>
9
- </svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 392 358" width="392" height="358"><defs><clipPath id="cp0"><rect x="16" y="38" width="360" height="80"/></clipPath><clipPath id="cp1"><rect x="16" y="156" width="360" height="76"/></clipPath><clipPath id="cp2"><rect x="16" y="270" width="360" height="72"/></clipPath><clipPath id="ct3"><rect x="16" y="16" width="360" height="22"/></clipPath><clipPath id="irc4"><rect x="16" y="38" width="360" height="80" rx="0"/></clipPath><clipPath id="ct6"><rect x="16" y="134" width="360" height="22"/></clipPath><clipPath id="irc7"><rect x="16" y="156" width="360" height="76" rx="0"/></clipPath><clipPath id="ct9"><rect x="16" y="248" width="360" height="22"/></clipPath><clipPath id="irc10"><rect x="16" y="270" width="360" height="72" rx="0"/></clipPath></defs><rect x="0" y="0" width="392" height="358" rx="0" fill="rgb(28,28,30)"/><text x="16" y="28" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(174,174,178)">Large (title)</text><g clip-path="url(#cp0)"><g clip-path="url(#irc4)"><clipPath id="svgimg5vclip"><rect x="16" y="38" width="360" height="80"/></clipPath><g clip-path="url(#svgimg5vclip)"><g transform="translate(16 38)"><defs><clipPath id="svgimg5cp0"><rect x="20" y="20" width="163" height="40"/></clipPath><clipPath id="svgimg5ov1"><rect x="20" y="20" width="163" height="40" rx="0"/></clipPath><clipPath id="svgimg5cp2"><rect x="28" y="32" width="147" height="16"/></clipPath><clipPath id="svgimg5ct3"><rect x="28" y="32" width="147" height="16"/></clipPath></defs><g clip-path="url(#svgimg5cp0)"><g clip-path="url(#svgimg5ov1)"><g clip-path="url(#svgimg5cp2)"><g clip-path="url(#svgimg5ct3)"><text x="28" y="46" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(174,174,178)">Northstar migration</text></g></g></g></g></g></g></g></g><text x="16" y="146" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(174,174,178)">Default</text><g clip-path="url(#cp1)"><g clip-path="url(#irc7)"><clipPath id="svgimg8vclip"><rect x="16" y="156" width="360" height="76"/></clipPath><g clip-path="url(#svgimg8vclip)"><g transform="translate(16 156)"><defs><clipPath id="svgimg8cp0"><rect x="20" y="20" width="151.2" height="40"/></clipPath><clipPath id="svgimg8ov1"><rect x="20" y="20" width="151.2" height="40" rx="0"/></clipPath><clipPath id="svgimg8cp2"><rect x="28" y="33" width="135.2" height="14"/></clipPath><clipPath id="svgimg8ct3"><rect x="28" y="33" width="135.2" height="14"/></clipPath></defs><g clip-path="url(#svgimg8cp0)"><g clip-path="url(#svgimg8ov1)"><g clip-path="url(#svgimg8cp2)"><g clip-path="url(#svgimg8ct3)"><text x="28" y="45" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="14" font-weight="650" fill="rgb(174,174,178)">Workspace settings</text></g></g></g></g></g></g></g></g><text x="16" y="260" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(174,174,178)">Small (label)</text><g clip-path="url(#cp2)"><g clip-path="url(#irc10)"><clipPath id="svgimg11vclip"><rect x="16" y="270" width="360" height="72"/></clipPath><g clip-path="url(#svgimg11vclip)"><g transform="translate(16 270)"><defs><clipPath id="svgimg11cp0"><rect x="20" y="20" width="66.4" height="40"/></clipPath><clipPath id="svgimg11ov1"><rect x="20" y="20" width="66.4" height="40" rx="0"/></clipPath><clipPath id="svgimg11cp2"><rect x="28" y="34" width="50.4" height="12"/></clipPath><clipPath id="svgimg11ct3"><rect x="28" y="34" width="50.4" height="12"/></clipPath></defs><g clip-path="url(#svgimg11cp0)"><g clip-path="url(#svgimg11ov1)"><g clip-path="url(#svgimg11cp2)"><g clip-path="url(#svgimg11ct3)"><text x="28" y="43" font-family="&quot;Courier New&quot;, monospace" font-size="12" font-weight="650" fill="rgb(174,174,178)">Filters</text></g></g></g></g></g></g></g></g></svg>
package/docs/design/templates/toolbar-text.svg CHANGED
@@ -1,9 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="392" height="358" viewBox="0 0 392 358">
2
- <rect width="392" height="358" fill="#ffffff"/>
3
- <text x="16" y="30" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#6e6e73">Large (title)</text>
4
- <svg x="16" y="38" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 360 80" width="360" height="80"><defs><clipPath id="v0-cp0"><rect x="20" y="20" width="163" height="40"/></clipPath><clipPath id="v0-ov1"><rect x="20" y="20" width="163" height="40" rx="0"/></clipPath><clipPath id="v0-cp2"><rect x="28" y="32" width="147" height="16"/></clipPath><clipPath id="v0-ct3"><rect x="28" y="32" width="147" height="16"/></clipPath></defs><g clip-path="url(#v0-cp0)"><g clip-path="url(#v0-ov1)"><g clip-path="url(#v0-cp2)"><g clip-path="url(#v0-ct3)"><text x="28" y="46" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(110,110,115)">Northstar migration</text></g></g></g></g></svg>
5
- <text x="16" y="148" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#6e6e73">Default</text>
6
- <svg x="16" y="156" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 360 76" width="360" height="76"><defs><clipPath id="v1-cp0"><rect x="20" y="20" width="151.2" height="40"/></clipPath><clipPath id="v1-ov1"><rect x="20" y="20" width="151.2" height="40" rx="0"/></clipPath><clipPath id="v1-cp2"><rect x="28" y="33" width="135.2" height="14"/></clipPath><clipPath id="v1-ct3"><rect x="28" y="33" width="135.2" height="14"/></clipPath></defs><g clip-path="url(#v1-cp0)"><g clip-path="url(#v1-ov1)"><g clip-path="url(#v1-cp2)"><g clip-path="url(#v1-ct3)"><text x="28" y="45" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="14" font-weight="650" fill="rgb(110,110,115)">Workspace settings</text></g></g></g></g></svg>
7
- <text x="16" y="262" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#6e6e73">Small (label)</text>
8
- <svg x="16" y="270" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 360 72" width="360" height="72"><defs><clipPath id="v2-cp0"><rect x="20" y="20" width="66.4" height="40"/></clipPath><clipPath id="v2-ov1"><rect x="20" y="20" width="66.4" height="40" rx="0"/></clipPath><clipPath id="v2-cp2"><rect x="28" y="34" width="50.4" height="12"/></clipPath><clipPath id="v2-ct3"><rect x="28" y="34" width="50.4" height="12"/></clipPath></defs><g clip-path="url(#v2-cp0)"><g clip-path="url(#v2-ov1)"><g clip-path="url(#v2-cp2)"><g clip-path="url(#v2-ct3)"><text x="28" y="43" font-family="&quot;Courier New&quot;, monospace" font-size="12" font-weight="650" fill="rgb(110,110,115)">Filters</text></g></g></g></g></svg>
9
- </svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 392 358" width="392" height="358"><defs><clipPath id="cp0"><rect x="16" y="38" width="360" height="80"/></clipPath><clipPath id="cp1"><rect x="16" y="156" width="360" height="76"/></clipPath><clipPath id="cp2"><rect x="16" y="270" width="360" height="72"/></clipPath><clipPath id="ct3"><rect x="16" y="16" width="360" height="22"/></clipPath><clipPath id="irc4"><rect x="16" y="38" width="360" height="80" rx="0"/></clipPath><clipPath id="ct6"><rect x="16" y="134" width="360" height="22"/></clipPath><clipPath id="irc7"><rect x="16" y="156" width="360" height="76" rx="0"/></clipPath><clipPath id="ct9"><rect x="16" y="248" width="360" height="22"/></clipPath><clipPath id="irc10"><rect x="16" y="270" width="360" height="72" rx="0"/></clipPath></defs><rect x="0" y="0" width="392" height="358" rx="0" fill="rgb(255,255,255)"/><text x="16" y="28" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(110,110,115)">Large (title)</text><g clip-path="url(#cp0)"><g clip-path="url(#irc4)"><clipPath id="svgimg5vclip"><rect x="16" y="38" width="360" height="80"/></clipPath><g clip-path="url(#svgimg5vclip)"><g transform="translate(16 38)"><defs><clipPath id="svgimg5cp0"><rect x="20" y="20" width="163" height="40"/></clipPath><clipPath id="svgimg5ov1"><rect x="20" y="20" width="163" height="40" rx="0"/></clipPath><clipPath id="svgimg5cp2"><rect x="28" y="32" width="147" height="16"/></clipPath><clipPath id="svgimg5ct3"><rect x="28" y="32" width="147" height="16"/></clipPath></defs><g clip-path="url(#svgimg5cp0)"><g clip-path="url(#svgimg5ov1)"><g clip-path="url(#svgimg5cp2)"><g clip-path="url(#svgimg5ct3)"><text x="28" y="46" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(110,110,115)">Northstar migration</text></g></g></g></g></g></g></g></g><text x="16" y="146" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(110,110,115)">Default</text><g clip-path="url(#cp1)"><g clip-path="url(#irc7)"><clipPath id="svgimg8vclip"><rect x="16" y="156" width="360" height="76"/></clipPath><g clip-path="url(#svgimg8vclip)"><g transform="translate(16 156)"><defs><clipPath id="svgimg8cp0"><rect x="20" y="20" width="151.2" height="40"/></clipPath><clipPath id="svgimg8ov1"><rect x="20" y="20" width="151.2" height="40" rx="0"/></clipPath><clipPath id="svgimg8cp2"><rect x="28" y="33" width="135.2" height="14"/></clipPath><clipPath id="svgimg8ct3"><rect x="28" y="33" width="135.2" height="14"/></clipPath></defs><g clip-path="url(#svgimg8cp0)"><g clip-path="url(#svgimg8ov1)"><g clip-path="url(#svgimg8cp2)"><g clip-path="url(#svgimg8ct3)"><text x="28" y="45" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="14" font-weight="650" fill="rgb(110,110,115)">Workspace settings</text></g></g></g></g></g></g></g></g><text x="16" y="260" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(110,110,115)">Small (label)</text><g clip-path="url(#cp2)"><g clip-path="url(#irc10)"><clipPath id="svgimg11vclip"><rect x="16" y="270" width="360" height="72"/></clipPath><g clip-path="url(#svgimg11vclip)"><g transform="translate(16 270)"><defs><clipPath id="svgimg11cp0"><rect x="20" y="20" width="66.4" height="40"/></clipPath><clipPath id="svgimg11ov1"><rect x="20" y="20" width="66.4" height="40" rx="0"/></clipPath><clipPath id="svgimg11cp2"><rect x="28" y="34" width="50.4" height="12"/></clipPath><clipPath id="svgimg11ct3"><rect x="28" y="34" width="50.4" height="12"/></clipPath></defs><g clip-path="url(#svgimg11cp0)"><g clip-path="url(#svgimg11ov1)"><g clip-path="url(#svgimg11cp2)"><g clip-path="url(#svgimg11ct3)"><text x="28" y="43" font-family="&quot;Courier New&quot;, monospace" font-size="12" font-weight="650" fill="rgb(110,110,115)">Filters</text></g></g></g></g></g></g></g></g></svg>
package/docs/design/templates/toolbar.svg CHANGED
@@ -1,5 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="672" height="158" viewBox="0 0 672 158">
2
- <rect width="672" height="158" fill="#ffffff"/>
3
- <text x="16" y="30" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#6e6e73">Title with a trailing group</text>
4
- <svg x="16" y="38" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 104" width="640" height="104"><defs><clipPath id="v0-cp0"><rect x="28" y="28" width="452" height="44"/></clipPath><clipPath id="v0-ov1"><rect x="28" y="28" width="452" height="44" rx="0"/></clipPath><clipPath id="v0-cp2"><rect x="30" y="30" width="88.1" height="40"/></clipPath><clipPath id="v0-ov3"><rect x="30" y="30" width="88.1" height="40" rx="0"/></clipPath><clipPath id="v0-cp4"><rect x="38" y="42" width="72.1" height="16"/></clipPath><clipPath id="v0-ct5"><rect x="38" y="42" width="72.1" height="16"/></clipPath><clipPath id="v0-cp6"><rect x="502" y="42" width="16" height="16"/></clipPath><clipPath id="v0-cp7"><rect x="542" y="42" width="16" height="16"/></clipPath><clipPath id="v0-cp8"><rect x="582" y="42" width="16" height="16"/></clipPath></defs><g clip-path="url(#v0-cp0)"><g clip-path="url(#v0-ov1)"><rect x="28.5" y="28.5" width="91" height="43" rx="21.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v0-cp2)"><g clip-path="url(#v0-ov3)"><g clip-path="url(#v0-cp4)"><g clip-path="url(#v0-ct5)"><text x="38" y="56" font-family="&quot;ui-sans-serif&quot;, &quot;-apple-system&quot;, &quot;system-ui&quot;, &quot;Segoe UI&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(110,110,115)">Northstar</text></g></g></g></g></g></g><rect x="488" y="28" width="124" height="44" rx="22" fill="rgb(229,229,234)"/><rect x="488.5" y="28.5" width="123" height="43" rx="21.5" fill="none" stroke="rgb(209,209,214)" stroke-width="1"/><rect x="490.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v0-cp6)"><g transform="translate(502 42)" color="rgb(110, 110, 115)"><svg data-lucide="list" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="ui-sans-serif, -apple-system, &quot;system-ui&quot;, &quot;Segoe UI&quot;, sans-serif" style="overflow:hidden" width="16" height="16"><path d="M3 5z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 12z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 19z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 5h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 12h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 19h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g><rect x="530.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v0-cp7)"><g transform="translate(542 42)" color="rgb(110, 110, 115)"><svg data-lucide="columns-3" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="ui-sans-serif, -apple-system, &quot;system-ui&quot;, &quot;Segoe UI&quot;, sans-serif" style="overflow:hidden" width="16" height="16"><rect width="18" height="18" x="3" y="3" rx="2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M15 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g><rect x="570.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#v0-cp8)"><g transform="translate(582 42)" color="rgb(110, 110, 115)"><svg data-lucide="settings" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="ui-sans-serif, -apple-system, &quot;system-ui&quot;, &quot;Segoe UI&quot;, sans-serif" style="overflow:hidden" width="16" height="16"><path d="M9.7 4.1a2.3 2.3 0 0 1 4.6 0 2.3 2.3 0 0 0 3.3 2 2.3 2.3 0 0 1 2.4 4 2.3 2.3 0 0 0 0 3.8 2.3 2.3 0 0 1-2.4 4 2.3 2.3 0 0 0-3.3 2 2.3 2.3 0 0 1-4.6 0 2.3 2.3 0 0 0-3.3-2A2.3 2.3 0 0 1 4 14a2.3 2.3 0 0 0 0-3.8 2.3 2.3 0 0 1 2.3-4 2.3 2.3 0 0 0 3.4-2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><circle cx="12" cy="12" r="3" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g></svg>
5
- </svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 672 158" width="672" height="158"><defs><clipPath id="cp0"><rect x="16" y="38" width="640" height="104"/></clipPath><clipPath id="ct1"><rect x="16" y="16" width="640" height="22"/></clipPath><clipPath id="irc2"><rect x="16" y="38" width="640" height="104" rx="0"/></clipPath></defs><rect x="0" y="0" width="672" height="158" rx="0" fill="rgb(255,255,255)"/><text x="16" y="28" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(110,110,115)">Title with a trailing group</text><g clip-path="url(#cp0)"><g clip-path="url(#irc2)"><clipPath id="svgimg3vclip"><rect x="16" y="38" width="640" height="104"/></clipPath><g clip-path="url(#svgimg3vclip)"><g transform="translate(16 38)"><defs><clipPath id="svgimg3cp0"><rect x="28" y="28" width="452" height="44"/></clipPath><clipPath id="svgimg3ov1"><rect x="28" y="28" width="452" height="44" rx="0"/></clipPath><clipPath id="svgimg3cp2"><rect x="30" y="30" width="88.1" height="40"/></clipPath><clipPath id="svgimg3ov3"><rect x="30" y="30" width="88.1" height="40" rx="0"/></clipPath><clipPath id="svgimg3cp4"><rect x="38" y="42" width="72.1" height="16"/></clipPath><clipPath id="svgimg3ct5"><rect x="38" y="42" width="72.1" height="16"/></clipPath><clipPath id="svgimg3cp6"><rect x="502" y="42" width="16" height="16"/></clipPath><clipPath id="svgimg3cp8"><rect x="542" y="42" width="16" height="16"/></clipPath><clipPath id="svgimg3cp10"><rect x="582" y="42" width="16" height="16"/></clipPath></defs><g clip-path="url(#svgimg3cp0)"><g clip-path="url(#svgimg3ov1)"><rect x="28.5" y="28.5" width="91" height="43" rx="21.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg3cp2)"><g clip-path="url(#svgimg3ov3)"><g clip-path="url(#svgimg3cp4)"><g clip-path="url(#svgimg3ct5)"><text x="38" y="56" font-family="&quot;ui-sans-serif&quot;, &quot;-apple-system&quot;, &quot;system-ui&quot;, &quot;Segoe UI&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(110,110,115)">Northstar</text></g></g></g></g></g></g><rect x="488" y="28" width="124" height="44" rx="22" fill="rgb(229,229,234)"/><rect x="488.5" y="28.5" width="123" height="43" rx="21.5" fill="none" stroke="rgb(209,209,214)" stroke-width="1"/><rect x="490.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg3cp6)"><g color="rgb(110, 110, 115)"><clipPath id="svgimg3svgic7"><rect x="502" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgimg3svgic7)"><g transform="translate(502 42)scale(.66667)"><path d="M3 5z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 12z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 19z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 5h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 12h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 19h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="530.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg3cp8)"><g color="rgb(110, 110, 115)"><clipPath id="svgimg3svgic9"><rect x="542" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgimg3svgic9)"><g transform="translate(542 42)scale(.66667)"><rect width="18" height="18" x="3" y="3" rx="2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M15 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="570.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg3cp10)"><g color="rgb(110, 110, 115)"><clipPath id="svgimg3svgic11"><rect x="582" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgimg3svgic11)"><g transform="translate(582 42)scale(.66667)"><path d="M9.7 4.1a2.3 2.3 0 0 1 4.6 0 2.3 2.3 0 0 0 3.3 2 2.3 2.3 0 0 1 2.4 4 2.3 2.3 0 0 0 0 3.8 2.3 2.3 0 0 1-2.4 4 2.3 2.3 0 0 0-3.3 2 2.3 2.3 0 0 1-4.6 0 2.3 2.3 0 0 0-3.3-2A2.3 2.3 0 0 1 4 14a2.3 2.3 0 0 0 0-3.8 2.3 2.3 0 0 1 2.3-4 2.3 2.3 0 0 0 3.4-2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><circle cx="12" cy="12" r="3" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g></g></g></g></g></svg>
package/docs/design/templates/value-table/details-dark.svg CHANGED
@@ -1 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 460 220" width="460" height="220"><defs><clipPath id="cp0"><rect x="28" y="20" width="404" height="165.2"/></clipPath><clipPath id="ov1"><rect x="29" y="21" width="402" height="163.2" rx="11"/></clipPath><clipPath id="ct2"><rect x="37" y="32.4" width="46.5" height="18"/></clipPath><clipPath id="ct3"><rect x="141" y="32.4" width="282" height="18"/></clipPath><clipPath id="cp4"><rect x="37" y="70" width="24" height="24.2"/></clipPath><clipPath id="ct5"><rect x="69" y="73.2" width="90.6" height="18"/></clipPath><clipPath id="ct6"><rect x="167.6" y="73.2" width="255.4" height="18"/></clipPath><clipPath id="ct7"><rect x="37" y="114" width="50" height="18"/></clipPath><clipPath id="ct8"><rect x="141" y="114" width="282" height="18"/></clipPath><clipPath id="ct9"><rect x="37" y="154.8" width="83.7" height="18"/></clipPath><clipPath id="ct10"><rect x="141" y="154.8" width="282" height="18"/></clipPath></defs><g clip-path="url(#cp0)"><rect x="28" y="20" width="404" height="165.2" rx="12" fill="rgb(17,17,19)"/><rect x="28.5" y="20.5" width="403" height="164" rx="11.5" fill="none" stroke="rgb(72,72,74)" stroke-width="1"/></g><g clip-path="url(#ov1)"><text x="37" y="47.39" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(174,174,178)">Status</text><text x="391.91" y="47.39" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(245,245,247)">Live</text></g><g clip-path="url(#ov1)"><g clip-path="url(#cp4)"><g transform="translate(37 70.2)" color="rgb(174, 174, 178)"><svg data-lucide="rocket" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="24" height="24"><path d="M12 15v5s3-.6 4-2c1-1.6 0-5 0-5" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M4.5 16.5c-1.5 1.3-2 5-2 5s3.7-.5 5-2c.7-.8.7-2.1 0-3a2 2 0 0 0-3 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 12a22 22 0 0 1 2-4 13 13 0 0 1 11-6c0 2.7-.8 7.5-6 11a22 22 0 0 1-4 2Z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 12H4s.5-3 2-4c1.6-1 5 0 5 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g><text x="69" y="88.19" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(174,174,178)">Environment</text><text x="338.63" y="88.19" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(245,245,247)">Production</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="69" y1="62.5" x2="423" y2="62.5" stroke="rgb(72, 72, 74)" stroke-width="1"/></g></g></g><g clip-path="url(#ov1)"><text x="37" y="128.98" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(174,174,178)">Region</text><text x="349.39" y="128.98" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(245,245,247)">us-east-1</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="37" y1="103.5" x2="423" y2="103.5" stroke="rgb(72, 72, 74)" stroke-width="1"/></g></g></g><g clip-path="url(#ov1)"><text x="37" y="169.78" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(174,174,178)">Last deploy</text><text x="333.14" y="169.78" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(245,245,247)">2 hours ago</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="37" y1="143.5" x2="423" y2="143.5" stroke="rgb(72, 72, 74)" stroke-width="1"/></g></g></g></svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 460 220" width="460" height="220"><defs><clipPath id="cp0"><rect x="28" y="20" width="404" height="165.2"/></clipPath><clipPath id="ov1"><rect x="29" y="21" width="402" height="163.2" rx="11"/></clipPath><clipPath id="ct2"><rect x="37" y="32.4" width="46.5" height="18"/></clipPath><clipPath id="ct3"><rect x="141" y="32.4" width="282" height="18"/></clipPath><clipPath id="cp4"><rect x="37" y="70" width="24" height="24.2"/></clipPath><clipPath id="ct6"><rect x="69" y="73.2" width="90.6" height="18"/></clipPath><clipPath id="ct7"><rect x="167.6" y="73.2" width="255.4" height="18"/></clipPath><clipPath id="ct8"><rect x="37" y="114" width="50" height="18"/></clipPath><clipPath id="ct9"><rect x="141" y="114" width="282" height="18"/></clipPath><clipPath id="ct10"><rect x="37" y="154.8" width="83.7" height="18"/></clipPath><clipPath id="ct11"><rect x="141" y="154.8" width="282" height="18"/></clipPath></defs><g clip-path="url(#cp0)"><rect x="28" y="20" width="404" height="165.2" rx="12" fill="rgb(17,17,19)"/><rect x="28.5" y="20.5" width="403" height="164" rx="11.5" fill="none" stroke="rgb(72,72,74)" stroke-width="1"/></g><g clip-path="url(#ov1)"><text x="37" y="47.39" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(174,174,178)">Status</text><text x="391.91" y="47.39" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(245,245,247)">Live</text></g><g clip-path="url(#ov1)"><g clip-path="url(#cp4)"><g color="rgb(174, 174, 178)"><clipPath id="svgic5"><rect x="37" y="70.2" width="24" height="24"/></clipPath><g clip-path="url(#svgic5)"><g transform="translate(37 70.188)"><path d="M12 15v5s3-.6 4-2c1-1.6 0-5 0-5" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M4.5 16.5c-1.5 1.3-2 5-2 5s3.7-.5 5-2c.7-.8.7-2.1 0-3a2 2 0 0 0-3 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 12a22 22 0 0 1 2-4 13 13 0 0 1 11-6c0 2.7-.8 7.5-6 11a22 22 0 0 1-4 2Z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 12H4s.5-3 2-4c1.6-1 5 0 5 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><text x="69" y="88.19" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(174,174,178)">Environment</text><text x="338.63" y="88.19" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(245,245,247)">Production</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="69" y1="62.5" x2="423" y2="62.5" stroke="rgb(72, 72, 74)" stroke-width="1"/></g></g></g><g clip-path="url(#ov1)"><text x="37" y="128.98" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(174,174,178)">Region</text><text x="349.39" y="128.98" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(245,245,247)">us-east-1</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="37" y1="103.5" x2="423" y2="103.5" stroke="rgb(72, 72, 74)" stroke-width="1"/></g></g></g><g clip-path="url(#ov1)"><text x="37" y="169.78" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(174,174,178)">Last deploy</text><text x="333.14" y="169.78" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(245,245,247)">2 hours ago</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="37" y1="143.5" x2="423" y2="143.5" stroke="rgb(72, 72, 74)" stroke-width="1"/></g></g></g></svg>
package/docs/design/templates/value-table/details.svg CHANGED
@@ -1 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 460 220" width="460" height="220"><defs><clipPath id="cp0"><rect x="28" y="20" width="404" height="165.2"/></clipPath><clipPath id="ov1"><rect x="29" y="21" width="402" height="163.2" rx="11"/></clipPath><clipPath id="ct2"><rect x="37" y="32.4" width="46.5" height="18"/></clipPath><clipPath id="ct3"><rect x="141" y="32.4" width="282" height="18"/></clipPath><clipPath id="cp4"><rect x="37" y="70" width="24" height="24.2"/></clipPath><clipPath id="ct5"><rect x="69" y="73.2" width="90.6" height="18"/></clipPath><clipPath id="ct6"><rect x="167.6" y="73.2" width="255.4" height="18"/></clipPath><clipPath id="ct7"><rect x="37" y="114" width="50" height="18"/></clipPath><clipPath id="ct8"><rect x="141" y="114" width="282" height="18"/></clipPath><clipPath id="ct9"><rect x="37" y="154.8" width="83.7" height="18"/></clipPath><clipPath id="ct10"><rect x="141" y="154.8" width="282" height="18"/></clipPath></defs><g clip-path="url(#cp0)"><rect x="28" y="20" width="404" height="165.2" rx="12" fill="rgb(242,242,247)"/><rect x="28.5" y="20.5" width="403" height="164" rx="11.5" fill="none" stroke="rgb(209,209,214)" stroke-width="1"/></g><g clip-path="url(#ov1)"><text x="37" y="47.39" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(110,110,115)">Status</text><text x="391.91" y="47.39" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(29,29,31)">Live</text></g><g clip-path="url(#ov1)"><g clip-path="url(#cp4)"><g transform="translate(37 70.2)" color="rgb(110, 110, 115)"><svg data-lucide="rocket" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="24" height="24"><path d="M12 15v5s3-.6 4-2c1-1.6 0-5 0-5" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M4.5 16.5c-1.5 1.3-2 5-2 5s3.7-.5 5-2c.7-.8.7-2.1 0-3a2 2 0 0 0-3 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 12a22 22 0 0 1 2-4 13 13 0 0 1 11-6c0 2.7-.8 7.5-6 11a22 22 0 0 1-4 2Z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 12H4s.5-3 2-4c1.6-1 5 0 5 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g><text x="69" y="88.19" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(110,110,115)">Environment</text><text x="338.63" y="88.19" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(29,29,31)">Production</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="69" y1="62.5" x2="423" y2="62.5" stroke="rgb(209, 209, 214)" stroke-width="1"/></g></g></g><g clip-path="url(#ov1)"><text x="37" y="128.98" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(110,110,115)">Region</text><text x="349.39" y="128.98" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(29,29,31)">us-east-1</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="37" y1="103.5" x2="423" y2="103.5" stroke="rgb(209, 209, 214)" stroke-width="1"/></g></g></g><g clip-path="url(#ov1)"><text x="37" y="169.78" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(110,110,115)">Last deploy</text><text x="333.14" y="169.78" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(29,29,31)">2 hours ago</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="37" y1="143.5" x2="423" y2="143.5" stroke="rgb(209, 209, 214)" stroke-width="1"/></g></g></g></svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 460 220" width="460" height="220"><defs><clipPath id="cp0"><rect x="28" y="20" width="404" height="165.2"/></clipPath><clipPath id="ov1"><rect x="29" y="21" width="402" height="163.2" rx="11"/></clipPath><clipPath id="ct2"><rect x="37" y="32.4" width="46.5" height="18"/></clipPath><clipPath id="ct3"><rect x="141" y="32.4" width="282" height="18"/></clipPath><clipPath id="cp4"><rect x="37" y="70" width="24" height="24.2"/></clipPath><clipPath id="ct6"><rect x="69" y="73.2" width="90.6" height="18"/></clipPath><clipPath id="ct7"><rect x="167.6" y="73.2" width="255.4" height="18"/></clipPath><clipPath id="ct8"><rect x="37" y="114" width="50" height="18"/></clipPath><clipPath id="ct9"><rect x="141" y="114" width="282" height="18"/></clipPath><clipPath id="ct10"><rect x="37" y="154.8" width="83.7" height="18"/></clipPath><clipPath id="ct11"><rect x="141" y="154.8" width="282" height="18"/></clipPath></defs><g clip-path="url(#cp0)"><rect x="28" y="20" width="404" height="165.2" rx="12" fill="rgb(242,242,247)"/><rect x="28.5" y="20.5" width="403" height="164" rx="11.5" fill="none" stroke="rgb(209,209,214)" stroke-width="1"/></g><g clip-path="url(#ov1)"><text x="37" y="47.39" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(110,110,115)">Status</text><text x="391.91" y="47.39" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(29,29,31)">Live</text></g><g clip-path="url(#ov1)"><g clip-path="url(#cp4)"><g color="rgb(110, 110, 115)"><clipPath id="svgic5"><rect x="37" y="70.2" width="24" height="24"/></clipPath><g clip-path="url(#svgic5)"><g transform="translate(37 70.188)"><path d="M12 15v5s3-.6 4-2c1-1.6 0-5 0-5" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M4.5 16.5c-1.5 1.3-2 5-2 5s3.7-.5 5-2c.7-.8.7-2.1 0-3a2 2 0 0 0-3 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 12a22 22 0 0 1 2-4 13 13 0 0 1 11-6c0 2.7-.8 7.5-6 11a22 22 0 0 1-4 2Z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 12H4s.5-3 2-4c1.6-1 5 0 5 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><text x="69" y="88.19" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(110,110,115)">Environment</text><text x="338.63" y="88.19" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(29,29,31)">Production</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="69" y1="62.5" x2="423" y2="62.5" stroke="rgb(209, 209, 214)" stroke-width="1"/></g></g></g><g clip-path="url(#ov1)"><text x="37" y="128.98" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(110,110,115)">Region</text><text x="349.39" y="128.98" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(29,29,31)">us-east-1</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="37" y1="103.5" x2="423" y2="103.5" stroke="rgb(209, 209, 214)" stroke-width="1"/></g></g></g><g clip-path="url(#ov1)"><text x="37" y="169.78" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(110,110,115)">Last deploy</text><text x="333.14" y="169.78" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(29,29,31)">2 hours ago</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="37" y1="143.5" x2="423" y2="143.5" stroke="rgb(209, 209, 214)" stroke-width="1"/></g></g></g></svg>
package/docs/design/templates/value-table-dark.svg CHANGED
@@ -1,5 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="492" height="274" viewBox="0 0 492 274">
2
- <rect width="492" height="274" fill="#1c1c1e"/>
3
- <text x="16" y="30" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#aeaeb2">Key/value detail rows</text>
4
- <svg x="16" y="38" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 460 220" width="460" height="220"><defs><clipPath id="v0-cp0"><rect x="28" y="20" width="404" height="165.2"/></clipPath><clipPath id="v0-ov1"><rect x="29" y="21" width="402" height="163.2" rx="11"/></clipPath><clipPath id="v0-ct2"><rect x="37" y="32.4" width="46.5" height="18"/></clipPath><clipPath id="v0-ct3"><rect x="141" y="32.4" width="282" height="18"/></clipPath><clipPath id="v0-cp4"><rect x="37" y="70" width="24" height="24.2"/></clipPath><clipPath id="v0-ct5"><rect x="69" y="73.2" width="90.6" height="18"/></clipPath><clipPath id="v0-ct6"><rect x="167.6" y="73.2" width="255.4" height="18"/></clipPath><clipPath id="v0-ct7"><rect x="37" y="114" width="50" height="18"/></clipPath><clipPath id="v0-ct8"><rect x="141" y="114" width="282" height="18"/></clipPath><clipPath id="v0-ct9"><rect x="37" y="154.8" width="83.7" height="18"/></clipPath><clipPath id="v0-ct10"><rect x="141" y="154.8" width="282" height="18"/></clipPath></defs><g clip-path="url(#v0-cp0)"><rect x="28" y="20" width="404" height="165.2" rx="12" fill="rgb(17,17,19)"/><rect x="28.5" y="20.5" width="403" height="164" rx="11.5" fill="none" stroke="rgb(72,72,74)" stroke-width="1"/></g><g clip-path="url(#v0-ov1)"><text x="37" y="47.39" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(174,174,178)">Status</text><text x="391.91" y="47.39" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(245,245,247)">Live</text></g><g clip-path="url(#v0-ov1)"><g clip-path="url(#v0-cp4)"><g transform="translate(37 70.2)" color="rgb(174, 174, 178)"><svg data-lucide="rocket" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="24" height="24"><path d="M12 15v5s3-.6 4-2c1-1.6 0-5 0-5" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M4.5 16.5c-1.5 1.3-2 5-2 5s3.7-.5 5-2c.7-.8.7-2.1 0-3a2 2 0 0 0-3 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 12a22 22 0 0 1 2-4 13 13 0 0 1 11-6c0 2.7-.8 7.5-6 11a22 22 0 0 1-4 2Z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 12H4s.5-3 2-4c1.6-1 5 0 5 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g><text x="69" y="88.19" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(174,174,178)">Environment</text><text x="338.63" y="88.19" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(245,245,247)">Production</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="69" y1="62.5" x2="423" y2="62.5" stroke="rgb(72, 72, 74)" stroke-width="1"/></g></g></g><g clip-path="url(#v0-ov1)"><text x="37" y="128.98" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(174,174,178)">Region</text><text x="349.39" y="128.98" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(245,245,247)">us-east-1</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="37" y1="103.5" x2="423" y2="103.5" stroke="rgb(72, 72, 74)" stroke-width="1"/></g></g></g><g clip-path="url(#v0-ov1)"><text x="37" y="169.78" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(174,174,178)">Last deploy</text><text x="333.14" y="169.78" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(245,245,247)">2 hours ago</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="37" y1="143.5" x2="423" y2="143.5" stroke="rgb(72, 72, 74)" stroke-width="1"/></g></g></g></svg>
5
- </svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 492 274" width="492" height="274"><defs><clipPath id="cp0"><rect x="16" y="38" width="460" height="220"/></clipPath><clipPath id="ct1"><rect x="16" y="16" width="460" height="22"/></clipPath><clipPath id="irc2"><rect x="16" y="38" width="460" height="220" rx="0"/></clipPath></defs><rect x="0" y="0" width="492" height="274" rx="0" fill="rgb(28,28,30)"/><text x="16" y="28" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(174,174,178)">Key/value detail rows</text><g clip-path="url(#cp0)"><g clip-path="url(#irc2)"><clipPath id="svgimg3vclip"><rect x="16" y="38" width="460" height="220"/></clipPath><g clip-path="url(#svgimg3vclip)"><g transform="translate(16 38)"><defs><clipPath id="svgimg3cp0"><rect x="28" y="20" width="404" height="165.2"/></clipPath><clipPath id="svgimg3ov1"><rect x="29" y="21" width="402" height="163.2" rx="11"/></clipPath><clipPath id="svgimg3ct2"><rect x="37" y="32.4" width="46.5" height="18"/></clipPath><clipPath id="svgimg3ct3"><rect x="141" y="32.4" width="282" height="18"/></clipPath><clipPath id="svgimg3cp4"><rect x="37" y="70" width="24" height="24.2"/></clipPath><clipPath id="svgimg3ct6"><rect x="69" y="73.2" width="90.6" height="18"/></clipPath><clipPath id="svgimg3ct7"><rect x="167.6" y="73.2" width="255.4" height="18"/></clipPath><clipPath id="svgimg3ct8"><rect x="37" y="114" width="50" height="18"/></clipPath><clipPath id="svgimg3ct9"><rect x="141" y="114" width="282" height="18"/></clipPath><clipPath id="svgimg3ct10"><rect x="37" y="154.8" width="83.7" height="18"/></clipPath><clipPath id="svgimg3ct11"><rect x="141" y="154.8" width="282" height="18"/></clipPath></defs><g clip-path="url(#svgimg3cp0)"><rect x="28" y="20" width="404" height="165.2" rx="12" fill="rgb(17,17,19)"/><rect x="28.5" y="20.5" width="403" height="164" rx="11.5" fill="none" stroke="rgb(72,72,74)" stroke-width="1"/></g><g clip-path="url(#svgimg3ov1)"><text x="37" y="47.39" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(174,174,178)">Status</text><text x="391.91" y="47.39" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(245,245,247)">Live</text></g><g clip-path="url(#svgimg3ov1)"><g clip-path="url(#svgimg3cp4)"><g color="rgb(174, 174, 178)"><clipPath id="svgimg3svgic5"><rect x="37" y="70.2" width="24" height="24"/></clipPath><g clip-path="url(#svgimg3svgic5)"><g transform="translate(37 70.188)"><path d="M12 15v5s3-.6 4-2c1-1.6 0-5 0-5" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M4.5 16.5c-1.5 1.3-2 5-2 5s3.7-.5 5-2c.7-.8.7-2.1 0-3a2 2 0 0 0-3 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 12a22 22 0 0 1 2-4 13 13 0 0 1 11-6c0 2.7-.8 7.5-6 11a22 22 0 0 1-4 2Z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 12H4s.5-3 2-4c1.6-1 5 0 5 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><text x="69" y="88.19" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(174,174,178)">Environment</text><text x="338.63" y="88.19" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(245,245,247)">Production</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="69" y1="62.5" x2="423" y2="62.5" stroke="rgb(72, 72, 74)" stroke-width="1"/></g></g></g><g clip-path="url(#svgimg3ov1)"><text x="37" y="128.98" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(174,174,178)">Region</text><text x="349.39" y="128.98" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(245,245,247)">us-east-1</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="37" y1="103.5" x2="423" y2="103.5" stroke="rgb(72, 72, 74)" stroke-width="1"/></g></g></g><g clip-path="url(#svgimg3ov1)"><text x="37" y="169.78" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(174,174,178)">Last deploy</text><text x="333.14" y="169.78" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(245,245,247)">2 hours ago</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="37" y1="143.5" x2="423" y2="143.5" stroke="rgb(72, 72, 74)" stroke-width="1"/></g></g></g></g></g></g></g></svg>
package/docs/design/templates/value-table.svg CHANGED
@@ -1,5 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="492" height="274" viewBox="0 0 492 274">
2
- <rect width="492" height="274" fill="#ffffff"/>
3
- <text x="16" y="30" font-family="system-ui, sans-serif" font-size="12" font-weight="600" fill="#6e6e73">Key/value detail rows</text>
4
- <svg x="16" y="38" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 460 220" width="460" height="220"><defs><clipPath id="v0-cp0"><rect x="28" y="20" width="404" height="165.2"/></clipPath><clipPath id="v0-ov1"><rect x="29" y="21" width="402" height="163.2" rx="11"/></clipPath><clipPath id="v0-ct2"><rect x="37" y="32.4" width="46.5" height="18"/></clipPath><clipPath id="v0-ct3"><rect x="141" y="32.4" width="282" height="18"/></clipPath><clipPath id="v0-cp4"><rect x="37" y="70" width="24" height="24.2"/></clipPath><clipPath id="v0-ct5"><rect x="69" y="73.2" width="90.6" height="18"/></clipPath><clipPath id="v0-ct6"><rect x="167.6" y="73.2" width="255.4" height="18"/></clipPath><clipPath id="v0-ct7"><rect x="37" y="114" width="50" height="18"/></clipPath><clipPath id="v0-ct8"><rect x="141" y="114" width="282" height="18"/></clipPath><clipPath id="v0-ct9"><rect x="37" y="154.8" width="83.7" height="18"/></clipPath><clipPath id="v0-ct10"><rect x="141" y="154.8" width="282" height="18"/></clipPath></defs><g clip-path="url(#v0-cp0)"><rect x="28" y="20" width="404" height="165.2" rx="12" fill="rgb(242,242,247)"/><rect x="28.5" y="20.5" width="403" height="164" rx="11.5" fill="none" stroke="rgb(209,209,214)" stroke-width="1"/></g><g clip-path="url(#v0-ov1)"><text x="37" y="47.39" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(110,110,115)">Status</text><text x="391.91" y="47.39" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(29,29,31)">Live</text></g><g clip-path="url(#v0-ov1)"><g clip-path="url(#v0-cp4)"><g transform="translate(37 70.2)" color="rgb(110, 110, 115)"><svg data-lucide="rocket" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" font-family="system-ui, -apple-system, sans-serif" style="overflow:hidden" width="24" height="24"><path d="M12 15v5s3-.6 4-2c1-1.6 0-5 0-5" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M4.5 16.5c-1.5 1.3-2 5-2 5s3.7-.5 5-2c.7-.8.7-2.1 0-3a2 2 0 0 0-3 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 12a22 22 0 0 1 2-4 13 13 0 0 1 11-6c0 2.7-.8 7.5-6 11a22 22 0 0 1-4 2Z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 12H4s.5-3 2-4c1.6-1 5 0 5 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></svg></g></g><text x="69" y="88.19" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(110,110,115)">Environment</text><text x="338.63" y="88.19" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(29,29,31)">Production</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="69" y1="62.5" x2="423" y2="62.5" stroke="rgb(209, 209, 214)" stroke-width="1"/></g></g></g><g clip-path="url(#v0-ov1)"><text x="37" y="128.98" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(110,110,115)">Region</text><text x="349.39" y="128.98" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(29,29,31)">us-east-1</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="37" y1="103.5" x2="423" y2="103.5" stroke="rgb(209, 209, 214)" stroke-width="1"/></g></g></g><g clip-path="url(#v0-ov1)"><text x="37" y="169.78" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(110,110,115)">Last deploy</text><text x="333.14" y="169.78" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(29,29,31)">2 hours ago</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="37" y1="143.5" x2="423" y2="143.5" stroke="rgb(209, 209, 214)" stroke-width="1"/></g></g></g></svg>
5
- </svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 492 274" width="492" height="274"><defs><clipPath id="cp0"><rect x="16" y="38" width="460" height="220"/></clipPath><clipPath id="ct1"><rect x="16" y="16" width="460" height="22"/></clipPath><clipPath id="irc2"><rect x="16" y="38" width="460" height="220" rx="0"/></clipPath></defs><rect x="0" y="0" width="492" height="274" rx="0" fill="rgb(255,255,255)"/><text x="16" y="28" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="12" font-weight="600" fill="rgb(110,110,115)">Key/value detail rows</text><g clip-path="url(#cp0)"><g clip-path="url(#irc2)"><clipPath id="svgimg3vclip"><rect x="16" y="38" width="460" height="220"/></clipPath><g clip-path="url(#svgimg3vclip)"><g transform="translate(16 38)"><defs><clipPath id="svgimg3cp0"><rect x="28" y="20" width="404" height="165.2"/></clipPath><clipPath id="svgimg3ov1"><rect x="29" y="21" width="402" height="163.2" rx="11"/></clipPath><clipPath id="svgimg3ct2"><rect x="37" y="32.4" width="46.5" height="18"/></clipPath><clipPath id="svgimg3ct3"><rect x="141" y="32.4" width="282" height="18"/></clipPath><clipPath id="svgimg3cp4"><rect x="37" y="70" width="24" height="24.2"/></clipPath><clipPath id="svgimg3ct6"><rect x="69" y="73.2" width="90.6" height="18"/></clipPath><clipPath id="svgimg3ct7"><rect x="167.6" y="73.2" width="255.4" height="18"/></clipPath><clipPath id="svgimg3ct8"><rect x="37" y="114" width="50" height="18"/></clipPath><clipPath id="svgimg3ct9"><rect x="141" y="114" width="282" height="18"/></clipPath><clipPath id="svgimg3ct10"><rect x="37" y="154.8" width="83.7" height="18"/></clipPath><clipPath id="svgimg3ct11"><rect x="141" y="154.8" width="282" height="18"/></clipPath></defs><g clip-path="url(#svgimg3cp0)"><rect x="28" y="20" width="404" height="165.2" rx="12" fill="rgb(242,242,247)"/><rect x="28.5" y="20.5" width="403" height="164" rx="11.5" fill="none" stroke="rgb(209,209,214)" stroke-width="1"/></g><g clip-path="url(#svgimg3ov1)"><text x="37" y="47.39" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(110,110,115)">Status</text><text x="391.91" y="47.39" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(29,29,31)">Live</text></g><g clip-path="url(#svgimg3ov1)"><g clip-path="url(#svgimg3cp4)"><g color="rgb(110, 110, 115)"><clipPath id="svgimg3svgic5"><rect x="37" y="70.2" width="24" height="24"/></clipPath><g clip-path="url(#svgimg3svgic5)"><g transform="translate(37 70.188)"><path d="M12 15v5s3-.6 4-2c1-1.6 0-5 0-5" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M4.5 16.5c-1.5 1.3-2 5-2 5s3.7-.5 5-2c.7-.8.7-2.1 0-3a2 2 0 0 0-3 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 12a22 22 0 0 1 2-4 13 13 0 0 1 11-6c0 2.7-.8 7.5-6 11a22 22 0 0 1-4 2Z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 12H4s.5-3 2-4c1.6-1 5 0 5 0" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><text x="69" y="88.19" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(110,110,115)">Environment</text><text x="338.63" y="88.19" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(29,29,31)">Production</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="69" y1="62.5" x2="423" y2="62.5" stroke="rgb(209, 209, 214)" stroke-width="1"/></g></g></g><g clip-path="url(#svgimg3ov1)"><text x="37" y="128.98" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(110,110,115)">Region</text><text x="349.39" y="128.98" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(29,29,31)">us-east-1</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="37" y1="103.5" x2="423" y2="103.5" stroke="rgb(209, 209, 214)" stroke-width="1"/></g></g></g><g clip-path="url(#svgimg3ov1)"><text x="37" y="169.78" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" fill="rgb(110,110,115)">Last deploy</text><text x="333.14" y="169.78" font-family="system-ui, &quot;-apple-system&quot;, sans-serif" font-size="16" font-weight="650" fill="rgb(29,29,31)">2 hours ago</text><g data-domotion-pseudo-source="blink-pseudo-fragment-v1" data-domotion-pseudo="::before" data-domotion-pseudo-owner="source-fragments"><g><line x1="37" y1="143.5" x2="423" y2="143.5" stroke="rgb(209, 209, 214)" stroke-width="1"/></g></g></g></g></g></g></g></svg>