@govtechsg/sgds-web-component 3.21.2-rc.5 → 3.23.0-rc.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 (59) hide show
  1. package/base/select-element.d.ts +2 -0
  2. package/base/select-element.js +5 -0
  3. package/base/select-element.js.map +1 -1
  4. package/components/Breadcrumb/index.umd.min.js +1 -1
  5. package/components/Breadcrumb/index.umd.min.js.map +1 -1
  6. package/components/ComboBox/index.umd.min.js +4 -2
  7. package/components/ComboBox/index.umd.min.js.map +1 -1
  8. package/components/ComboBox/sgds-combo-box.js +2 -0
  9. package/components/ComboBox/sgds-combo-box.js.map +1 -1
  10. package/components/Datepicker/index.umd.min.js +3 -2
  11. package/components/Datepicker/index.umd.min.js.map +1 -1
  12. package/components/Footer/index.umd.min.js +1 -1
  13. package/components/Footer/index.umd.min.js.map +1 -1
  14. package/components/Input/index.umd.min.js +3 -2
  15. package/components/Input/index.umd.min.js.map +1 -1
  16. package/components/Input/sgds-input.d.ts +2 -0
  17. package/components/Input/sgds-input.js +6 -0
  18. package/components/Input/sgds-input.js.map +1 -1
  19. package/components/Link/index.umd.min.js +1 -1
  20. package/components/Link/index.umd.min.js.map +1 -1
  21. package/components/Link/link.js +1 -1
  22. package/components/QuantityToggle/index.umd.min.js +3 -2
  23. package/components/QuantityToggle/index.umd.min.js.map +1 -1
  24. package/components/Select/index.umd.min.js +2 -2
  25. package/components/Select/index.umd.min.js.map +1 -1
  26. package/components/Sidenav/index.umd.min.js +5 -4
  27. package/components/Sidenav/index.umd.min.js.map +1 -1
  28. package/components/Sidenav/sgds-sidenav-item.d.ts +4 -0
  29. package/components/Sidenav/sgds-sidenav-item.js +5 -0
  30. package/components/Sidenav/sgds-sidenav-item.js.map +1 -1
  31. package/components/index.umd.min.js +10 -6
  32. package/components/index.umd.min.js.map +1 -1
  33. package/css/fouc.css +2 -2
  34. package/custom-elements.json +1145 -1032
  35. package/index.umd.min.js +10 -6
  36. package/index.umd.min.js.map +1 -1
  37. package/package.json +1 -1
  38. package/react/base/select-element.cjs.js +5 -0
  39. package/react/base/select-element.cjs.js.map +1 -1
  40. package/react/base/select-element.js +5 -0
  41. package/react/base/select-element.js.map +1 -1
  42. package/react/components/ComboBox/sgds-combo-box.cjs.js +2 -0
  43. package/react/components/ComboBox/sgds-combo-box.cjs.js.map +1 -1
  44. package/react/components/ComboBox/sgds-combo-box.js +2 -0
  45. package/react/components/ComboBox/sgds-combo-box.js.map +1 -1
  46. package/react/components/Input/sgds-input.cjs.js +6 -0
  47. package/react/components/Input/sgds-input.cjs.js.map +1 -1
  48. package/react/components/Input/sgds-input.js +6 -0
  49. package/react/components/Input/sgds-input.js.map +1 -1
  50. package/react/components/Link/link.cjs.js +1 -1
  51. package/react/components/Link/link.js +1 -1
  52. package/react/components/Sidenav/sgds-sidenav-item.cjs.js +5 -0
  53. package/react/components/Sidenav/sgds-sidenav-item.cjs.js.map +1 -1
  54. package/react/components/Sidenav/sgds-sidenav-item.js +5 -0
  55. package/react/components/Sidenav/sgds-sidenav-item.js.map +1 -1
  56. package/react/index.cjs.js +10 -10
  57. package/react/index.d.ts +2 -2
  58. package/react/index.js +2 -2
  59. package/types/react.d.ts +52 -44
@@ -60,7 +60,7 @@ const ke=1;class Pe{constructor(e){}get _$isConnected(){return this._$parent._$i
60
60
  <slot @click=${this.onToggle}></slot>
61
61
  </div>
62
62
  </nav>
63
- `}}function Oe(e,t,l){return new Promise(a=>{if((null==l?void 0:l.duration)===1/0)throw new Error("Promise-based animations must be finite.");const i=e.animate(t,Object.assign(Object.assign({},l),{duration:Ue()?0:null==l?void 0:l.duration}));i.addEventListener("cancel",a,{once:!0}),i.addEventListener("finish",a,{once:!0})})}function Ue(){return window.matchMedia("(prefers-reduced-motion: reduce)").matches}function Ie(e,t){return e.map(e=>Object.assign(Object.assign({},e),{height:"auto"===e.height?`${t}px`:e.height}))}function De(e){return Promise.all(e.getAnimations().map(e=>new Promise(t=>{const l=requestAnimationFrame(t);e.addEventListener("cancel",()=>l,{once:!0}),e.addEventListener("finish",()=>l,{once:!0}),e.cancel()})))}Ne.styles=[...Se.styles,ze],e([Ve({type:Boolean,attribute:!0})],Ne.prototype,"sticky",void 0),e([Le()],Ne.prototype,"defaultNodes",void 0);const Re=new Map,We=new WeakMap;function je(e,t){const l=We.get(e);if(null==l?void 0:l[t])return l[t];const a=Re.get(t);return a||{keyframes:[],options:{duration:0}}}function qe(e,t){Re.set(e,function(e){return null!=e?e:{keyframes:[],options:{duration:0}}}(t))}function Fe(e,t){return new Promise(l=>{e.addEventListener(t,function a(i){i.target===e&&(e.removeEventListener(t,a),l())})})}function Je(e="",t=""){return`id-${Math.random().toString().substring(2,6)}-sgds-${e}-${t}`}function Ke(e,t){const l=Object.assign({waitUntilFirstUpdate:!1},t);return(t,a)=>{const{update:i}=t;if(e in t){const c=e;t.update=function(e){if(e.has(c)){const t=e.get(c),i=this[c];t!==i&&(l.waitUntilFirstUpdate&&!this.hasUpdated||this[a](t,i))}i.call(this,e)}}}}var Ye=Q`
63
+ `}}Ne.styles=[...Se.styles,ze],e([Ve({type:Boolean,attribute:!0})],Ne.prototype,"sticky",void 0),e([Le()],Ne.prototype,"defaultNodes",void 0);function Oe(e,t,l){return new Promise(a=>{if((null==l?void 0:l.duration)===1/0)throw new Error("Promise-based animations must be finite.");const i=e.animate(t,Object.assign(Object.assign({},l),{duration:Ue()?0:null==l?void 0:l.duration}));i.addEventListener("cancel",a,{once:!0}),i.addEventListener("finish",a,{once:!0})})}function Ue(){return window.matchMedia("(prefers-reduced-motion: reduce)").matches}function Ie(e,t){return e.map(e=>Object.assign(Object.assign({},e),{height:"auto"===e.height?`${t}px`:e.height}))}function De(e){return Promise.all(e.getAnimations().map(e=>new Promise(t=>{const l=requestAnimationFrame(t);e.addEventListener("cancel",()=>l,{once:!0}),e.addEventListener("finish",()=>l,{once:!0}),e.cancel()})))}const Re=new Map,We=new WeakMap;function je(e,t){const l=We.get(e);if(null==l?void 0:l[t])return l[t];const a=Re.get(t);return a||{keyframes:[],options:{duration:0}}}function qe(e,t){Re.set(e,function(e){return null!=e?e:{keyframes:[],options:{duration:0}}}(t))}function Fe(e,t){return new Promise(l=>{e.addEventListener(t,function a(i){i.target===e&&(e.removeEventListener(t,a),l())})})}function Je(e="",t=""){return`id-${Math.random().toString().substring(2,6)}-sgds-${e}-${t}`}function Ke(e,t){const l=Object.assign({waitUntilFirstUpdate:!1},t);return(t,a)=>{const{update:i}=t;if(e in t){const c=e;t.update=function(e){if(e.has(c)){const t=e.get(c),i=this[c];t!==i&&(l.waitUntilFirstUpdate&&!this.hasUpdated||this[a](t,i))}i.call(this,e)}}}}var Ye=Q`
64
64
  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
65
65
  <path
66
66
  fill="currentColor"
@@ -2284,6 +2284,7 @@ const ke=1;class Pe{constructor(e){}get _$isConnected(){return this._$parent._$i
2284
2284
  aria-expanded=${this.active}
2285
2285
  aria-controls=${this._collapseId}
2286
2286
  aria-current=${this.active}
2287
+ aria-label=${t=this.ariaLabel,t??le}
2287
2288
  id=${this._buttonId}
2288
2289
  ?disabled=${this.disabled}
2289
2290
  aria-disabled=${this.disabled?"true":"false"}
@@ -2299,7 +2300,7 @@ const ke=1;class Pe{constructor(e){}get _$isConnected(){return this._$parent._$i
2299
2300
  <slot class="default" @slotchange=${this._handleSlotChange}></slot>
2300
2301
  </div>
2301
2302
  </div>
2302
- `,t=Q` <slot @slotchange=${this._handleSlotChange} class="no-menu-default"></slot> `;return Q`
2303
- <div class="sidenav-item" aria-haspopup="${!this.isLink}">${this.isLink?t:e}</div>
2304
- `}}ut.styles=[...Se.styles,wt],ut.dependencies={"sgds-icon":gt},e([$e(".sidenav-body")],ut.prototype,"body",void 0),e([$e(".sidenav-btn")],ut.prototype,"header",void 0),e([Ve({type:Boolean,reflect:!0})],ut.prototype,"active",void 0),e([Ve({type:Boolean,reflect:!0})],ut.prototype,"disabled",void 0),e([Ve({...pt,state:!0,attribute:!1})],ut.prototype,"isLink",void 0),e([Ke("active",{waitUntilFirstUpdate:!0})],ut.prototype,"_handleOpenChange",null),e([Le()],ut.prototype,"_items",void 0),qe("sidenav.show",{keyframes:[{height:"0",opacity:"0"},{height:"auto",opacity:"1"}],options:{duration:200,easing:"ease-in-out"}}),qe("sidenav.hide",{keyframes:[{height:"auto",opacity:"1"},{height:"0",opacity:"0"}],options:{duration:200,easing:"ease-in-out"}});var ft=o`:host([class^=third-level]) ::slotted(a){padding-left:calc(var(--sgds-padding-xl) + var(--sgds-padding-3-xl))}::slotted(a){--sgds-link-color-default:var(--sgds-color-default);border-radius:var(--sgds-border-radius-md);color:var(--sgds-color-default,var(--sgds-link-color-default));display:block;padding:var(--sgds-padding-sm) var(--sgds-padding-sm) var(--sgds-padding-sm) var(--sgds-padding-3-xl);text-decoration:none!important}:host([active]) ::slotted(a){--sgds-link-color-default:var(--sgds-primary-color-emphasis);background-color:var(--sgds-primary-surface-translucent);color:var(--sgds-primary-color-emphasis,var(--sgds-link-color-default))}:host(:not([disabled]):not([active])) ::slotted(a:hover){background-color:var(--sgds-bg-translucent-subtle)}::slotted(a:focus),::slotted(a:focus-visible),::slotted(a:hover){--sgds-link-color-emphasis:var(--sgds-color-default);color:var(--sgds-color-default,var(--sgds-link-color-emphasis))}:host([active]) ::slotted(a:focus),:host([active]) ::slotted(a:focus-visible),:host([active]) ::slotted(a:hover){--sgds-link-color-emphasis:var(--sgds-primary-color-emphasis);color:var(--sgds-primary-color-emphasis,var(--sgds-link-color-emphasis))}:host([disabled]) ::slotted(a){opacity:var(--sgds-opacity-40);pointer-events:none}:host([disabled]) ::slotted(a:focus),:host([disabled]) ::slotted(a:focus-visible){outline:0}::slotted(a:focus),::slotted(a:focus-visible){background-color:var(--sgds-bg-translucent-subtle)}::slotted(a:focus-visible){outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}:host([active]) ::slotted(a:focus),:host([active]) ::slotted(a:focus-visible){background-color:var(--sgds-primary-bg-translucent)}`;class mt extends Se{constructor(){super(...arguments),this.active=!1,this.disabled=!1}connectedCallback(){super.connectedCallback(),this.setAttribute("aria-disabled",`${this.disabled}`)}_handleDisabled(){this.setAttribute("aria-disabled",`${this.disabled}`),this._anchor[0].setAttribute("aria-disabled",`${this.disabled}`),this.disabled||this._anchor[0].removeAttribute("tabindex")}_handleSlotChange(){this._anchor[0].setAttribute("aria-disabled",`${this.disabled}`),this.disabled&&(this._anchor[0].setAttribute("tabindex","-1"),this._anchor[0].removeAttribute("href"),this._anchor[0].setAttribute("role","link"))}render(){return Q` <slot @slotchange=${this._handleSlotChange}></slot> `}}function Zt(e,t){customElements.get(e)||customElements.define(e,t)}mt.styles=[...Se.styles,ft],e([Ve({type:Boolean,reflect:!0})],mt.prototype,"active",void 0),e([Ve({type:Boolean,reflect:!0})],mt.prototype,"disabled",void 0),e([Le({flatten:!0})],mt.prototype,"_anchor",void 0),e([Ke("disabled",{waitUntilFirstUpdate:!0})],mt.prototype,"_handleDisabled",null),Zt("sgds-sidenav",Ne),Zt("sgds-sidenav-item",ut),Zt("sgds-sidenav-link",mt)});
2303
+ `;var t;const l=Q` <slot @slotchange=${this._handleSlotChange} class="no-menu-default"></slot> `;return Q`
2304
+ <div class="sidenav-item" aria-haspopup="${!this.isLink}">${this.isLink?l:e}</div>
2305
+ `}}ut.styles=[...Se.styles,wt],ut.dependencies={"sgds-icon":gt},e([$e(".sidenav-body")],ut.prototype,"body",void 0),e([$e(".sidenav-btn")],ut.prototype,"header",void 0),e([Ve({type:Boolean,reflect:!0})],ut.prototype,"active",void 0),e([Ve({type:Boolean,reflect:!0})],ut.prototype,"disabled",void 0),e([Ve({type:String})],ut.prototype,"ariaLabel",void 0),e([Ve({...pt,state:!0,attribute:!1})],ut.prototype,"isLink",void 0),e([Ke("active",{waitUntilFirstUpdate:!0})],ut.prototype,"_handleOpenChange",null),e([Le()],ut.prototype,"_items",void 0),qe("sidenav.show",{keyframes:[{height:"0",opacity:"0"},{height:"auto",opacity:"1"}],options:{duration:200,easing:"ease-in-out"}}),qe("sidenav.hide",{keyframes:[{height:"auto",opacity:"1"},{height:"0",opacity:"0"}],options:{duration:200,easing:"ease-in-out"}});var ft=o`:host([class^=third-level]) ::slotted(a){padding-left:calc(var(--sgds-padding-xl) + var(--sgds-padding-3-xl))}::slotted(a){--sgds-link-color-default:var(--sgds-color-default);border-radius:var(--sgds-border-radius-md);color:var(--sgds-color-default,var(--sgds-link-color-default));display:block;padding:var(--sgds-padding-sm) var(--sgds-padding-sm) var(--sgds-padding-sm) var(--sgds-padding-3-xl);text-decoration:none!important}:host([active]) ::slotted(a){--sgds-link-color-default:var(--sgds-primary-color-emphasis);background-color:var(--sgds-primary-surface-translucent);color:var(--sgds-primary-color-emphasis,var(--sgds-link-color-default))}:host(:not([disabled]):not([active])) ::slotted(a:hover){background-color:var(--sgds-bg-translucent-subtle)}::slotted(a:focus),::slotted(a:focus-visible),::slotted(a:hover){--sgds-link-color-emphasis:var(--sgds-color-default);color:var(--sgds-color-default,var(--sgds-link-color-emphasis))}:host([active]) ::slotted(a:focus),:host([active]) ::slotted(a:focus-visible),:host([active]) ::slotted(a:hover){--sgds-link-color-emphasis:var(--sgds-primary-color-emphasis);color:var(--sgds-primary-color-emphasis,var(--sgds-link-color-emphasis))}:host([disabled]) ::slotted(a){opacity:var(--sgds-opacity-40);pointer-events:none}:host([disabled]) ::slotted(a:focus),:host([disabled]) ::slotted(a:focus-visible){outline:0}::slotted(a:focus),::slotted(a:focus-visible){background-color:var(--sgds-bg-translucent-subtle)}::slotted(a:focus-visible){outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}:host([active]) ::slotted(a:focus),:host([active]) ::slotted(a:focus-visible){background-color:var(--sgds-primary-bg-translucent)}`;class mt extends Se{constructor(){super(...arguments),this.active=!1,this.disabled=!1}connectedCallback(){super.connectedCallback(),this.setAttribute("aria-disabled",`${this.disabled}`)}_handleDisabled(){this.setAttribute("aria-disabled",`${this.disabled}`),this._anchor[0].setAttribute("aria-disabled",`${this.disabled}`),this.disabled||this._anchor[0].removeAttribute("tabindex")}_handleSlotChange(){this._anchor[0].setAttribute("aria-disabled",`${this.disabled}`),this.disabled&&(this._anchor[0].setAttribute("tabindex","-1"),this._anchor[0].removeAttribute("href"),this._anchor[0].setAttribute("role","link"))}render(){return Q` <slot @slotchange=${this._handleSlotChange}></slot> `}}function Zt(e,t){customElements.get(e)||customElements.define(e,t)}mt.styles=[...Se.styles,ft],e([Ve({type:Boolean,reflect:!0})],mt.prototype,"active",void 0),e([Ve({type:Boolean,reflect:!0})],mt.prototype,"disabled",void 0),e([Le({flatten:!0})],mt.prototype,"_anchor",void 0),e([Ke("disabled",{waitUntilFirstUpdate:!0})],mt.prototype,"_handleDisabled",null),Zt("sgds-sidenav",Ne),Zt("sgds-sidenav-item",ut),Zt("sgds-sidenav-link",mt)});
2305
2306
  //# sourceMappingURL=index.umd.min.js.map