@skewedaspect/sleekspace-ui 0.5.0 → 0.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/dist/components/Card/SkCard.vue.d.ts +13 -1
  2. package/dist/components/Panel/SkPanel.vue.d.ts +15 -1
  3. package/dist/components/Panel/types.d.ts +1 -0
  4. package/dist/components/Select/SkSelect.vue.d.ts +61 -0
  5. package/dist/components/Select/SkSelectItem.vue.d.ts +134 -0
  6. package/dist/components/Select/SkSelectSeparator.vue.d.ts +2 -0
  7. package/dist/components/Select/index.d.ts +4 -0
  8. package/dist/components/Select/types.d.ts +3 -0
  9. package/dist/components/Sidebar/SkSidebar.vue.d.ts +8 -1
  10. package/dist/components/Sidebar/types.d.ts +1 -0
  11. package/dist/components/Skeleton/SkSkeleton.vue.d.ts +1 -1
  12. package/dist/components/Theme/types.d.ts +18 -3
  13. package/dist/index.d.ts +7 -0
  14. package/dist/sleekspace-ui.css +494 -74
  15. package/dist/sleekspace-ui.es.js +2014 -283
  16. package/dist/sleekspace-ui.umd.js +2013 -282
  17. package/docs/guides/design-tokens/advanced.md +6 -1
  18. package/docs/guides/theming.md +11 -1
  19. package/package.json +1 -1
  20. package/src/components/Card/SkCard.vue +17 -1
  21. package/src/components/Panel/SkPanel.vue +29 -4
  22. package/src/components/Panel/types.ts +3 -0
  23. package/src/components/Select/SkSelect.vue +210 -0
  24. package/src/components/Select/SkSelectItem.vue +112 -0
  25. package/src/components/Select/SkSelectSeparator.vue +40 -0
  26. package/src/components/Select/index.ts +10 -0
  27. package/src/components/Select/types.ts +10 -0
  28. package/src/components/Sidebar/SkSidebar.vue +39 -2
  29. package/src/components/Sidebar/types.ts +2 -0
  30. package/src/components/Theme/types.ts +20 -3
  31. package/src/global.d.ts +2 -0
  32. package/src/index.ts +10 -0
  33. package/src/styles/components/_button.scss +45 -9
  34. package/src/styles/components/_card.scss +45 -9
  35. package/src/styles/components/_index.scss +1 -0
  36. package/src/styles/components/_listbox.scss +1 -0
  37. package/src/styles/components/_panel.scss +119 -13
  38. package/src/styles/components/_select.scss +439 -0
  39. package/src/styles/components/_sidebar.scss +83 -4
  40. package/src/styles/themes/README.md +6 -2
  41. package/web-types.json +148 -1
package/web-types.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "framework": "vue",
3
3
  "name": "@skewedaspect/sleekspace-ui",
4
- "version": "0.5.0",
4
+ "version": "0.6.0",
5
5
  "contributions": {
6
6
  "html": {
7
7
  "description-markup": "markdown",
@@ -590,6 +590,26 @@
590
590
  "type": "boolean"
591
591
  },
592
592
  "default": "false"
593
+ },
594
+ {
595
+ "name": "corners",
596
+ "required": false,
597
+ "description": "Which corners receive the beveled cut. Passed through to the underlying SkPanel.",
598
+ "value": {
599
+ "kind": "expression",
600
+ "type": "Array"
601
+ },
602
+ "default": "() => [ 'bottom-right' ]"
603
+ },
604
+ {
605
+ "name": "decorationCorner",
606
+ "required": false,
607
+ "description": "Which corner displays the decorative accent stripe. Passed through to SkPanel.",
608
+ "value": {
609
+ "kind": "expression",
610
+ "type": "SkPanelCorner"
611
+ },
612
+ "default": "'bottom-right'"
593
613
  }
594
614
  ],
595
615
  "slots": [
@@ -1840,6 +1860,26 @@
1840
1860
  "type": "boolean"
1841
1861
  },
1842
1862
  "default": "false"
1863
+ },
1864
+ {
1865
+ "name": "corners",
1866
+ "required": false,
1867
+ "description": "Which corners receive the beveled cut. Any combination of the four corners can be\nspecified. Pass an empty array for no cut corners.",
1868
+ "value": {
1869
+ "kind": "expression",
1870
+ "type": "Array"
1871
+ },
1872
+ "default": "() => [ 'bottom-right' ]"
1873
+ },
1874
+ {
1875
+ "name": "decorationCorner",
1876
+ "required": false,
1877
+ "description": "Which corner displays the decorative accent stripe. Must be one of the active\n`corners` for the decoration to be visible.",
1878
+ "value": {
1879
+ "kind": "expression",
1880
+ "type": "SkPanelCorner"
1881
+ },
1882
+ "default": "'bottom-right'"
1843
1883
  }
1844
1884
  ],
1845
1885
  "slots": [
@@ -2200,6 +2240,103 @@
2200
2240
  "symbol": "default"
2201
2241
  }
2202
2242
  },
2243
+ {
2244
+ "name": "SkSelect",
2245
+ "description": "",
2246
+ "attributes": [
2247
+ {
2248
+ "name": "kind",
2249
+ "required": false,
2250
+ "description": "Semantic color kind that controls the trigger border, focus ring, and selected\nitem highlight appearance. When used inside SkField, inherits the field's\nkind if not explicitly set.",
2251
+ "value": {
2252
+ "kind": "expression",
2253
+ "type": "SkSelectKind"
2254
+ },
2255
+ "default": "undefined"
2256
+ },
2257
+ {
2258
+ "name": "size",
2259
+ "required": false,
2260
+ "description": "Size of the trigger and dropdown content. Controls the trigger height,\ntext size, and option item dimensions. Available sizes: 'sm' (small),\n'md' (medium), 'lg' (large).",
2261
+ "value": {
2262
+ "kind": "expression",
2263
+ "type": "SkSelectSize"
2264
+ },
2265
+ "default": "'md'"
2266
+ },
2267
+ {
2268
+ "name": "placeholder",
2269
+ "required": false,
2270
+ "description": "Placeholder text displayed in the trigger when no option is selected.\nUse to guide users on what type of selection to make.",
2271
+ "value": {
2272
+ "kind": "expression",
2273
+ "type": "string"
2274
+ },
2275
+ "default": "'Select...'"
2276
+ },
2277
+ {
2278
+ "name": "disabled",
2279
+ "required": false,
2280
+ "description": "When true, the select is disabled and cannot be interacted with. The trigger\nis non-clickable and the dropdown cannot be opened. The component appears\nwith reduced opacity and the cursor changes to not-allowed.",
2281
+ "value": {
2282
+ "kind": "expression",
2283
+ "type": "boolean"
2284
+ },
2285
+ "default": "false"
2286
+ }
2287
+ ],
2288
+ "slots": [
2289
+ {
2290
+ "name": "default"
2291
+ }
2292
+ ],
2293
+ "source": {
2294
+ "module": "./src/components/Select/SkSelect.vue",
2295
+ "symbol": "default"
2296
+ }
2297
+ },
2298
+ {
2299
+ "name": "SkSelectItem",
2300
+ "description": "",
2301
+ "attributes": [
2302
+ {
2303
+ "name": "value",
2304
+ "required": true,
2305
+ "description": "The value this option represents. When selected, the parent SkSelect's v-model\nwill be set to this value. Must be a string and unique within the select.",
2306
+ "value": {
2307
+ "kind": "expression",
2308
+ "type": "string"
2309
+ }
2310
+ },
2311
+ {
2312
+ "name": "disabled",
2313
+ "required": false,
2314
+ "description": "When true, this option is disabled and cannot be selected. The item appears\nwith reduced opacity and is skipped during keyboard navigation.",
2315
+ "value": {
2316
+ "kind": "expression",
2317
+ "type": "boolean"
2318
+ },
2319
+ "default": "false"
2320
+ }
2321
+ ],
2322
+ "slots": [
2323
+ {
2324
+ "name": "default"
2325
+ }
2326
+ ],
2327
+ "source": {
2328
+ "module": "./src/components/Select/SkSelectItem.vue",
2329
+ "symbol": "default"
2330
+ }
2331
+ },
2332
+ {
2333
+ "name": "SkSelectSeparator",
2334
+ "description": "",
2335
+ "source": {
2336
+ "module": "./src/components/Select/SkSelectSeparator.vue",
2337
+ "symbol": "default"
2338
+ }
2339
+ },
2203
2340
  {
2204
2341
  "name": "SkSidebar",
2205
2342
  "description": "",
@@ -2223,6 +2360,16 @@
2223
2360
  "type": "string"
2224
2361
  },
2225
2362
  "default": "'180px'"
2363
+ },
2364
+ {
2365
+ "name": "side",
2366
+ "required": false,
2367
+ "description": "Which side of the layout the sidebar is placed on. Controls the direction of the\npanel bevel and the sidebar-item clip-path cuts so they mirror appropriately.",
2368
+ "value": {
2369
+ "kind": "expression",
2370
+ "type": "SkSidebarSide"
2371
+ },
2372
+ "default": "'left'"
2226
2373
  }
2227
2374
  ],
2228
2375
  "slots": [