@skdx/react 0.29.0 → 0.31.0

package/dist/utils/field-core.d.ts

@@ -46,6 +46,8 @@ export interface FieldCharacterCountOptions {
 export declare function characterCountMessage(remaining: number): string;
 /** Whether a count has passed its threshold and should be rendered/announced. */
 export declare function characterCountVisible(count: number, maxLength: number, threshold?: number): boolean;
+/** Joins a Field's messages into one string, separated by a period unless a message already ends in sentence punctuation. */
+export declare function joinFieldMessages(messages: string[]): string;
 /** Fallback message when native constraint validation has no `validationMessage`. */
 export declare const NATIVE_INVALID_FALLBACK_MESSAGE = "This field is invalid.";
 /** Marks an element as this Field's control, an escape hatch for composites in shadow DOM. */

package/dist/utils/field-core.js

@@ -1,2 +1,2 @@
 'use client';
-var C="validity-change",a="data-skdx-field",u="data-skdx-field-name",p="data-skdx-field-message",F="data-skdx-field-description",I="data-skdx-field-error",$="data-skdx-field-character-count",E="data-skdx-field-pending",c="data-skdx-field-resubmit",m="data-skdx-form-field",_="data-skdx-form-message",G=["validity-change","invalid","change","blur"],D="data-skdx-error-summary",j=1e3;function M(i){let e=Math.abs(i),t=e===1?"character":"characters";return i<0?`You have ${e} ${t} too many`:`You have ${e} ${t} remaining`}function V(i,e,t=0){return t<=0?!0:i>=e*t/100}var O="This field is invalid.",w="data-skdx-field-control",x=[`[${w}]`,'input:not([type="hidden"])',"select","textarea",'[role="textbox"]','[role="searchbox"]','[role="combobox"]','[role="listbox"]','[role="radiogroup"]','[role="group"]','[role="slider"]','[role="spinbutton"]','[role="checkbox"]','[role="radio"]','[role="switch"]'].join(", "),Y="data-skdx-field-required-indicator",k=new Set(["INPUT","SELECT","TEXTAREA"]),R=new Set(["radiogroup","group"]),B=['input:not([disabled]):not([type="hidden"])',"select:not([disabled])","textarea:not([disabled])","button:not([disabled])",'[tabindex]:not([tabindex="-1"])'].join(", ");function T(i){return i==null?[]:(Array.isArray(i)?i:[i]).filter(t=>typeof t=="string"&&t.trim()!=="")}function S(i){for(let e of Array.from(i.querySelectorAll(x)))if(e.getAttribute("aria-hidden")!=="true"&&e.closest(`[${a}]`)===i)return e;return null}function f(i,e){return v(i,a,e)}function v(i,e,t){for(let r of Array.from(i.querySelectorAll(t)))if(r.closest(`[${e}]`)===i)return r;return null}function P(i){if(!i)return;let e=i;return e.type==="checkbox"||e.type==="radio"?e.checked:"value"in i?e.value:i.querySelector('input[aria-hidden="true"]')?.value}function d(i){return i==null||i===!1||i===""?!1:!(Array.isArray(i)&&i.length===0)}function o(i,e,t){t?i.setAttribute(e,""):i.removeAttribute(e)}function y(i,...e){let t=i.split(/\s+/).filter(Boolean);for(let r of e)r&&!t.includes(r)&&t.push(r);return t.join(" ")}function z(i){return i.closest("form, skdx-form")??i.parentElement??i}function N(i){let e=S(i),r=f(i,`[${I}]`)?.textContent?.trim()||i.getAttribute(p)||i.getAttribute(u)||"";return!e?.id||!r?[]:[{id:e.id,message:r}]}function H(i){let e=v(i,m,x);if(!e?.id||e.getAttribute("aria-invalid")!=="true")return[];let r=v(i,m,`[${_}]:not([hidden])`)?.textContent?.trim()||i.getAttribute(u)||"";return r?[{id:e.id,message:r}]:[]}function K(i){return Array.from(i.querySelectorAll(`[${a}][data-invalid], [${m}]`)).flatMap(t=>(t.hasAttribute(a)?N:H)(t))}var b="__skdxFieldCheckValidity",g="__skdxFieldReset";async function Q(i){let e=Array.from(i.querySelectorAll(`[${a}]`));return(await Promise.all(e.map(r=>r[b]?.()??Promise.resolve(!0)))).every(Boolean)}function X(i){for(let e of Array.from(i.querySelectorAll(`[${a}]`)))e[g]?.()}function J(i,e=document){let t=e.getElementById(i);if(!t)return;let r=t.getAttribute("role"),s=(t.tagName==="FIELDSET"||r!==null&&R.has(r)?t.querySelector(B):null)??t;s.focus(),s.scrollIntoView?.({block:"center"})}var A=class{constructor(e){this.options=e;this.props={};this.root=null;this.form=null;this.control=null;this.baseDescribedBy="";this.baseLabelledBy="";this.wroteLabelledBy=!1;this.wroteRequired=!1;this.wroteDisabled=!1;this.wroteGroupDisabled=!1;this.runToken=0;this.pending=!1;this.injected=[];this.custom=[];this.characterCount=null;this.awaitingSubmit=!1;this.handleInput=()=>{let e=this.isOverLimit(this.snapshot.count),t=this.readCount();this.update({dirty:!0,filled:d(this.resolveValue()),count:t,errors:this.composeErrors(t)}),this.scheduleCountAnnouncement(t,e),(this.props.mode==="change"||this.snapshot.errors.length>0)&&this.scheduleValidation()};this.handleFocusOut=()=>{let e=this.readCount();this.update({touched:!0,filled:d(this.resolveValue()),count:e,errors:this.composeErrors(e)});let t=this.validationTimer!==void 0;clearTimeout(this.validationTimer),this.validationTimer=void 0;let r=this.props.mode??"blur";(t||r==="blur"||this.snapshot.errors.length>0)&&this.runValidation()};this.handleSubmit=e=>{if(!this.form)return;let t=e.target;if(t!==this.form&&t?.closest?.("form")!==this.form||this.isEngineResubmit(e))return;this.markTouched();let r=this.runValidation({silent:this.hasErrorSummary()});if(L(r)){e.preventDefault(),this.awaitingSubmit=!0,Promise.resolve(r).then(()=>{this.awaitingSubmit&&(this.awaitingSubmit=!1,this.resubmitIfSettled())});return}(r.length>0||this.pending)&&e.preventDefault()};this.snapshot={controlId:"",errors:[],valid:!0,touched:!1,dirty:!1,filled:!1,count:0,validity:null}}get state(){return this.snapshot}setProps(e){let t=this.props.value;this.props=e;let r=T(e.errors??null),n=!q(this.injected,r);n&&(this.injected=r);let s=e.value!==t;if(!n&&!s)return;let l=this.readCount();this.update({count:l,filled:d(this.resolveValue()),errors:this.composeErrors(l)})}setCharacterCount(e){if((this.characterCount?.maxLength??null)===(e?.maxLength??null)&&(this.characterCount?.threshold??0)===(e?.threshold??0))return;this.characterCount=e;let r=this.readCount();this.update({count:r,errors:this.composeErrors(r)})}readCount(){let e=this.resolveValue();return typeof e=="string"?e.length:0}countMessage(e){return(this.props.getCharacterCountMessage??M)(e)}isOverLimit(e){return this.characterCount!==null&&e>this.characterCount.maxLength}composeErrors(e=this.snapshot.count){let t=[...this.injected,...this.custom];return this.characterCount&&this.isOverLimit(e)&&t.push(this.countMessage(this.characterCount.maxLength-e)),t}scheduleCountAnnouncement(e,t){let r=this.characterCount;if(!r)return;if(clearTimeout(this.announceTimer),this.isOverLimit(e)){t||this.options.announce(this.countMessage(r.maxLength-e),"assertive");return}if(!V(e,r.maxLength,r.threshold))return;let n=r.maxLength-e;this.announceTimer=setTimeout(()=>{this.options.announce(this.countMessage(n),"polite")},1e3)}connect(e){this.root=e,e.setAttribute(a,""),Object.defineProperty(e,b,{value:()=>this.validate(),configurable:!0,enumerable:!1,writable:!0}),Object.defineProperty(e,g,{value:()=>this.reset(),configurable:!0,enumerable:!1,writable:!0}),e.addEventListener("input",this.handleInput,!0),e.addEventListener("change",this.handleInput,!0),e.addEventListener("focusout",this.handleFocusOut,!0),this.form=e.closest("form"),this.form&&e.ownerDocument.addEventListener("submit",this.handleSubmit,!0),this.sync();let t=this.readCount();this.update({filled:d(this.resolveValue()),count:t,errors:this.composeErrors(t)})}disconnect(){clearTimeout(this.announceTimer),clearTimeout(this.validationTimer),this.validationTimer=void 0,this.awaitingSubmit=!1;let e=this.root;e&&(e.removeEventListener("input",this.handleInput,!0),e.removeEventListener("change",this.handleInput,!0),e.removeEventListener("focusout",this.handleFocusOut,!0),this.form&&e.ownerDocument.removeEventListener("submit",this.handleSubmit,!0),delete e[b],delete e[g],this.root=null,this.form=null,this.control=null)}sync(){let e=this.root;if(!e)return;let t=S(e);t!==this.control&&(this.control=t,this.baseDescribedBy=t?.getAttribute("aria-describedby")??"",this.baseLabelledBy=t?.getAttribute("aria-labelledby")??"",this.wroteLabelledBy=!1,this.wroteRequired=!1,this.wroteDisabled=!1,this.wroteGroupDisabled=!1);let{name:r}=this.props;r?e.setAttribute(u,r):e.removeAttribute(u);let n=this.snapshot.errors.join(" ");n?e.setAttribute(p,n):e.removeAttribute(p),this.applyStateAttributes(e),t&&(t.id||(t.id=this.options.controlId),t.id!==this.snapshot.controlId&&(this.snapshot={...this.snapshot,controlId:t.id,validity:this.readValidity()},this.options.onSnapshotChange(this.snapshot)),this.applyDescribedBy(e,t),this.snapshot.errors.length>0?t.setAttribute("aria-invalid","true"):t.removeAttribute("aria-invalid"),this.applyLabelledBy(e,t),this.applyConstraintState(t),this.applyStateAttributes(t))}applyDescribedBy(e,t){let r=f(e,`[${F}]`)!==null,n=f(e,`[${I}]`)!==null,s=y(this.baseDescribedBy,r?this.options.descriptionId:void 0,n?this.options.errorId:void 0);s?t.setAttribute("aria-describedby",s):t.removeAttribute("aria-describedby")}applyLabelledBy(e,t){let r=e.ownerDocument.getElementById(this.options.labelId)!==null;this.options.grouped&&r?(t.setAttribute("aria-labelledby",y(this.baseLabelledBy,this.options.labelId)),this.wroteLabelledBy=!0):this.wroteLabelledBy&&(this.baseLabelledBy?t.setAttribute("aria-labelledby",this.baseLabelledBy):t.removeAttribute("aria-labelledby"),this.wroteLabelledBy=!1)}applyConstraintState(e){let t=k.has(e.tagName),r=this.props.required===!0,n=this.props.disabled===!0;r?(t?e.setAttribute("required",""):e.setAttribute("aria-required","true"),this.wroteRequired=!0):this.wroteRequired&&(e.removeAttribute(t?"required":"aria-required"),this.wroteRequired=!1),n?(t?e.setAttribute("disabled",""):e.setAttribute("aria-disabled","true"),this.wroteDisabled=!0):this.wroteDisabled&&(e.removeAttribute(t?"disabled":"aria-disabled"),this.wroteDisabled=!1),t||this.applyGroupDisabled(e,n)}applyGroupDisabled(e,t){let r=e.getAttribute("role");if(!(!(e.tagName==="FIELDSET"||r!==null&&R.has(r))||!t&&!this.wroteGroupDisabled)){for(let s of e.querySelectorAll("input, select, textarea, button"))t?s.setAttribute("disabled",""):s.removeAttribute("disabled");this.wroteGroupDisabled=t}}validate(){return Promise.resolve(this.runValidation()).then(e=>e.length===0)}reset(){this.injected=[],this.custom=[],this.pending=!1,this.awaitingSubmit=!1,this.runToken++,clearTimeout(this.announceTimer),clearTimeout(this.validationTimer),this.validationTimer=void 0,this.markPending(!1);let e=this.readCount();this.update({touched:!1,dirty:!1,count:e,filled:d(this.resolveValue()),errors:this.composeErrors(e)}),this.sync()}markTouched(){this.snapshot.touched||this.update({touched:!0})}applyStateAttributes(e){let{errors:t,touched:r,dirty:n,filled:s,count:l}=this.snapshot;o(e,"data-invalid",t.length>0),o(e,"data-valid",t.length===0),o(e,"data-touched",r),o(e,"data-dirty",n),o(e,"data-filled",s),o(e,"data-over-limit",this.isOverLimit(l)),o(e,"data-disabled",this.props.disabled===!0)}resolveValue(){return this.props.value!==void 0?this.props.value:P(this.control)}readValidity(){return this.control?.validity??null}markPending(e){this.root&&o(this.root,E,e)}nativeMessage(){let e=this.control;return!e?.validity||e.validity.valid?null:e.validationMessage||this.props.invalidMessage||O}runValidation(e={}){let t=++this.runToken,r=this.props.validate?.(this.resolveValue());return L(r)?(this.pending=!0,this.markPending(!0),Promise.resolve(r).then(n=>t!==this.runToken?this.snapshot.errors:(this.pending=!1,this.markPending(!1),this.commit(n,e)))):this.commit(r,e)}commit(e,t){if(this.custom=T(e),this.custom.length===0){let h=this.nativeMessage();h&&!this.injected.includes(h)&&(this.custom=[h])}let r=this.readCount(),n=this.composeErrors(r),s=this.snapshot.errors.length===0;this.update({errors:n,count:r,filled:d(this.resolveValue())});let l=n[0];return l&&s&&!t.silent&&this.options.announce(l,"assertive"),n}update(e){let t={...this.snapshot,...e,valid:!0,validity:this.readValidity()};t.valid=t.errors.length===0,!U(this.snapshot,t)&&(this.snapshot=t,this.sync(),this.options.onSnapshotChange(t),this.root?.dispatchEvent(new CustomEvent(C,{bubbles:!0,composed:!0,detail:{valid:t.valid,errors:t.errors,touched:t.touched,dirty:t.dirty,filled:t.filled,count:t.count,validity:t.validity}})))}scheduleValidation(){clearTimeout(this.validationTimer),this.validationTimer=void 0;let e=this.props.mode==="change"?this.props.validationDebounceTime??0:0;if(e<=0){this.runValidation();return}this.validationTimer=setTimeout(()=>{this.validationTimer=void 0,this.runValidation()},e)}hasErrorSummary(){return this.form?.querySelector(`[${D}]`)!=null}isEngineResubmit(e){return this.form?.hasAttribute(c)?(this.snapshot.errors.length>0&&e.preventDefault(),!0):!1}resubmitIfSettled(){let e=this.form;if(!(!e||typeof e.requestSubmit!="function")&&!e.querySelector(`[${E}]`)&&!e.querySelector(`[${a}][data-invalid]`)){e.setAttribute(c,"");try{e.requestSubmit()}finally{e.removeAttribute(c)}}}};function L(i){return typeof i?.then=="function"}function q(i,e){return i.length===e.length&&i.every((t,r)=>t===e[r])}function U(i,e){return i.controlId===e.controlId&&i.valid===e.valid&&i.touched===e.touched&&i.dirty===e.dirty&&i.filled===e.filled&&i.count===e.count&&i.validity===e.validity&&i.errors.length===e.errors.length&&i.errors.every((t,r)=>t===e.errors[r])}export{j as CHARACTER_COUNT_ANNOUNCE_DELAY_MS,G as ERROR_SUMMARY_RESCAN_EVENTS,$ as FIELD_CHARACTER_COUNT_ATTRIBUTE,w as FIELD_CONTROL_ATTRIBUTE,x as FIELD_CONTROL_SELECTOR,F as FIELD_DESCRIPTION_ATTRIBUTE,I as FIELD_ERROR_ATTRIBUTE,D as FIELD_ERROR_SUMMARY_ATTRIBUTE,p as FIELD_MESSAGE_ATTRIBUTE,u as FIELD_NAME_ATTRIBUTE,E as FIELD_PENDING_ATTRIBUTE,Y as FIELD_REQUIRED_INDICATOR_ATTRIBUTE,c as FIELD_RESUBMIT_ATTRIBUTE,a as FIELD_ROOT_ATTRIBUTE,C as FIELD_VALIDITY_CHANGE_EVENT,m as FORM_FIELD_ATTRIBUTE,_ as FORM_MESSAGE_ATTRIBUTE,A as FieldController,O as NATIVE_INVALID_FALLBACK_MESSAGE,M as characterCountMessage,V as characterCountVisible,K as collectFieldErrors,z as errorSummaryScope,S as findFieldControl,J as focusFieldTarget,d as isFilled,T as normalizeMessages,P as readControlValue,X as resetFields,Q as validateFields};
+var C="validity-change",a="data-skdx-field",u="data-skdx-field-name",p="data-skdx-field-message",F="data-skdx-field-description",x="data-skdx-field-error",$="data-skdx-field-character-count",E="data-skdx-field-pending",c="data-skdx-field-resubmit",f="data-skdx-form-field",_="data-skdx-form-message",G=["validity-change","invalid","change","blur"],D="data-skdx-error-summary",j=1e3;function M(i){let e=Math.abs(i),t=e===1?"character":"characters";return i<0?`You have ${e} ${t} too many`:`You have ${e} ${t} remaining`}function V(i,e,t=0){return t<=0?!0:i>=e*t/100}function Y(i){return i.map((e,t)=>t===i.length-1||/[.!?]$/.test(e)?e:`${e}.`).join(" ")}var O="This field is invalid.",w="data-skdx-field-control",I=[`[${w}]`,'input:not([type="hidden"])',"select","textarea",'[role="textbox"]','[role="searchbox"]','[role="combobox"]','[role="listbox"]','[role="radiogroup"]','[role="group"]','[role="slider"]','[role="spinbutton"]','[role="checkbox"]','[role="radio"]','[role="switch"]'].join(", "),z="data-skdx-field-required-indicator",k=new Set(["INPUT","SELECT","TEXTAREA"]),R=new Set(["radiogroup","group"]),B=['input:not([disabled]):not([type="hidden"])',"select:not([disabled])","textarea:not([disabled])","button:not([disabled])",'[tabindex]:not([tabindex="-1"])'].join(", ");function T(i){return i==null?[]:(Array.isArray(i)?i:[i]).filter(t=>typeof t=="string"&&t.trim()!=="")}function S(i){for(let e of Array.from(i.querySelectorAll(I)))if(e.getAttribute("aria-hidden")!=="true"&&e.closest(`[${a}]`)===i)return e;return null}function m(i,e){return v(i,a,e)}function v(i,e,t){for(let r of Array.from(i.querySelectorAll(t)))if(r.closest(`[${e}]`)===i)return r;return null}function P(i){if(!i)return;let e=i;return e.type==="checkbox"||e.type==="radio"?e.checked:"value"in i?e.value:i.querySelector('input[aria-hidden="true"]')?.value}function d(i){return i==null||i===!1||i===""?!1:!(Array.isArray(i)&&i.length===0)}function o(i,e,t){t?i.setAttribute(e,""):i.removeAttribute(e)}function y(i,...e){let t=i.split(/\s+/).filter(Boolean);for(let r of e)r&&!t.includes(r)&&t.push(r);return t.join(" ")}function K(i){return i.closest("form, skdx-form")??i.parentElement??i}function N(i){let e=S(i),r=m(i,`[${x}]`)?.textContent?.trim()||i.getAttribute(p)||i.getAttribute(u)||"";return!e?.id||!r?[]:[{id:e.id,message:r}]}function H(i){let e=v(i,f,I);if(!e?.id||e.getAttribute("aria-invalid")!=="true")return[];let r=v(i,f,`[${_}]:not([hidden])`)?.textContent?.trim()||i.getAttribute(u)||"";return r?[{id:e.id,message:r}]:[]}function Q(i){return Array.from(i.querySelectorAll(`[${a}][data-invalid], [${f}]`)).flatMap(t=>(t.hasAttribute(a)?N:H)(t))}var b="__skdxFieldCheckValidity",g="__skdxFieldReset";async function X(i){let e=Array.from(i.querySelectorAll(`[${a}]`));return(await Promise.all(e.map(r=>r[b]?.()??Promise.resolve(!0)))).every(Boolean)}function J(i){for(let e of Array.from(i.querySelectorAll(`[${a}]`)))e[g]?.()}function W(i,e=document){let t=e.getElementById(i);if(!t)return;let r=t.getAttribute("role"),s=(t.tagName==="FIELDSET"||r!==null&&R.has(r)?t.querySelector(B):null)??t;s.focus(),s.scrollIntoView?.({block:"center"})}var A=class{constructor(e){this.options=e;this.props={};this.root=null;this.form=null;this.control=null;this.baseDescribedBy="";this.baseLabelledBy="";this.wroteLabelledBy=!1;this.wroteRequired=!1;this.wroteDisabled=!1;this.wroteGroupDisabled=!1;this.runToken=0;this.pending=!1;this.injected=[];this.custom=[];this.characterCount=null;this.awaitingSubmit=!1;this.handleInput=()=>{let e=this.isOverLimit(this.snapshot.count),t=this.readCount();this.update({dirty:!0,filled:d(this.resolveValue()),count:t,errors:this.composeErrors(t)}),this.scheduleCountAnnouncement(t,e),(this.props.mode==="change"||this.snapshot.errors.length>0)&&this.scheduleValidation()};this.handleFocusOut=()=>{let e=this.readCount();this.update({touched:!0,filled:d(this.resolveValue()),count:e,errors:this.composeErrors(e)});let t=this.validationTimer!==void 0;clearTimeout(this.validationTimer),this.validationTimer=void 0;let r=this.props.mode??"blur";(t||r==="blur"||this.snapshot.errors.length>0)&&this.runValidation()};this.handleSubmit=e=>{if(!this.form)return;let t=e.target;if(t!==this.form&&t?.closest?.("form")!==this.form||this.isEngineResubmit(e))return;this.markTouched();let r=this.runValidation({silent:this.hasErrorSummary()});if(L(r)){e.preventDefault(),this.awaitingSubmit=!0,Promise.resolve(r).then(()=>{this.awaitingSubmit&&(this.awaitingSubmit=!1,this.resubmitIfSettled())});return}(r.length>0||this.pending)&&e.preventDefault()};this.snapshot={controlId:"",errors:[],valid:!0,touched:!1,dirty:!1,filled:!1,count:0,validity:null}}get state(){return this.snapshot}setProps(e){let t=this.props.value;this.props=e;let r=T(e.errors??null),n=!q(this.injected,r);n&&(this.injected=r);let s=e.value!==t;if(!n&&!s)return;let l=this.readCount();this.update({count:l,filled:d(this.resolveValue()),errors:this.composeErrors(l)})}setCharacterCount(e){if((this.characterCount?.maxLength??null)===(e?.maxLength??null)&&(this.characterCount?.threshold??0)===(e?.threshold??0))return;this.characterCount=e;let r=this.readCount();this.update({count:r,errors:this.composeErrors(r)})}readCount(){let e=this.resolveValue();return typeof e=="string"?e.length:0}countMessage(e){return(this.props.getCharacterCountMessage??M)(e)}isOverLimit(e){return this.characterCount!==null&&e>this.characterCount.maxLength}composeErrors(e=this.snapshot.count){let t=[...this.injected,...this.custom];return this.characterCount&&this.isOverLimit(e)&&t.push(this.countMessage(this.characterCount.maxLength-e)),t}scheduleCountAnnouncement(e,t){let r=this.characterCount;if(!r)return;if(clearTimeout(this.announceTimer),this.isOverLimit(e)){t||this.options.announce(this.countMessage(r.maxLength-e),"assertive");return}if(!V(e,r.maxLength,r.threshold))return;let n=r.maxLength-e;this.announceTimer=setTimeout(()=>{this.options.announce(this.countMessage(n),"polite")},1e3)}connect(e){this.root=e,e.setAttribute(a,""),Object.defineProperty(e,b,{value:()=>this.validate(),configurable:!0,enumerable:!1,writable:!0}),Object.defineProperty(e,g,{value:()=>this.reset(),configurable:!0,enumerable:!1,writable:!0}),e.addEventListener("input",this.handleInput,!0),e.addEventListener("change",this.handleInput,!0),e.addEventListener("focusout",this.handleFocusOut,!0),this.form=e.closest("form"),this.form&&e.ownerDocument.addEventListener("submit",this.handleSubmit,!0),this.sync();let t=this.readCount();this.update({filled:d(this.resolveValue()),count:t,errors:this.composeErrors(t)})}disconnect(){clearTimeout(this.announceTimer),clearTimeout(this.validationTimer),this.validationTimer=void 0,this.awaitingSubmit=!1;let e=this.root;e&&(e.removeEventListener("input",this.handleInput,!0),e.removeEventListener("change",this.handleInput,!0),e.removeEventListener("focusout",this.handleFocusOut,!0),this.form&&e.ownerDocument.removeEventListener("submit",this.handleSubmit,!0),delete e[b],delete e[g],this.root=null,this.form=null,this.control=null)}sync(){let e=this.root;if(!e)return;let t=S(e);t!==this.control&&(this.control=t,this.baseDescribedBy=t?.getAttribute("aria-describedby")??"",this.baseLabelledBy=t?.getAttribute("aria-labelledby")??"",this.wroteLabelledBy=!1,this.wroteRequired=!1,this.wroteDisabled=!1,this.wroteGroupDisabled=!1);let{name:r}=this.props;r?e.setAttribute(u,r):e.removeAttribute(u);let n=this.snapshot.errors.join(" ");n?e.setAttribute(p,n):e.removeAttribute(p),this.applyStateAttributes(e),t&&(t.id||(t.id=this.options.controlId),t.id!==this.snapshot.controlId&&(this.snapshot={...this.snapshot,controlId:t.id,validity:this.readValidity()},this.options.onSnapshotChange(this.snapshot)),this.applyDescribedBy(e,t),this.snapshot.errors.length>0?t.setAttribute("aria-invalid","true"):t.removeAttribute("aria-invalid"),this.applyLabelledBy(e,t),this.applyConstraintState(t),this.applyStateAttributes(t))}applyDescribedBy(e,t){let r=m(e,`[${F}]`)!==null,n=m(e,`[${x}]`)!==null,s=y(this.baseDescribedBy,r?this.options.descriptionId:void 0,n?this.options.errorId:void 0);s?t.setAttribute("aria-describedby",s):t.removeAttribute("aria-describedby")}applyLabelledBy(e,t){let r=e.ownerDocument.getElementById(this.options.labelId)!==null;this.options.grouped&&r?(t.setAttribute("aria-labelledby",y(this.baseLabelledBy,this.options.labelId)),this.wroteLabelledBy=!0):this.wroteLabelledBy&&(this.baseLabelledBy?t.setAttribute("aria-labelledby",this.baseLabelledBy):t.removeAttribute("aria-labelledby"),this.wroteLabelledBy=!1)}applyConstraintState(e){let t=k.has(e.tagName),r=this.props.required===!0,n=this.props.disabled===!0;r?(t?e.setAttribute("required",""):e.setAttribute("aria-required","true"),this.wroteRequired=!0):this.wroteRequired&&(e.removeAttribute(t?"required":"aria-required"),this.wroteRequired=!1),n?(t?e.setAttribute("disabled",""):e.setAttribute("aria-disabled","true"),this.wroteDisabled=!0):this.wroteDisabled&&(e.removeAttribute(t?"disabled":"aria-disabled"),this.wroteDisabled=!1),t||this.applyGroupDisabled(e,n)}applyGroupDisabled(e,t){let r=e.getAttribute("role");if(!(!(e.tagName==="FIELDSET"||r!==null&&R.has(r))||!t&&!this.wroteGroupDisabled)){for(let s of e.querySelectorAll("input, select, textarea, button"))t?s.setAttribute("disabled",""):s.removeAttribute("disabled");this.wroteGroupDisabled=t}}validate(){return Promise.resolve(this.runValidation()).then(e=>e.length===0)}reset(){this.injected=[],this.custom=[],this.pending=!1,this.awaitingSubmit=!1,this.runToken++,clearTimeout(this.announceTimer),clearTimeout(this.validationTimer),this.validationTimer=void 0,this.markPending(!1);let e=this.readCount();this.update({touched:!1,dirty:!1,count:e,filled:d(this.resolveValue()),errors:this.composeErrors(e)}),this.sync()}markTouched(){this.snapshot.touched||this.update({touched:!0})}applyStateAttributes(e){let{errors:t,touched:r,dirty:n,filled:s,count:l}=this.snapshot;o(e,"data-invalid",t.length>0),o(e,"data-valid",t.length===0),o(e,"data-touched",r),o(e,"data-dirty",n),o(e,"data-filled",s),o(e,"data-over-limit",this.isOverLimit(l)),o(e,"data-disabled",this.props.disabled===!0)}resolveValue(){return this.props.value!==void 0?this.props.value:P(this.control)}readValidity(){return this.control?.validity??null}markPending(e){this.root&&o(this.root,E,e)}nativeMessage(){let e=this.control;return!e?.validity||e.validity.valid?null:e.validationMessage||this.props.invalidMessage||O}runValidation(e={}){let t=++this.runToken,r=this.props.validate?.(this.resolveValue());return L(r)?(this.pending=!0,this.markPending(!0),Promise.resolve(r).then(n=>t!==this.runToken?this.snapshot.errors:(this.pending=!1,this.markPending(!1),this.commit(n,e)))):this.commit(r,e)}commit(e,t){if(this.custom=T(e),this.custom.length===0){let h=this.nativeMessage();h&&!this.injected.includes(h)&&(this.custom=[h])}let r=this.readCount(),n=this.composeErrors(r),s=this.snapshot.errors.length===0;this.update({errors:n,count:r,filled:d(this.resolveValue())});let l=n[0];return l&&s&&!t.silent&&this.options.announce(l,"assertive"),n}update(e){let t={...this.snapshot,...e,valid:!0,validity:this.readValidity()};t.valid=t.errors.length===0,!U(this.snapshot,t)&&(this.snapshot=t,this.sync(),this.options.onSnapshotChange(t),this.root?.dispatchEvent(new CustomEvent(C,{bubbles:!0,composed:!0,detail:{valid:t.valid,errors:t.errors,touched:t.touched,dirty:t.dirty,filled:t.filled,count:t.count,validity:t.validity}})))}scheduleValidation(){clearTimeout(this.validationTimer),this.validationTimer=void 0;let e=this.props.mode==="change"?this.props.validationDebounceTime??0:0;if(e<=0){this.runValidation();return}this.validationTimer=setTimeout(()=>{this.validationTimer=void 0,this.runValidation()},e)}hasErrorSummary(){return this.form?.querySelector(`[${D}]`)!=null}isEngineResubmit(e){return this.form?.hasAttribute(c)?(this.snapshot.errors.length>0&&e.preventDefault(),!0):!1}resubmitIfSettled(){let e=this.form;if(!(!e||typeof e.requestSubmit!="function")&&!e.querySelector(`[${E}]`)&&!e.querySelector(`[${a}][data-invalid]`)){e.setAttribute(c,"");try{e.requestSubmit()}finally{e.removeAttribute(c)}}}};function L(i){return typeof i?.then=="function"}function q(i,e){return i.length===e.length&&i.every((t,r)=>t===e[r])}function U(i,e){return i.controlId===e.controlId&&i.valid===e.valid&&i.touched===e.touched&&i.dirty===e.dirty&&i.filled===e.filled&&i.count===e.count&&i.validity===e.validity&&i.errors.length===e.errors.length&&i.errors.every((t,r)=>t===e.errors[r])}export{j as CHARACTER_COUNT_ANNOUNCE_DELAY_MS,G as ERROR_SUMMARY_RESCAN_EVENTS,$ as FIELD_CHARACTER_COUNT_ATTRIBUTE,w as FIELD_CONTROL_ATTRIBUTE,I as FIELD_CONTROL_SELECTOR,F as FIELD_DESCRIPTION_ATTRIBUTE,x as FIELD_ERROR_ATTRIBUTE,D as FIELD_ERROR_SUMMARY_ATTRIBUTE,p as FIELD_MESSAGE_ATTRIBUTE,u as FIELD_NAME_ATTRIBUTE,E as FIELD_PENDING_ATTRIBUTE,z as FIELD_REQUIRED_INDICATOR_ATTRIBUTE,c as FIELD_RESUBMIT_ATTRIBUTE,a as FIELD_ROOT_ATTRIBUTE,C as FIELD_VALIDITY_CHANGE_EVENT,f as FORM_FIELD_ATTRIBUTE,_ as FORM_MESSAGE_ATTRIBUTE,A as FieldController,O as NATIVE_INVALID_FALLBACK_MESSAGE,M as characterCountMessage,V as characterCountVisible,Q as collectFieldErrors,K as errorSummaryScope,S as findFieldControl,W as focusFieldTarget,d as isFilled,Y as joinFieldMessages,T as normalizeMessages,P as readControlValue,J as resetFields,X as validateFields};

package/dist/utils/media-query.cjs

@@ -0,0 +1,2 @@
+'use client';
+"use strict";var a=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var r=Object.getOwnPropertyNames;var c=Object.prototype.hasOwnProperty;var s=(e,n)=>{for(var t in n)a(e,t,{get:n[t],enumerable:!0})},u=(e,n,t,o)=>{if(n&&typeof n=="object"||typeof n=="function")for(let i of r(n))!c.call(e,i)&&i!==t&&a(e,i,{get:()=>n[i],enumerable:!(o=d(n,i))||o.enumerable});return e};var f=e=>u(a({},"__esModule",{value:!0}),e);var m={};s(m,{matchesMediaQuery:()=>w,subscribeMediaQuery:()=>h});module.exports=f(m);function w(e){return typeof window>"u"||typeof window.matchMedia!="function"?!1:window.matchMedia(e).matches}function h(e,n){if(typeof window>"u"||typeof window.matchMedia!="function")return()=>{};let t=window.matchMedia(e),o=i=>n(i.matches);return t.addEventListener("change",o),()=>t.removeEventListener("change",o)}0&&(module.exports={matchesMediaQuery,subscribeMediaQuery});

package/dist/utils/media-query.d.cts

@@ -0,0 +1,7 @@
+/** Whether `query` currently matches; `false` wherever `matchMedia` is missing (SSR, some test runners). */
+export declare function matchesMediaQuery(query: string): boolean;
+/**
+ * Calls `onChange` with the new match state whenever `query` flips, and returns the unsubscribe.
+ * A no-op returning a no-op wherever `matchMedia` is missing.
+ */
+export declare function subscribeMediaQuery(query: string, onChange: (matches: boolean) => void): () => void;

package/dist/utils/media-query.d.ts

@@ -0,0 +1,7 @@
+/** Whether `query` currently matches; `false` wherever `matchMedia` is missing (SSR, some test runners). */
+export declare function matchesMediaQuery(query: string): boolean;
+/**
+ * Calls `onChange` with the new match state whenever `query` flips, and returns the unsubscribe.
+ * A no-op returning a no-op wherever `matchMedia` is missing.
+ */
+export declare function subscribeMediaQuery(query: string, onChange: (matches: boolean) => void): () => void;

package/dist/utils/media-query.js

@@ -0,0 +1,2 @@
+'use client';
+function a(e){return typeof window>"u"||typeof window.matchMedia!="function"?!1:window.matchMedia(e).matches}function d(e,i){if(typeof window>"u"||typeof window.matchMedia!="function")return()=>{};let n=window.matchMedia(e),t=o=>i(o.matches);return n.addEventListener("change",t),()=>n.removeEventListener("change",t)}export{a as matchesMediaQuery,d as subscribeMediaQuery};

package/dist/utils/useDismiss.cjs

@@ -1,2 +1,2 @@
 'use client';
-"use strict";var R=Object.create;var E=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var K=Object.getOwnPropertyNames;var k=Object.getPrototypeOf,x=Object.prototype.hasOwnProperty;var U=(e,n)=>{for(var s in n)E(e,s,{get:n[s],enumerable:!0})},T=(e,n,s,c)=>{if(n&&typeof n=="object"||typeof n=="function")for(let r of K(n))!x.call(e,r)&&r!==s&&E(e,r,{get:()=>n[r],enumerable:!(c=g(n,r))||c.enumerable});return e};var j=(e,n,s)=>(s=e!=null?R(k(e)):{},T(n||!e||!e.__esModule?E(s,"default",{value:e,enumerable:!0}):s,e)),A=e=>T(E({},"__esModule",{value:!0}),e);var M={};U(M,{useDismiss:()=>C});module.exports=A(M);var N=j(require("react"),1),i=require("./dismissal.cjs"),d=require("./useCallbackRef.cjs");function C({enabled:e,onEscapeKeyDown:n,onPointerDownOutside:s,onFocusOutside:c,onInteractOutside:r,insideSelector:l},p){let O=(0,d.useCallbackRef)(n),y=n!==void 0,w=(0,d.useCallbackRef)(()=>p),D=(0,d.useCallbackRef)(s),L=(0,d.useCallbackRef)(c),f=(0,d.useCallbackRef)(r),m=(0,d.useCallbackRef)(t=>{if(p.some(v=>v.current?.contains(t)))return!1;let a=t.nodeType===Node.ELEMENT_NODE?t:t.parentElement;return!(l&&a?.closest(l))});N.useEffect(()=>{if(!e)return;let t=globalThis.document,a={insideElements:()=>w().map(o=>o.current)},v=(0,i.pushDismissLayer)(a),h=o=>{(0,i.handleEscapeKeyDown)(o,a,y?O:void 0)},I=o=>{let u=o.target;u&&m(u)&&(f(o),D(o))},F=o=>{let u=(0,i.focusOutsideTarget)(o);if(!u||!m(u))return;let b=(0,i.focusOutsideEvent)(o);f(b),L(b)};t.addEventListener("keydown",h);let P=window.setTimeout(()=>{t.addEventListener("pointerdown",I,!0),t.addEventListener("focusin",F,!0)},0);return()=>{v(),t.removeEventListener("keydown",h),window.clearTimeout(P),t.removeEventListener("pointerdown",I,!0),t.removeEventListener("focusin",F,!0)}},[e,y,O,D,L,f,m,w])}0&&(module.exports={useDismiss});
+"use strict";var K=Object.create;var f=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var k=Object.getOwnPropertyNames;var x=Object.getPrototypeOf,C=Object.prototype.hasOwnProperty;var U=(e,n)=>{for(var s in n)f(e,s,{get:n[s],enumerable:!0})},T=(e,n,s,c)=>{if(n&&typeof n=="object"||typeof n=="function")for(let r of k(n))!C.call(e,r)&&r!==s&&f(e,r,{get:()=>n[r],enumerable:!(c=g(n,r))||c.enumerable});return e};var j=(e,n,s)=>(s=e!=null?K(x(e)):{},T(n||!e||!e.__esModule?f(s,"default",{value:e,enumerable:!0}):s,e)),A=e=>T(f({},"__esModule",{value:!0}),e);var _={};U(_,{useDismiss:()=>M});module.exports=A(_);var E=j(require("react"),1),o=require("./dismissal.cjs"),d=require("./useCallbackRef.cjs");function M({enabled:e,onEscapeKeyDown:n,onPointerDownOutside:s,onFocusOutside:c,onInteractOutside:r,insideSelector:p},y){let O=(0,d.useCallbackRef)(n),w=n!==void 0,N=(0,d.useCallbackRef)(()=>y),D=(0,d.useCallbackRef)(s),L=(0,d.useCallbackRef)(c),m=(0,d.useCallbackRef)(r),h=E.useRef({insideElements:()=>N().map(t=>t.current)}),v=(0,d.useCallbackRef)(t=>{if(y.some(l=>l.current?.contains(t)))return!1;let a=t.nodeType===Node.ELEMENT_NODE?t:t.parentElement;return p&&a?.closest(p)?!1:!(0,o.nestedLayerContains)(h.current,t)});E.useEffect(()=>{if(!e)return;let t=globalThis.document,a=h.current,l=(0,o.pushDismissLayer)(a),I=i=>{(0,o.handleEscapeKeyDown)(i,a,w?O:void 0)},R=i=>{let u=i.target;u&&v(u)&&(m(i),D(i))},F=i=>{let u=(0,o.focusOutsideTarget)(i);if(!u||!v(u))return;let b=(0,o.focusOutsideEvent)(i);m(b),L(b)};t.addEventListener("keydown",I);let P=window.setTimeout(()=>{t.addEventListener("pointerdown",R,!0),t.addEventListener("focusin",F,!0)},0);return()=>{l(),t.removeEventListener("keydown",I),window.clearTimeout(P),t.removeEventListener("pointerdown",R,!0),t.removeEventListener("focusin",F,!0)}},[e,w,O,D,L,m,v])}0&&(module.exports={useDismiss});

package/dist/utils/useDismiss.js

@@ -1,2 +1,2 @@
 'use client';
-import*as L from"react";import{focusOutsideEvent as T,focusOutsideTarget as N,handleEscapeKeyDown as P,pushDismissLayer as R}from"./dismissal.js";import{useCallbackRef as t}from"./useCallbackRef.js";function k({enabled:u,onEscapeKeyDown:c,onPointerDownOutside:h,onFocusOutside:I,onInteractOutside:F,insideSelector:a},E){let f=t(c),m=c!==void 0,v=t(()=>E),l=t(h),p=t(I),i=t(F),r=t(e=>{if(E.some(d=>d.current?.contains(e)))return!1;let o=e.nodeType===Node.ELEMENT_NODE?e:e.parentElement;return!(a&&o?.closest(a))});L.useEffect(()=>{if(!u)return;let e=globalThis.document,o={insideElements:()=>v().map(n=>n.current)},d=R(o),O=n=>{P(n,o,m?f:void 0)},y=n=>{let s=n.target;s&&r(s)&&(i(n),l(n))},w=n=>{let s=N(n);if(!s||!r(s))return;let D=T(n);i(D),p(D)};e.addEventListener("keydown",O);let b=window.setTimeout(()=>{e.addEventListener("pointerdown",y,!0),e.addEventListener("focusin",w,!0)},0);return()=>{d(),e.removeEventListener("keydown",O),window.clearTimeout(b),e.removeEventListener("pointerdown",y,!0),e.removeEventListener("focusin",w,!0)}},[u,m,f,l,p,i,r,v])}export{k as useDismiss};
+import*as i from"react";import{focusOutsideEvent as T,focusOutsideTarget as N,handleEscapeKeyDown as P,nestedLayerContains as K,pushDismissLayer as g}from"./dismissal.js";import{useCallbackRef as t}from"./useCallbackRef.js";function C({enabled:c,onEscapeKeyDown:a,onPointerDownOutside:h,onFocusOutside:I,onInteractOutside:R,insideSelector:f},E){let m=t(a),v=a!==void 0,F=t(()=>E),l=t(h),p=t(I),r=t(R),y=i.useRef({insideElements:()=>F().map(e=>e.current)}),d=t(e=>{if(E.some(u=>u.current?.contains(e)))return!1;let o=e.nodeType===Node.ELEMENT_NODE?e:e.parentElement;return f&&o?.closest(f)?!1:!K(y.current,e)});i.useEffect(()=>{if(!c)return;let e=globalThis.document,o=y.current,u=g(o),O=n=>{P(n,o,v?m:void 0)},w=n=>{let s=n.target;s&&d(s)&&(r(n),l(n))},D=n=>{let s=N(n);if(!s||!d(s))return;let L=T(n);r(L),p(L)};e.addEventListener("keydown",O);let b=window.setTimeout(()=>{e.addEventListener("pointerdown",w,!0),e.addEventListener("focusin",D,!0)},0);return()=>{u(),e.removeEventListener("keydown",O),window.clearTimeout(b),e.removeEventListener("pointerdown",w,!0),e.removeEventListener("focusin",D,!0)}},[c,v,m,l,p,r,d])}export{C as useDismiss};

package/dist/utils/useMediaQuery.cjs

@@ -0,0 +1,2 @@
+'use client';
+"use strict";var u=Object.create;var r=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var l=Object.getOwnPropertyNames;var m=Object.getPrototypeOf,p=Object.prototype.hasOwnProperty;var S=(e,t)=>{for(var a in t)r(e,a,{get:t[a],enumerable:!0})},i=(e,t,a,c)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of l(t))!p.call(e,s)&&s!==a&&r(e,s,{get:()=>t[s],enumerable:!(c=b(t,s))||c.enumerable});return e};var d=(e,t,a)=>(a=e!=null?u(m(e)):{},i(t||!e||!e.__esModule?r(a,"default",{value:e,enumerable:!0}):a,e)),f=e=>i(r({},"__esModule",{value:!0}),e);var h={};S(h,{useMediaQuery:()=>g});module.exports=f(h);var o=d(require("react"),1),n=require("./media-query.cjs"),R=()=>!1;function g(e){let t=o.useCallback(c=>(0,n.subscribeMediaQuery)(e,c),[e]),a=o.useCallback(()=>(0,n.matchesMediaQuery)(e),[e]);return o.useSyncExternalStore(t,a,R)}0&&(module.exports={useMediaQuery});

package/dist/utils/useMediaQuery.d.cts

@@ -0,0 +1,10 @@
+/**
+ * Whether `query` matches, kept live through `matchMedia`. `false` on the
+ * server and during hydration, so server and client markup never disagree.
+ *
+ * @example
+ * ```tsx
+ * const narrow = useMediaQuery('(max-width: 600px)');
+ * ```
+ */
+export declare function useMediaQuery(query: string): boolean;

package/dist/utils/useMediaQuery.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Whether `query` matches, kept live through `matchMedia`. `false` on the
+ * server and during hydration, so server and client markup never disagree.
+ *
+ * @example
+ * ```tsx
+ * const narrow = useMediaQuery('(max-width: 600px)');
+ * ```
+ */
+export declare function useMediaQuery(query: string): boolean;

package/dist/utils/useMediaQuery.js

@@ -0,0 +1,2 @@
+'use client';
+import*as e from"react";import{matchesMediaQuery as c,subscribeMediaQuery as r}from"./media-query.js";var n=()=>!1;function u(t){let a=e.useCallback(o=>r(t,o),[t]),s=e.useCallback(()=>c(t),[t]);return e.useSyncExternalStore(a,s,n)}export{u as useMediaQuery};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skdx/react",
-  "version": "0.29.0",
+  "version": "0.31.0",
   "description": "Accessible React components for the SkandaDX design system — the core layer, styled by @skdx/skins and @skdx/tokens or by your own CSS",
   "license": "MIT",
   "publishConfig": {
@@ -93,6 +93,16 @@
         "default": "./dist/avatar/Avatar.cjs"
       }
     },
+    "./backdrop": {
+      "import": {
+        "types": "./dist/backdrop/index.d.ts",
+        "default": "./dist/backdrop/Backdrop.js"
+      },
+      "require": {
+        "types": "./dist/backdrop/index.d.cts",
+        "default": "./dist/backdrop/Backdrop.cjs"
+      }
+    },
     "./badge": {
       "import": {
         "types": "./dist/badge/index.d.ts",
@@ -193,6 +203,16 @@
         "default": "./dist/checkbox-group/CheckboxGroup.cjs"
       }
     },
+    "./chip": {
+      "import": {
+        "types": "./dist/chip/index.d.ts",
+        "default": "./dist/chip/Chip.js"
+      },
+      "require": {
+        "types": "./dist/chip/index.d.cts",
+        "default": "./dist/chip/Chip.cjs"
+      }
+    },
     "./clipboard": {
       "import": {
         "types": "./dist/clipboard/index.d.ts",
@@ -263,6 +283,26 @@
         "default": "./dist/date-picker/DatePicker.cjs"
       }
     },
+    "./date-range-picker": {
+      "import": {
+        "types": "./dist/date-range-picker/index.d.ts",
+        "default": "./dist/date-range-picker/DateRangePicker.js"
+      },
+      "require": {
+        "types": "./dist/date-range-picker/index.d.cts",
+        "default": "./dist/date-range-picker/DateRangePicker.cjs"
+      }
+    },
+    "./date-time-picker": {
+      "import": {
+        "types": "./dist/date-time-picker/index.d.ts",
+        "default": "./dist/date-time-picker/DateTimePicker.js"
+      },
+      "require": {
+        "types": "./dist/date-time-picker/index.d.cts",
+        "default": "./dist/date-time-picker/DateTimePicker.cjs"
+      }
+    },
     "./dialog": {
       "import": {
         "types": "./dist/dialog/index.d.ts",
@@ -303,6 +343,16 @@
         "default": "./dist/editable/Editable.cjs"
       }
     },
+    "./fab": {
+      "import": {
+        "types": "./dist/fab/index.d.ts",
+        "default": "./dist/fab/Fab.js"
+      },
+      "require": {
+        "types": "./dist/fab/index.d.cts",
+        "default": "./dist/fab/Fab.cjs"
+      }
+    },
     "./field": {
       "import": {
         "types": "./dist/field/index.d.ts",
@@ -343,6 +393,26 @@
         "default": "./dist/form/Form.cjs"
       }
     },
+    "./gauge": {
+      "import": {
+        "types": "./dist/gauge/index.d.ts",
+        "default": "./dist/gauge/Gauge.js"
+      },
+      "require": {
+        "types": "./dist/gauge/index.d.cts",
+        "default": "./dist/gauge/Gauge.cjs"
+      }
+    },
+    "./grid": {
+      "import": {
+        "types": "./dist/grid/index.d.ts",
+        "default": "./dist/grid/Grid.js"
+      },
+      "require": {
+        "types": "./dist/grid/index.d.cts",
+        "default": "./dist/grid/Grid.cjs"
+      }
+    },
     "./heading": {
       "import": {
         "types": "./dist/heading/index.d.ts",
@@ -483,6 +553,16 @@
         "default": "./dist/pagination/Pagination.cjs"
       }
     },
+    "./paper": {
+      "import": {
+        "types": "./dist/paper/index.d.ts",
+        "default": "./dist/paper/Paper.js"
+      },
+      "require": {
+        "types": "./dist/paper/index.d.cts",
+        "default": "./dist/paper/Paper.cjs"
+      }
+    },
     "./password-input": {
       "import": {
         "types": "./dist/password-input/index.d.ts",
@@ -643,6 +723,16 @@
         "default": "./dist/split-button/SplitButton.cjs"
       }
     },
+    "./stack": {
+      "import": {
+        "types": "./dist/stack/index.d.ts",
+        "default": "./dist/stack/Stack.js"
+      },
+      "require": {
+        "types": "./dist/stack/index.d.cts",
+        "default": "./dist/stack/Stack.cjs"
+      }
+    },
     "./stepper": {
       "import": {
         "types": "./dist/stepper/index.d.ts",
@@ -803,6 +893,16 @@
         "default": "./dist/toolbar/Toolbar.cjs"
       }
     },
+    "./tooltip": {
+      "import": {
+        "types": "./dist/tooltip/index.d.ts",
+        "default": "./dist/tooltip/Tooltip.js"
+      },
+      "require": {
+        "types": "./dist/tooltip/index.d.cts",
+        "default": "./dist/tooltip/Tooltip.cjs"
+      }
+    },
     "./tour": {
       "import": {
         "types": "./dist/tour/index.d.ts",
@@ -1505,7 +1605,7 @@
     "tsup": "^8.5.1",
     "typescript": "^6.0.3",
     "vitest": "^4.1.10",
-    "@skdx/shared": "0.29.0"
+    "@skdx/shared": "0.31.0"
   },
   "scripts": {
     "lint": "eslint . --cache --cache-location node_modules/.cache/eslint/",