@govtechsg/sgds-web-component 3.21.2-rc.5 → 3.22.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (68) hide show
  1. package/base/card.js +1 -1
  2. package/base/select-element.d.ts +2 -0
  3. package/base/select-element.js +5 -0
  4. package/base/select-element.js.map +1 -1
  5. package/components/Breadcrumb/index.umd.min.js +1 -1
  6. package/components/Breadcrumb/index.umd.min.js.map +1 -1
  7. package/components/Card/index.umd.min.js +1 -1
  8. package/components/Card/index.umd.min.js.map +1 -1
  9. package/components/ComboBox/index.umd.min.js +4 -2
  10. package/components/ComboBox/index.umd.min.js.map +1 -1
  11. package/components/ComboBox/sgds-combo-box.js +2 -0
  12. package/components/ComboBox/sgds-combo-box.js.map +1 -1
  13. package/components/Datepicker/index.umd.min.js +3 -2
  14. package/components/Datepicker/index.umd.min.js.map +1 -1
  15. package/components/Footer/index.umd.min.js +1 -1
  16. package/components/Footer/index.umd.min.js.map +1 -1
  17. package/components/IconCard/index.umd.min.js +1 -1
  18. package/components/IconCard/index.umd.min.js.map +1 -1
  19. package/components/ImageCard/index.umd.min.js +1 -1
  20. package/components/ImageCard/index.umd.min.js.map +1 -1
  21. package/components/Input/index.umd.min.js +3 -2
  22. package/components/Input/index.umd.min.js.map +1 -1
  23. package/components/Input/sgds-input.d.ts +2 -0
  24. package/components/Input/sgds-input.js +6 -0
  25. package/components/Input/sgds-input.js.map +1 -1
  26. package/components/Link/index.umd.min.js +1 -1
  27. package/components/Link/index.umd.min.js.map +1 -1
  28. package/components/Link/link.js +1 -1
  29. package/components/QuantityToggle/index.umd.min.js +3 -2
  30. package/components/QuantityToggle/index.umd.min.js.map +1 -1
  31. package/components/Select/index.umd.min.js +2 -2
  32. package/components/Select/index.umd.min.js.map +1 -1
  33. package/components/Subnav/index.umd.min.js +1 -1
  34. package/components/Subnav/index.umd.min.js.map +1 -1
  35. package/components/ThumbnailCard/index.umd.min.js +1 -1
  36. package/components/ThumbnailCard/index.umd.min.js.map +1 -1
  37. package/components/index.umd.min.js +10 -7
  38. package/components/index.umd.min.js.map +1 -1
  39. package/css/fouc.css +1 -1
  40. package/css/grid.css +4 -30
  41. package/css/grid.js +1 -1
  42. package/custom-elements.json +237 -141
  43. package/index.umd.min.js +10 -7
  44. package/index.umd.min.js.map +1 -1
  45. package/package.json +1 -1
  46. package/react/base/card.cjs.js +1 -1
  47. package/react/base/card.js +1 -1
  48. package/react/base/select-element.cjs.js +5 -0
  49. package/react/base/select-element.cjs.js.map +1 -1
  50. package/react/base/select-element.js +5 -0
  51. package/react/base/select-element.js.map +1 -1
  52. package/react/components/ComboBox/sgds-combo-box.cjs.js +2 -0
  53. package/react/components/ComboBox/sgds-combo-box.cjs.js.map +1 -1
  54. package/react/components/ComboBox/sgds-combo-box.js +2 -0
  55. package/react/components/ComboBox/sgds-combo-box.js.map +1 -1
  56. package/react/components/Input/sgds-input.cjs.js +6 -0
  57. package/react/components/Input/sgds-input.cjs.js.map +1 -1
  58. package/react/components/Input/sgds-input.js +6 -0
  59. package/react/components/Input/sgds-input.js.map +1 -1
  60. package/react/components/Link/link.cjs.js +1 -1
  61. package/react/components/Link/link.js +1 -1
  62. package/react/css/grid.cjs.js +1 -1
  63. package/react/css/grid.js +1 -1
  64. package/react/index.cjs.js +6 -6
  65. package/react/index.d.ts +1 -1
  66. package/react/index.js +1 -1
  67. package/themes/root.css +0 -2
  68. package/types/react.d.ts +17 -11
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
 
6
6
  var lit = require('lit');
7
7
 
8
- var css_248z = lit.css`.sgds-container,.sgds-container-sidebar{margin-left:auto;margin-right:auto;max-width:calc(100% - 40px);width:100%}.sgds-grid{display:grid;gap:var(--sgds-gap-md);grid-template-columns:repeat(4,1fr)}.sgds-col-1{grid-column:span 1}.sgds-col-2{grid-column:span 2}.sgds-col-3{grid-column:span 3}.sgds-col-4{grid-column:span 4}.sgds-col-center-2{grid-column:2/span 2}.sgds-col-none{display:none}@media (min-width:512px){.sgds-grid{grid-template-columns:repeat(8,1fr)}.sgds-container,.sgds-container-sidebar{max-width:calc(100% - 48px)}.sgds-col-sm-1{grid-column:span 1}.sgds-col-sm-2{grid-column:span 2}.sgds-col-sm-3{grid-column:span 3}.sgds-col-sm-4{grid-column:span 4}.sgds-col-sm-5{grid-column:span 5}.sgds-col-sm-6{grid-column:span 6}.sgds-col-sm-7{grid-column:span 7}.sgds-col-sm-8{grid-column:span 8}.sgds-col-sm-center-2{grid-column:4/span 2}.sgds-col-sm-center-4{grid-column:3/span 4}.sgds-col-sm-center-6{grid-column:2/span 6}.sgds-col-none{display:revert}.sgds-col-sm-none{display:none}}@media (min-width:768px){.sgds-container{max-width:calc(100% - 56px)}.sgds-container-sidebar{max-width:calc(100% - 96px)}.sgds-grid{gap:var(--sgds-gap-xl)}.sgds-col-md-1{grid-column:span 1}.sgds-col-md-2{grid-column:span 2}.sgds-col-md-3{grid-column:span 3}.sgds-col-md-4{grid-column:span 4}.sgds-col-md-5{grid-column:span 5}.sgds-col-md-6{grid-column:span 6}.sgds-col-md-7{grid-column:span 7}.sgds-col-md-8{grid-column:span 8}.sgds-col-md-center-2{grid-column:4/span 2}.sgds-col-md-center-4{grid-column:3/span 4}.sgds-col-md-center-6{grid-column:2/span 6}.sgds-col-sm-none{display:revert}.sgds-col-md-none{display:none}}@media (min-width:1024px){.sgds-grid{grid-template-columns:repeat(12,1fr)}.sgds-container-sidebar{max-width:calc(100% - 96px)}.sgds-container{max-width:var(--sgds-dimension-888)}.sgds-col-lg-1{grid-column:span 1}.sgds-col-lg-2{grid-column:span 2}.sgds-col-lg-3{grid-column:span 3}.sgds-col-lg-4{grid-column:span 4}.sgds-col-lg-5{grid-column:span 5}.sgds-col-lg-6{grid-column:span 6}.sgds-col-lg-7{grid-column:span 7}.sgds-col-lg-8{grid-column:span 8}.sgds-col-lg-9{grid-column:span 9}.sgds-col-lg-10{grid-column:span 10}.sgds-col-lg-11{grid-column:span 11}.sgds-col-lg-12{grid-column:span 12}.sgds-col-lg-center-2{grid-column:6/span 2}.sgds-col-lg-center-4{grid-column:5/span 4}.sgds-col-lg-center-6{grid-column:4/span 6}.sgds-col-lg-center-8{grid-column:3/span 8}.sgds-col-lg-center-10{grid-column:2/span 10}.sgds-col-md-none{display:revert}.sgds-col-lg-none{display:none}}@media (min-width:1280px){.sgds-grid{gap:var(--sgds-gap-2-xl)}.sgds-container{max-width:var(--sgds-dimension-1168)}.sgds-container-sidebar{max-width:calc(100% - 96px)}.sgds-col-xl-1{grid-column:span 1}.sgds-col-xl-2{grid-column:span 2}.sgds-col-xl-3{grid-column:span 3}.sgds-col-xl-4{grid-column:span 4}.sgds-col-xl-5{grid-column:span 5}.sgds-col-xl-6{grid-column:span 6}.sgds-col-xl-7{grid-column:span 7}.sgds-col-xl-8{grid-column:span 8}.sgds-col-xl-9{grid-column:span 9}.sgds-col-xl-10{grid-column:span 10}.sgds-col-xl-11{grid-column:span 11}.sgds-col-xl-12{grid-column:span 12}.sgds-col-xl-center-2{grid-column:6/span 2}.sgds-col-xl-center-4{grid-column:5/span 4}.sgds-col-xl-center-6{grid-column:4/span 6}.sgds-col-xl-center-8{grid-column:3/span 8}.sgds-col-xl-center-10{grid-column:2/span 10}.sgds-col-lg-none{display:revert}.sgds-col-xl-none{display:none}}@media (min-width:1440px){.sgds-container{max-width:var(--sgds-dimension-1312)}.sgds-container-sidebar{max-width:calc(100% - 96px)}.sgds-col-2-xl-1{grid-column:span 1}.sgds-col-2-xl-2{grid-column:span 2}.sgds-col-2-xl-3{grid-column:span 3}.sgds-col-2-xl-4{grid-column:span 4}.sgds-col-2-xl-5{grid-column:span 5}.sgds-col-2-xl-6{grid-column:span 6}.sgds-col-2-xl-7{grid-column:span 7}.sgds-col-2-xl-8{grid-column:span 8}.sgds-col-2-xl-9{grid-column:span 9}.sgds-col-2-xl-10{grid-column:span 10}.sgds-col-2-xl-11{grid-column:span 11}.sgds-col-2-xl-12{grid-column:span 12}.sgds-col-2-xl-center-2{grid-column:6/span 2}.sgds-col-2-xl-center-4{grid-column:5/span 4}.sgds-col-2-xl-center-6{grid-column:4/span 6}.sgds-col-2-xl-center-8{grid-column:3/span 8}.sgds-col-2-xl-center-10{grid-column:2/span 10}.sgds-col-xl-none{display:revert}.sgds-col-2-xl-none{display:none}}@media (min-width:1600px){.sgds-container-sidebar{max-width:min(var(--sgds-dimension-1600),calc(100% - 96px))}.sgds-col-3-xl-1{grid-column:span 1}.sgds-col-3-xl-2{grid-column:span 2}.sgds-col-3-xl-3{grid-column:span 3}.sgds-col-3-xl-4{grid-column:span 4}.sgds-col-3-xl-5{grid-column:span 5}.sgds-col-3-xl-6{grid-column:span 6}.sgds-col-3-xl-7{grid-column:span 7}.sgds-col-3-xl-8{grid-column:span 8}.sgds-col-3-xl-9{grid-column:span 9}.sgds-col-3-xl-10{grid-column:span 10}.sgds-col-3-xl-11{grid-column:span 11}.sgds-col-3-xl-12{grid-column:span 12}.sgds-col-3-xl-center-2{grid-column:6/span 2}.sgds-col-3-xl-center-4{grid-column:5/span 4}.sgds-col-3-xl-center-6{grid-column:4/span 6}.sgds-col-3-xl-center-8{grid-column:3/span 8}.sgds-col-3-xl-center-10{grid-column:2/span 10}.sgds-col-2-xl-none{display:revert}.sgds-col-3-xl-none{display:none}}`;
8
+ var css_248z = lit.css`.sgds-container,.sgds-container-sidebar{margin-left:auto;margin-right:auto;max-width:calc(100% - 40px);width:100%}.sgds-grid{display:grid;gap:var(--sgds-gap-md);grid-template-columns:repeat(4,1fr)}.sgds-col-1{grid-column:span 1}.sgds-col-2{grid-column:span 2}.sgds-col-3{grid-column:span 3}.sgds-col-4{grid-column:span 4}.sgds-col-center-2{grid-column:2/span 2}.sgds-col-none{display:none}@media (min-width:512px){.sgds-grid{grid-template-columns:repeat(8,1fr)}.sgds-container,.sgds-container-sidebar{max-width:calc(100% - 48px)}.sgds-col-sm-1{grid-column:span 1}.sgds-col-sm-2{grid-column:span 2}.sgds-col-sm-3{grid-column:span 3}.sgds-col-sm-4{grid-column:span 4}.sgds-col-sm-5{grid-column:span 5}.sgds-col-sm-6{grid-column:span 6}.sgds-col-sm-7{grid-column:span 7}.sgds-col-sm-8{grid-column:span 8}.sgds-col-sm-center-2{grid-column:4/span 2}.sgds-col-sm-center-4{grid-column:3/span 4}.sgds-col-sm-center-6{grid-column:2/span 6}.sgds-col-none{display:revert}.sgds-col-sm-none{display:none}}@media (min-width:768px){.sgds-container{max-width:calc(100% - 56px)}.sgds-container-sidebar{max-width:calc(100% - 96px)}.sgds-grid{gap:var(--sgds-gap-xl)}.sgds-col-md-1{grid-column:span 1}.sgds-col-md-2{grid-column:span 2}.sgds-col-md-3{grid-column:span 3}.sgds-col-md-4{grid-column:span 4}.sgds-col-md-5{grid-column:span 5}.sgds-col-md-6{grid-column:span 6}.sgds-col-md-7{grid-column:span 7}.sgds-col-md-8{grid-column:span 8}.sgds-col-md-center-2{grid-column:4/span 2}.sgds-col-md-center-4{grid-column:3/span 4}.sgds-col-md-center-6{grid-column:2/span 6}.sgds-col-sm-none{display:revert}.sgds-col-md-none{display:none}}@media (min-width:1024px){.sgds-grid{grid-template-columns:repeat(12,1fr)}.sgds-container-sidebar{max-width:var(--sgds-dimension-840)}.sgds-container{max-width:var(--sgds-dimension-888)}.sgds-col-lg-1{grid-column:span 1}.sgds-col-lg-2{grid-column:span 2}.sgds-col-lg-3{grid-column:span 3}.sgds-col-lg-4{grid-column:span 4}.sgds-col-lg-5{grid-column:span 5}.sgds-col-lg-6{grid-column:span 6}.sgds-col-lg-7{grid-column:span 7}.sgds-col-lg-8{grid-column:span 8}.sgds-col-lg-9{grid-column:span 9}.sgds-col-lg-10{grid-column:span 10}.sgds-col-lg-11{grid-column:span 11}.sgds-col-lg-12{grid-column:span 12}.sgds-col-lg-center-2{grid-column:6/span 2}.sgds-col-lg-center-4{grid-column:5/span 4}.sgds-col-lg-center-6{grid-column:4/span 6}.sgds-col-lg-center-8{grid-column:3/span 8}.sgds-col-lg-center-10{grid-column:2/span 10}.sgds-col-md-none{display:revert}.sgds-col-lg-none{display:none}}@media (min-width:1280px){.sgds-grid{gap:var(--sgds-gap-2-xl)}.sgds-container{max-width:var(--sgds-dimension-1168)}.sgds-container-sidebar{max-width:var(--sgds-dimension-888)}.sgds-col-xl-1{grid-column:span 1}.sgds-col-xl-2{grid-column:span 2}.sgds-col-xl-3{grid-column:span 3}.sgds-col-xl-4{grid-column:span 4}.sgds-col-xl-5{grid-column:span 5}.sgds-col-xl-6{grid-column:span 6}.sgds-col-xl-7{grid-column:span 7}.sgds-col-xl-8{grid-column:span 8}.sgds-col-xl-9{grid-column:span 9}.sgds-col-xl-10{grid-column:span 10}.sgds-col-xl-11{grid-column:span 11}.sgds-col-xl-12{grid-column:span 12}.sgds-col-xl-center-2{grid-column:6/span 2}.sgds-col-xl-center-4{grid-column:5/span 4}.sgds-col-xl-center-6{grid-column:4/span 6}.sgds-col-xl-center-8{grid-column:3/span 8}.sgds-col-xl-center-10{grid-column:2/span 10}.sgds-col-lg-none{display:revert}.sgds-col-xl-none{display:none}}@media (min-width:1440px){.sgds-container{max-width:var(--sgds-dimension-1312)}.sgds-container-sidebar{max-width:var(--sgds-dimension-1024)}.sgds-col-2-xl-1{grid-column:span 1}.sgds-col-2-xl-2{grid-column:span 2}.sgds-col-2-xl-3{grid-column:span 3}.sgds-col-2-xl-4{grid-column:span 4}.sgds-col-2-xl-5{grid-column:span 5}.sgds-col-2-xl-6{grid-column:span 6}.sgds-col-2-xl-7{grid-column:span 7}.sgds-col-2-xl-8{grid-column:span 8}.sgds-col-2-xl-9{grid-column:span 9}.sgds-col-2-xl-10{grid-column:span 10}.sgds-col-2-xl-11{grid-column:span 11}.sgds-col-2-xl-12{grid-column:span 12}.sgds-col-2-xl-center-2{grid-column:6/span 2}.sgds-col-2-xl-center-4{grid-column:5/span 4}.sgds-col-2-xl-center-6{grid-column:4/span 6}.sgds-col-2-xl-center-8{grid-column:3/span 8}.sgds-col-2-xl-center-10{grid-column:2/span 10}.sgds-col-xl-none{display:revert}.sgds-col-2-xl-none{display:none}}`;
9
9
 
10
10
  exports["default"] = css_248z;
11
11
  //# sourceMappingURL=grid.cjs.js.map
package/react/css/grid.js CHANGED
@@ -1,7 +1,7 @@
1
1
  'use client';
2
2
  import { css } from 'lit';
3
3
 
4
- var css_248z = css`.sgds-container,.sgds-container-sidebar{margin-left:auto;margin-right:auto;max-width:calc(100% - 40px);width:100%}.sgds-grid{display:grid;gap:var(--sgds-gap-md);grid-template-columns:repeat(4,1fr)}.sgds-col-1{grid-column:span 1}.sgds-col-2{grid-column:span 2}.sgds-col-3{grid-column:span 3}.sgds-col-4{grid-column:span 4}.sgds-col-center-2{grid-column:2/span 2}.sgds-col-none{display:none}@media (min-width:512px){.sgds-grid{grid-template-columns:repeat(8,1fr)}.sgds-container,.sgds-container-sidebar{max-width:calc(100% - 48px)}.sgds-col-sm-1{grid-column:span 1}.sgds-col-sm-2{grid-column:span 2}.sgds-col-sm-3{grid-column:span 3}.sgds-col-sm-4{grid-column:span 4}.sgds-col-sm-5{grid-column:span 5}.sgds-col-sm-6{grid-column:span 6}.sgds-col-sm-7{grid-column:span 7}.sgds-col-sm-8{grid-column:span 8}.sgds-col-sm-center-2{grid-column:4/span 2}.sgds-col-sm-center-4{grid-column:3/span 4}.sgds-col-sm-center-6{grid-column:2/span 6}.sgds-col-none{display:revert}.sgds-col-sm-none{display:none}}@media (min-width:768px){.sgds-container{max-width:calc(100% - 56px)}.sgds-container-sidebar{max-width:calc(100% - 96px)}.sgds-grid{gap:var(--sgds-gap-xl)}.sgds-col-md-1{grid-column:span 1}.sgds-col-md-2{grid-column:span 2}.sgds-col-md-3{grid-column:span 3}.sgds-col-md-4{grid-column:span 4}.sgds-col-md-5{grid-column:span 5}.sgds-col-md-6{grid-column:span 6}.sgds-col-md-7{grid-column:span 7}.sgds-col-md-8{grid-column:span 8}.sgds-col-md-center-2{grid-column:4/span 2}.sgds-col-md-center-4{grid-column:3/span 4}.sgds-col-md-center-6{grid-column:2/span 6}.sgds-col-sm-none{display:revert}.sgds-col-md-none{display:none}}@media (min-width:1024px){.sgds-grid{grid-template-columns:repeat(12,1fr)}.sgds-container-sidebar{max-width:calc(100% - 96px)}.sgds-container{max-width:var(--sgds-dimension-888)}.sgds-col-lg-1{grid-column:span 1}.sgds-col-lg-2{grid-column:span 2}.sgds-col-lg-3{grid-column:span 3}.sgds-col-lg-4{grid-column:span 4}.sgds-col-lg-5{grid-column:span 5}.sgds-col-lg-6{grid-column:span 6}.sgds-col-lg-7{grid-column:span 7}.sgds-col-lg-8{grid-column:span 8}.sgds-col-lg-9{grid-column:span 9}.sgds-col-lg-10{grid-column:span 10}.sgds-col-lg-11{grid-column:span 11}.sgds-col-lg-12{grid-column:span 12}.sgds-col-lg-center-2{grid-column:6/span 2}.sgds-col-lg-center-4{grid-column:5/span 4}.sgds-col-lg-center-6{grid-column:4/span 6}.sgds-col-lg-center-8{grid-column:3/span 8}.sgds-col-lg-center-10{grid-column:2/span 10}.sgds-col-md-none{display:revert}.sgds-col-lg-none{display:none}}@media (min-width:1280px){.sgds-grid{gap:var(--sgds-gap-2-xl)}.sgds-container{max-width:var(--sgds-dimension-1168)}.sgds-container-sidebar{max-width:calc(100% - 96px)}.sgds-col-xl-1{grid-column:span 1}.sgds-col-xl-2{grid-column:span 2}.sgds-col-xl-3{grid-column:span 3}.sgds-col-xl-4{grid-column:span 4}.sgds-col-xl-5{grid-column:span 5}.sgds-col-xl-6{grid-column:span 6}.sgds-col-xl-7{grid-column:span 7}.sgds-col-xl-8{grid-column:span 8}.sgds-col-xl-9{grid-column:span 9}.sgds-col-xl-10{grid-column:span 10}.sgds-col-xl-11{grid-column:span 11}.sgds-col-xl-12{grid-column:span 12}.sgds-col-xl-center-2{grid-column:6/span 2}.sgds-col-xl-center-4{grid-column:5/span 4}.sgds-col-xl-center-6{grid-column:4/span 6}.sgds-col-xl-center-8{grid-column:3/span 8}.sgds-col-xl-center-10{grid-column:2/span 10}.sgds-col-lg-none{display:revert}.sgds-col-xl-none{display:none}}@media (min-width:1440px){.sgds-container{max-width:var(--sgds-dimension-1312)}.sgds-container-sidebar{max-width:calc(100% - 96px)}.sgds-col-2-xl-1{grid-column:span 1}.sgds-col-2-xl-2{grid-column:span 2}.sgds-col-2-xl-3{grid-column:span 3}.sgds-col-2-xl-4{grid-column:span 4}.sgds-col-2-xl-5{grid-column:span 5}.sgds-col-2-xl-6{grid-column:span 6}.sgds-col-2-xl-7{grid-column:span 7}.sgds-col-2-xl-8{grid-column:span 8}.sgds-col-2-xl-9{grid-column:span 9}.sgds-col-2-xl-10{grid-column:span 10}.sgds-col-2-xl-11{grid-column:span 11}.sgds-col-2-xl-12{grid-column:span 12}.sgds-col-2-xl-center-2{grid-column:6/span 2}.sgds-col-2-xl-center-4{grid-column:5/span 4}.sgds-col-2-xl-center-6{grid-column:4/span 6}.sgds-col-2-xl-center-8{grid-column:3/span 8}.sgds-col-2-xl-center-10{grid-column:2/span 10}.sgds-col-xl-none{display:revert}.sgds-col-2-xl-none{display:none}}@media (min-width:1600px){.sgds-container-sidebar{max-width:min(var(--sgds-dimension-1600),calc(100% - 96px))}.sgds-col-3-xl-1{grid-column:span 1}.sgds-col-3-xl-2{grid-column:span 2}.sgds-col-3-xl-3{grid-column:span 3}.sgds-col-3-xl-4{grid-column:span 4}.sgds-col-3-xl-5{grid-column:span 5}.sgds-col-3-xl-6{grid-column:span 6}.sgds-col-3-xl-7{grid-column:span 7}.sgds-col-3-xl-8{grid-column:span 8}.sgds-col-3-xl-9{grid-column:span 9}.sgds-col-3-xl-10{grid-column:span 10}.sgds-col-3-xl-11{grid-column:span 11}.sgds-col-3-xl-12{grid-column:span 12}.sgds-col-3-xl-center-2{grid-column:6/span 2}.sgds-col-3-xl-center-4{grid-column:5/span 4}.sgds-col-3-xl-center-6{grid-column:4/span 6}.sgds-col-3-xl-center-8{grid-column:3/span 8}.sgds-col-3-xl-center-10{grid-column:2/span 10}.sgds-col-2-xl-none{display:revert}.sgds-col-3-xl-none{display:none}}`;
4
+ var css_248z = css`.sgds-container,.sgds-container-sidebar{margin-left:auto;margin-right:auto;max-width:calc(100% - 40px);width:100%}.sgds-grid{display:grid;gap:var(--sgds-gap-md);grid-template-columns:repeat(4,1fr)}.sgds-col-1{grid-column:span 1}.sgds-col-2{grid-column:span 2}.sgds-col-3{grid-column:span 3}.sgds-col-4{grid-column:span 4}.sgds-col-center-2{grid-column:2/span 2}.sgds-col-none{display:none}@media (min-width:512px){.sgds-grid{grid-template-columns:repeat(8,1fr)}.sgds-container,.sgds-container-sidebar{max-width:calc(100% - 48px)}.sgds-col-sm-1{grid-column:span 1}.sgds-col-sm-2{grid-column:span 2}.sgds-col-sm-3{grid-column:span 3}.sgds-col-sm-4{grid-column:span 4}.sgds-col-sm-5{grid-column:span 5}.sgds-col-sm-6{grid-column:span 6}.sgds-col-sm-7{grid-column:span 7}.sgds-col-sm-8{grid-column:span 8}.sgds-col-sm-center-2{grid-column:4/span 2}.sgds-col-sm-center-4{grid-column:3/span 4}.sgds-col-sm-center-6{grid-column:2/span 6}.sgds-col-none{display:revert}.sgds-col-sm-none{display:none}}@media (min-width:768px){.sgds-container{max-width:calc(100% - 56px)}.sgds-container-sidebar{max-width:calc(100% - 96px)}.sgds-grid{gap:var(--sgds-gap-xl)}.sgds-col-md-1{grid-column:span 1}.sgds-col-md-2{grid-column:span 2}.sgds-col-md-3{grid-column:span 3}.sgds-col-md-4{grid-column:span 4}.sgds-col-md-5{grid-column:span 5}.sgds-col-md-6{grid-column:span 6}.sgds-col-md-7{grid-column:span 7}.sgds-col-md-8{grid-column:span 8}.sgds-col-md-center-2{grid-column:4/span 2}.sgds-col-md-center-4{grid-column:3/span 4}.sgds-col-md-center-6{grid-column:2/span 6}.sgds-col-sm-none{display:revert}.sgds-col-md-none{display:none}}@media (min-width:1024px){.sgds-grid{grid-template-columns:repeat(12,1fr)}.sgds-container-sidebar{max-width:var(--sgds-dimension-840)}.sgds-container{max-width:var(--sgds-dimension-888)}.sgds-col-lg-1{grid-column:span 1}.sgds-col-lg-2{grid-column:span 2}.sgds-col-lg-3{grid-column:span 3}.sgds-col-lg-4{grid-column:span 4}.sgds-col-lg-5{grid-column:span 5}.sgds-col-lg-6{grid-column:span 6}.sgds-col-lg-7{grid-column:span 7}.sgds-col-lg-8{grid-column:span 8}.sgds-col-lg-9{grid-column:span 9}.sgds-col-lg-10{grid-column:span 10}.sgds-col-lg-11{grid-column:span 11}.sgds-col-lg-12{grid-column:span 12}.sgds-col-lg-center-2{grid-column:6/span 2}.sgds-col-lg-center-4{grid-column:5/span 4}.sgds-col-lg-center-6{grid-column:4/span 6}.sgds-col-lg-center-8{grid-column:3/span 8}.sgds-col-lg-center-10{grid-column:2/span 10}.sgds-col-md-none{display:revert}.sgds-col-lg-none{display:none}}@media (min-width:1280px){.sgds-grid{gap:var(--sgds-gap-2-xl)}.sgds-container{max-width:var(--sgds-dimension-1168)}.sgds-container-sidebar{max-width:var(--sgds-dimension-888)}.sgds-col-xl-1{grid-column:span 1}.sgds-col-xl-2{grid-column:span 2}.sgds-col-xl-3{grid-column:span 3}.sgds-col-xl-4{grid-column:span 4}.sgds-col-xl-5{grid-column:span 5}.sgds-col-xl-6{grid-column:span 6}.sgds-col-xl-7{grid-column:span 7}.sgds-col-xl-8{grid-column:span 8}.sgds-col-xl-9{grid-column:span 9}.sgds-col-xl-10{grid-column:span 10}.sgds-col-xl-11{grid-column:span 11}.sgds-col-xl-12{grid-column:span 12}.sgds-col-xl-center-2{grid-column:6/span 2}.sgds-col-xl-center-4{grid-column:5/span 4}.sgds-col-xl-center-6{grid-column:4/span 6}.sgds-col-xl-center-8{grid-column:3/span 8}.sgds-col-xl-center-10{grid-column:2/span 10}.sgds-col-lg-none{display:revert}.sgds-col-xl-none{display:none}}@media (min-width:1440px){.sgds-container{max-width:var(--sgds-dimension-1312)}.sgds-container-sidebar{max-width:var(--sgds-dimension-1024)}.sgds-col-2-xl-1{grid-column:span 1}.sgds-col-2-xl-2{grid-column:span 2}.sgds-col-2-xl-3{grid-column:span 3}.sgds-col-2-xl-4{grid-column:span 4}.sgds-col-2-xl-5{grid-column:span 5}.sgds-col-2-xl-6{grid-column:span 6}.sgds-col-2-xl-7{grid-column:span 7}.sgds-col-2-xl-8{grid-column:span 8}.sgds-col-2-xl-9{grid-column:span 9}.sgds-col-2-xl-10{grid-column:span 10}.sgds-col-2-xl-11{grid-column:span 11}.sgds-col-2-xl-12{grid-column:span 12}.sgds-col-2-xl-center-2{grid-column:6/span 2}.sgds-col-2-xl-center-4{grid-column:5/span 4}.sgds-col-2-xl-center-6{grid-column:4/span 6}.sgds-col-2-xl-center-8{grid-column:3/span 8}.sgds-col-2-xl-center-10{grid-column:2/span 10}.sgds-col-xl-none{display:revert}.sgds-col-2-xl-none{display:none}}`;
5
5
 
6
6
  export { css_248z as default };
7
7
  //# sourceMappingURL=grid.js.map
@@ -18,9 +18,9 @@ var index$b = require('./close-button/index.cjs.js');
18
18
  var index$c = require('./combo-box-option/index.cjs.js');
19
19
  var index$d = require('./combo-box/index.cjs.js');
20
20
  var index$e = require('./datepicker/index.cjs.js');
21
- var index$f = require('./description-list-group/index.cjs.js');
22
- var index$g = require('./description-list/index.cjs.js');
23
- var index$h = require('./divider/index.cjs.js');
21
+ var index$f = require('./divider/index.cjs.js');
22
+ var index$g = require('./description-list-group/index.cjs.js');
23
+ var index$h = require('./description-list/index.cjs.js');
24
24
  var index$i = require('./drawer/index.cjs.js');
25
25
  var index$j = require('./dropdown-item/index.cjs.js');
26
26
  var index$k = require('./dropdown/index.cjs.js');
@@ -94,9 +94,9 @@ exports.SgdsCloseButton = index$b["default"];
94
94
  exports.SgdsComboBoxOption = index$c["default"];
95
95
  exports.SgdsComboBox = index$d["default"];
96
96
  exports.SgdsDatepicker = index$e["default"];
97
- exports.SgdsDescriptionListGroup = index$f["default"];
98
- exports.SgdsDescriptionList = index$g["default"];
99
- exports.SgdsDivider = index$h["default"];
97
+ exports.SgdsDivider = index$f["default"];
98
+ exports.SgdsDescriptionListGroup = index$g["default"];
99
+ exports.SgdsDescriptionList = index$h["default"];
100
100
  exports.SgdsDrawer = index$i["default"];
101
101
  exports.SgdsDropdownItem = index$j["default"];
102
102
  exports.SgdsDropdown = index$k["default"];
package/react/index.d.ts CHANGED
@@ -13,9 +13,9 @@ export { default as SgdsCloseButton } from './close-button';
13
13
  export { default as SgdsComboBoxOption } from './combo-box-option';
14
14
  export { default as SgdsComboBox } from './combo-box';
15
15
  export { default as SgdsDatepicker } from './datepicker';
16
+ export { default as SgdsDivider } from './divider';
16
17
  export { default as SgdsDescriptionListGroup } from './description-list-group';
17
18
  export { default as SgdsDescriptionList } from './description-list';
18
- export { default as SgdsDivider } from './divider';
19
19
  export { default as SgdsDrawer } from './drawer';
20
20
  export { default as SgdsDropdownItem } from './dropdown-item';
21
21
  export { default as SgdsDropdown } from './dropdown';
package/react/index.js CHANGED
@@ -14,9 +14,9 @@ export { default as SgdsCloseButton } from './close-button/index.js';
14
14
  export { default as SgdsComboBoxOption } from './combo-box-option/index.js';
15
15
  export { default as SgdsComboBox } from './combo-box/index.js';
16
16
  export { default as SgdsDatepicker } from './datepicker/index.js';
17
+ export { default as SgdsDivider } from './divider/index.js';
17
18
  export { default as SgdsDescriptionListGroup } from './description-list-group/index.js';
18
19
  export { default as SgdsDescriptionList } from './description-list/index.js';
19
- export { default as SgdsDivider } from './divider/index.js';
20
20
  export { default as SgdsDrawer } from './drawer/index.js';
21
21
  export { default as SgdsDropdownItem } from './dropdown-item/index.js';
22
22
  export { default as SgdsDropdown } from './dropdown/index.js';
package/themes/root.css CHANGED
@@ -131,7 +131,6 @@
131
131
  --sgds-breakpoint-sbar-lg: var(--sgds-dimension-1024);
132
132
  --sgds-breakpoint-sbar-xl: var(--sgds-dimension-1280);
133
133
  --sgds-breakpoint-sbar-2-xl: var(--sgds-dimension-1440);
134
- --sgds-breakpoint-sbar-3-xl: var(--sgds-dimension-1600);
135
134
 
136
135
  /* Primitive - Font Family */
137
136
  --sgds-font-family-brand: "Inter", system-ui, sans-serif;
@@ -301,7 +300,6 @@
301
300
  --sgds-dimension-1280: 1280px;
302
301
  --sgds-dimension-1312: 1312px;
303
302
  --sgds-dimension-1440: 1440px;
304
- --sgds-dimension-1600: 1600px;
305
303
 
306
304
  /* Semantic - Padding */
307
305
  --sgds-padding-none: var(--sgds-spacer-0);
package/types/react.d.ts CHANGED
@@ -413,6 +413,8 @@ We still expose `.value` externally, but this is now the underlying ID or data
413
413
  invalidFeedback?: string;
414
414
  /** Marks the component as invalid. Replace the pseudo :invalid selector. */
415
415
  invalid?: boolean;
416
+ /** Controlling of autocomplete behaviour */
417
+ autocomplete?: string;
416
418
  /** The list of items to display in the dropdown.
417
419
  `interface SgdsComboBoxItemData {
418
420
  label: string;
@@ -524,6 +526,15 @@ range mode as array of string. eg.'["22/12/2023"]' for single &
524
526
  onSgdsAfterHide?: SgdsEventHandler;
525
527
  }
526
528
 
529
+ // ── Divider ─────────────────────────────────────────────────────────────
530
+
531
+ export interface SgdsDividerProps extends SgdsBaseProps {
532
+ /** Sets the orientation of divider to vertical. Defaults to horizontal */
533
+ orientation?: "horizontal" | "vertical";
534
+ /** Sets the orientation of divider to vertical. Defaults to false */
535
+ thickness?: "thin" | "thick" | "thicker";
536
+ }
537
+
527
538
  // ── DescriptionListGroup ─────────────────────────────────────────────────────────────
528
539
 
529
540
  export interface SgdsDescriptionListGroupProps extends SgdsBaseProps {
@@ -546,15 +557,6 @@ export interface SgdsDescriptionListProps extends SgdsBaseProps {
546
557
  bordered?: boolean;
547
558
  }
548
559
 
549
- // ── Divider ─────────────────────────────────────────────────────────────
550
-
551
- export interface SgdsDividerProps extends SgdsBaseProps {
552
- /** Sets the orientation of divider to vertical. Defaults to horizontal */
553
- orientation?: "horizontal" | "vertical";
554
- /** Sets the orientation of divider to vertical. Defaults to false */
555
- thickness?: "thin" | "thick" | "thicker";
556
- }
557
-
558
560
  // ── Drawer ─────────────────────────────────────────────────────────────
559
561
 
560
562
  export interface SgdsDrawerProps extends SgdsBaseProps {
@@ -830,6 +832,8 @@ export interface SgdsInputProps extends SgdsBaseProps {
830
832
  autofocus?: boolean;
831
833
  /** Makes the input readonly. */
832
834
  readonly?: boolean;
835
+ /** Controlling of autocomplete behaviour */
836
+ autocomplete?: string;
833
837
  /** Specifies the granularity that the value must adhere to, or the special value `any` which means no stepping is
834
838
  implied, allowing any numeric value. Only applies to number input types. */
835
839
  step?: number | "any";
@@ -1139,6 +1143,8 @@ We still expose `.value` externally, but this is now the underlying ID or data
1139
1143
  invalidFeedback?: string;
1140
1144
  /** Marks the component as invalid. Replace the pseudo :invalid selector. */
1141
1145
  invalid?: boolean;
1146
+ /** Controlling of autocomplete behaviour */
1147
+ autocomplete?: string;
1142
1148
  /** The list of items to display in the dropdown.
1143
1149
  `interface SgdsComboBoxItemData {
1144
1150
  label: string;
@@ -1689,9 +1695,9 @@ declare module "react" {
1689
1695
  "sgds-combo-box-option": React.DetailedHTMLProps<SgdsComboBoxOptionProps, HTMLElement>;
1690
1696
  "sgds-combo-box": React.DetailedHTMLProps<SgdsComboBoxProps, HTMLElement>;
1691
1697
  "sgds-datepicker": React.DetailedHTMLProps<SgdsDatepickerProps, HTMLElement>;
1698
+ "sgds-divider": React.DetailedHTMLProps<SgdsDividerProps, HTMLElement>;
1692
1699
  "sgds-description-list-group": React.DetailedHTMLProps<SgdsDescriptionListGroupProps, HTMLElement>;
1693
1700
  "sgds-description-list": React.DetailedHTMLProps<SgdsDescriptionListProps, HTMLElement>;
1694
- "sgds-divider": React.DetailedHTMLProps<SgdsDividerProps, HTMLElement>;
1695
1701
  "sgds-drawer": React.DetailedHTMLProps<SgdsDrawerProps, HTMLElement>;
1696
1702
  "sgds-dropdown-item": React.DetailedHTMLProps<SgdsDropdownItemProps, HTMLElement>;
1697
1703
  "sgds-dropdown": React.DetailedHTMLProps<SgdsDropdownProps, HTMLElement>;
@@ -1772,9 +1778,9 @@ declare global {
1772
1778
  "sgds-combo-box-option": HTMLElement;
1773
1779
  "sgds-combo-box": HTMLElement;
1774
1780
  "sgds-datepicker": HTMLElement;
1781
+ "sgds-divider": HTMLElement;
1775
1782
  "sgds-description-list-group": HTMLElement;
1776
1783
  "sgds-description-list": HTMLElement;
1777
- "sgds-divider": HTMLElement;
1778
1784
  "sgds-drawer": HTMLElement;
1779
1785
  "sgds-dropdown-item": HTMLElement;
1780
1786
  "sgds-dropdown": HTMLElement;