@tempots/beatui 0.95.0 → 1.0.1

package/dist/translations-Dbx7L7Q1.cjs

@@ -0,0 +1 @@
+"use strict";const a=require("@tempots/dom"),k=require("@tempots/ui"),y=require("./colors-B-p6IzX9.cjs");function w(e,{units:t=["B","KB","MB","GB","TB"],decimalPlaces:o=0,locale:l}={}){if(e===0||e===0n)return new Intl.NumberFormat(l,{style:"unit",unit:"byte",unitDisplay:"short",maximumFractionDigits:0}).format(0).replace("byte",t[0]);let n,r;if(typeof e=="bigint"){let s=e<0n?-e:e;for(n=0;s>=1024n&&n<t.length-1;)s=s/1024n,n++;r=Number(e)/Math.pow(1024,n)}else n=Math.floor(Math.log(Math.abs(e))/Math.log(1024)),n=Math.min(n,t.length-1),r=e/Math.pow(1024,n);return new Intl.NumberFormat(l,{style:"unit",unit:"byte",unitDisplay:"short",minimumFractionDigits:n===0?0:o,maximumFractionDigits:n===0?0:o}).format(r).replace("byte",t[n])}const N={loadingExtended:"Loading, please wait",loadingShort:"Loading...",locale:"Locale",iconDescription:"Icon",loadingIcon:"Loading icon",failedToLoadIcon:"Failed to load icon",editLabel:"Edit",selectOne:"Select one",selectNone:"None",selectMany:"Select many",noResults:"No results",passwordPlaceholderText:"Secret Password",togglePasswordVisibility:"Toggle password visibility",toggleMenu:"Toggle menu",toggleAside:"Toggle aside",mainNavigation:"Main navigation",sidebar:"Sidebar",closeDrawer:"Close drawer",closeModal:"Close modal",confirm:"Confirm",cancel:"Cancel",addLabel:"Add",removeItem:"Remove item",currentLocale:"English",ar:"Arabic",de:"German",en:"English",es:"Spanish",fr:"French",hi:"Hindi",it:"Italian",ja:"Japanese",ko:"Korean",nl:"Dutch",pl:"Polish",pt:"Portuguese",ru:"Russian",tr:"Turkish",vi:"Vietnamese",zh:"Chinese",he:"Hebrew",fa:"Persian",ur:"Urdu",emailPlaceholderText:"Enter your email",incrementValue:"Increment value",decrementValue:"Decrement value",dropZoneInstructions:e=>e?"Click to choose or drag files here, or press Enter or Space to open file selector":"Drag files here",fileSizeUnits:["Bytes","KB","MB","GB","TB"],removeFile:"Remove file",clearAllFiles:"Clear all files",clearValue:"Reset",unknownType:"Unknown type",filesInputInstructions:(e,t,o)=>{let l=e==null||e>1?"Click to choose or drag files here":"Click to choose or drag a file here";if(e||t){const n=[];if(e!=null&&e>1&&n.push(`up to ${e} files`),t&&o){const r=w(t,{units:o});n.push(`max ${r} each`)}n.length>0&&(l+=` (${n.join(", ")})`)}return l},paginationLabel:"Pagination",firstPage:"First page",previousPage:"Previous page",nextPage:"Next page",lastPage:"Last page",breadcrumbs:"Breadcrumbs",commandPalette:"Command palette",typeACommand:"Type a command...",noResultsFound:"No results found",noMatchingCommands:"No matching commands",appearanceSystem:"System",appearanceLight:"Light",appearanceDark:"Dark",ok:"OK",changeTypeConfirmation:"Changing type will clear the current value. Continue?",notifications:"Notifications",markAllAsRead:"Mark all as read",noNotifications:"No notifications",schemaConflictsDetected:"Schema Conflicts Detected",schemaViolationsDetected:"Schema Violations Detected",properties:"Properties",uploading:"Uploading...",dropFilesOrBrowse:"Drop files here or click to browse",acceptedTypes:e=>`Accepted types: ${e}`,enterUrlPrompt:"Enter URL:",exceeded:"(exceeded)",pdfPreview:"PDF Preview",lexical:{fontFamily:"Font Family",fontSize:"Font Size",lineHeight:"Line Height",fontColor:"Font Color",highlightColor:"Highlight Color",backgroundColor:"Background Color",bold:"Bold",italic:"Italic",underline:"Underline",strikethrough:"Strikethrough",code:"Code",clearFormatting:"Clear Formatting",normal:"Normal",heading:e=>`Heading ${e}`,bulletList:"Bullet List",orderedList:"Ordered List",checkList:"Check List",indent:"Indent",outdent:"Outdent",blockquote:"Blockquote",codeBlock:"Code Block",horizontalRule:"Horizontal Rule",insertTable:"Insert Table",link:"Link",undo:"Undo",redo:"Redo",cut:"Cut",copy:"Copy",paste:"Paste",defaultOption:"Default",slashCommands:"Slash commands",noCommandsFound:"No commands found",changeBlockType:"Change block type",blockTypes:"Block types",enterUrl:"Enter URL:",tableActions:"Table actions",insertRowAbove:"Insert row above",insertRowBelow:"Insert row below",insertColumnLeft:"Insert column left",insertColumnRight:"Insert column right",deleteRow:"Delete row",deleteColumn:"Delete column",deleteTable:"Delete table"},dataTable:{sortAscending:"Sort ascending",sortDescending:"Sort descending",clearSort:"Clear sort",filterPlaceholder:"Filter...",clearFilter:"Clear filter",selectAll:"Select all",deselectAll:"Deselect all",selectedCount:e=>`${e} selected`,resetAll:"Reset all",noResults:"No results found",loading:"Loading...",filterPanelAddCondition:"Add condition",filterPanelApply:"Apply",filterPanelClear:"Clear filters",filterPanelAnd:"AND",filterPanelOr:"OR",filterPanelContains:"Contains",filterPanelNotContains:"Does not contain",filterPanelEquals:"Equals",filterPanelNotEquals:"Does not equal",filterPanelStartsWith:"Starts with",filterPanelEndsWith:"Ends with",filterPanelIsNull:"Is empty",filterPanelIsNotNull:"Is not empty",filterPanelGt:"Greater than",filterPanelGte:"Greater or equal",filterPanelLt:"Less than",filterPanelLte:"Less or equal",filterPanelBetween:"Between",filterPanelValuePlaceholder:"Value...",sortMultiHint:"Hold Shift to sort multiple columns",columnVisibility:"Columns",showAllColumns:"Show all",menuSortAsc:"Sort Ascending",menuSortDesc:"Sort Descending",menuClearSort:"Clear Sort",menuHideColumn:"Hide Column",menuChooseColumns:"Choose Columns",menuResetColumns:"Reset Columns",menuFilter:"Filter",rowCount:(e,t)=>`Rows: ${e}  Total Rows: ${t}`,filterTagsPlaceholder:"Select values...",groupCount:e=>`${e} items`,collapseGroup:"Collapse group",expandGroup:"Expand group",describeFilter:{textContains:(e,t)=>`${e} contains "${t}"`,textNotContains:(e,t)=>`${e} does not contain "${t}"`,textEquals:(e,t)=>`${e} equals "${t}"`,textNotEquals:(e,t)=>`${e} does not equal "${t}"`,textStartsWith:(e,t)=>`${e} starts with "${t}"`,textEndsWith:(e,t)=>`${e} ends with "${t}"`,compareEq:(e,t)=>`${e} = ${t}`,compareNeq:(e,t)=>`${e} ≠ ${t}`,compareGt:(e,t)=>`${e} > ${t}`,compareGte:(e,t)=>`${e} ≥ ${t}`,compareLt:(e,t)=>`${e} < ${t}`,compareLte:(e,t)=>`${e} ≤ ${t}`,rangeBetween:(e,t,o)=>`${e} between ${t} and ${o}`,rangeGte:(e,t)=>`${e} ≥ ${t}`,rangeLte:(e,t)=>`${e} ≤ ${t}`,setIn:(e,t)=>`${e} in [${t}]`,setNotIn:(e,t)=>`${e} not in [${t}]`,booleanIs:(e,t)=>`${e} is ${t}`,isNull:e=>`${e} is empty`,isNotNull:e=>`${e} is not empty`,compositeAnd:e=>e.join(" AND "),compositeOr:e=>e.join(" OR ")}},prosemirror:{bold:"Bold",italic:"Italic",code:"Inline code",link:"Insert link",removeLink:"Remove link",heading:e=>`Heading ${e}`,bulletList:"Bullet list",orderedList:"Ordered list",blockquote:"Blockquote",codeBlock:"Code block",horizontalRule:"Horizontal rule",linkUrlPlaceholder:"https://example.com"},pdfPageViewer:{loading:"Loading PDF...",loadFailed:"Failed to load PDF",invalidPdf:"Invalid PDF file",pageOutOfRange:(e,t)=>`Page ${e} is out of range (1-${t})`,renderFailed:"Failed to render PDF page"}},f=N,p="en",R=new Set(["ar","he","fa","ur","ps","sd","ku","dv","yi","ji","iw","in"]);function C(e){if(!e)return"ltr";const t=e.split(/[-_]/)[0].toLowerCase();return R.has(t)?"rtl":"ltr"}function I(e,t){return e==="auto"?C(t):e}function A(e){return`b-${e}`}function T(e){return C(e)==="rtl"}function O(e){return e==="ltr"?"rtl":"ltr"}const $={ltr:{"inline-start":"left","inline-end":"right","block-start":"top","block-end":"bottom"},rtl:{"inline-start":"right","inline-end":"left","block-start":"top","block-end":"bottom"}};function M(e,t){return $[t][e]}const L={mark:a.makeProviderMark("Locale"),create:e=>{const t=a.localStorageProp({defaultValue:navigator.language??"en-US",key:"beatui-locale"}),o=a.localStorageProp({defaultValue:"auto",key:"beatui-direction-preference"}),l=a.computedOf(t,o)((r,i)=>I(i,r));return{value:{locale:t,setLocale:r=>t.set(r),direction:l,directionPreference:o,setDirectionPreference:r=>o.set(r)},dispose:()=>{t.dispose(),o.dispose(),l.dispose()}}}},{variants:V,special:E,overrides:v}=y.backgroundConfig;function d(e,t){switch(e){case"white":return"var(--color-white)";case"black":return"var(--color-black)";case"transparent":return"transparent";default:return y.getColorVar(e,t)}}function x(e,t){const o=E[e];if(!o)return;if(t==="light")return o;const l=v[e];return l?l[t]:o}function U(e,t,o){const l=v[e];if(l){const r=l[o];if(r)return{backgroundColor:r.backgroundColor,textColor:r.color}}if(t==="solid"){const r=x(e,o);if(r)return{backgroundColor:r.backgroundColor,textColor:r.color}}const n=V[t][o];return{backgroundColor:d(e,n.bgShade),textColor:n.textColor}}const G={light:{shade:700,textColor:"var(--color-white)"},dark:{shade:500,textColor:"var(--text-inverted-dark)"}},j={light:{shade:200,textColor:"var(--text-normal-light)"},dark:{shade:700,textColor:"var(--text-normal-dark)"}},H={light:{shade:400,textColor:"var(--text-normal-light)"},dark:{shade:600,textColor:"var(--text-normal-dark)"}};function _(e,t,o){const l=v[e];if(l){const r=l[o];if(r)return{backgroundColor:r.backgroundColor,textColor:r.color}}if(t==="solid"){const r=x(e,o);if(r)return{backgroundColor:r.backgroundColor,textColor:r.color};const i=G[o];return{backgroundColor:d(e,i.shade),textColor:i.textColor}}const n=t==="light"?j[o]:H[o];return{backgroundColor:d(e,n.shade),textColor:n.textColor}}function z(e,t){const o=t==="light"?500:600;switch(e){case"white":return t==="light"?"var(--text-inverse-light)":"var(--text-inverted-dark)";case"black":return"var(--color-black)";case"transparent":return"transparent";default:return d(e,o)}}function W(e,t){return e==="white"?"var(--color-white)":e==="black"?"var(--color-black)":e==="transparent"?"inherit":d(e,t==="light"?800:200)}function P(e,t,o){return t==="soft"?d(e,o==="light"?300:700):d(e,o==="light"?500:600)}const K="bui-icons",g=new Map,b=(()=>{try{return typeof indexedDB<"u"&&indexedDB!==null}catch{return!1}})();function Y(){return b?new Promise((e,t)=>{const o=indexedDB.open(K,1);o.onupgradeneeded=function(l){const n=l.target.result;n.objectStoreNames.contains("icons")||n.createObjectStore("icons")},o.onsuccess=function(){e(o.result)},o.onerror=function(){t(o.error)}}):Promise.reject(new Error("IndexedDB not available"))}const m=b?Y():null;async function D(e,t){try{if(m){const o=await m;return new Promise((l,n)=>{const r=o.transaction("icons","readwrite");r.objectStore("icons").put(t,e),r.oncomplete=()=>l(),r.onerror=n})}else g.set(e,t)}catch{g.set(e,t)}}async function S(e){try{if(m){const t=await m;return new Promise((o,l)=>{const i=t.transaction("icons","readonly").objectStore("icons").get(e);i.onsuccess=function(){o(i.result)},i.onerror=l})}else return g.get(e)||null}catch{return g.get(e)||null}}async function J(e){const t=`https://api.iconify.design/${e}.svg`;return fetch(t).then(o=>{if(o.status===200)return o.text();throw new Error(`Failed to load icon: ${e}`)})}async function Q(e){const t=e.replace(":","/"),o=await S(t);if(o)return o;const l=await J(t);return await D(t,l),l}function Z(e){return["bc-icon",`bc-icon--${e}`].join(" ")}function X(e,t="solid"){if(!e)return"";const o=P(e,t,"light"),l=P(e,t,"dark");return`--icon-color: ${o}; --icon-color-dark: ${l}`}function ee({icon:e,size:t="md",color:o,title:l,accessibility:n="auto",tone:r="solid"},...i){const u=a.computedOf(n,l)((s,c)=>s==="decorative"?!1:s==="informative"?!0:c!=null&&c!=="");return a.Use(F,s=>a.html.span(a.attr.class(a.computedOf(t,o)(c=>Z(c??"md"))),a.attr.style(a.computedOf(o,r)((c,h)=>X(c??void 0,h??"solid"))),a.When(u,()=>a.Fragment(a.attr.role("img"),a.aria.label(a.coalesce(l,s.$.iconDescription))),()=>a.aria.hidden(!0)),k.WhenInViewport({once:!0},()=>k.Query({request:e,load:({request:c})=>Q(c),convertError:String,success:({value:c})=>a.html.span(a.style.width("100%"),a.style.height("100%"),a.attr.innerHTML(c)),pending:()=>a.html.span(a.attr.class("animate-spin"),a.When(u,()=>a.Fragment(a.attr.role("img"),a.aria.label(s.$.loadingIcon)),()=>a.aria.hidden(!0)),"↻"),failure:({error:c})=>a.html.span(a.attr.title(c),a.attr.class("text-red-500"),a.When(u,()=>a.Fragment(a.attr.role("img"),a.aria.label(s.$.failedToLoadIcon)),()=>a.aria.hidden(!0)),"🚫")})),...i))}function te(e){const t=e.split("-"),o=[e];return t.length>1&&o.push(t[0]),o}function B({locale:e,defaultLocale:t="en-US",defaultMessages:o,localeLoader:l}){const n=a.prop(t),r=a.prop(o),i=e.on(async u=>{if(u===n.value)return;n.set(u);const s=te(u);for(const c of s)try{const h=await l(c);if(typeof h.default=="object"&&Object.keys(h).length===1){console.error("It appears that you are trying to load a translation module without referencing the default export. Please use `(await import(...)).default` in your loader function.");return}if(u===n.value){r.set(h);return}}catch{continue}console.warn(`No locale found for "${e.value}", using fallback`),u===n.value&&r.set(o)});return{dispose:()=>{i(),n.dispose(),r.dispose()},t:r}}function q({defaultLocale:e,defaultMessages:t,localeLoader:o,providerName:l="I18nProvider"}){return{mark:a.makeProviderMark(l),create:(n,r)=>{const{value:{locale:i}}=r.getProvider(L.mark),{t:u,dispose:s}=B({locale:i,defaultMessages:t,defaultLocale:e,localeLoader:o});return{value:u,dispose:s}}}}const oe=Object.assign({"./locales/ar.ts":()=>Promise.resolve().then(()=>require("./ar-CuI1Jgt6.cjs")).then(e=>e.default),"./locales/de.ts":()=>Promise.resolve().then(()=>require("./de-DthHehbh.cjs")).then(e=>e.default),"./locales/es.ts":()=>Promise.resolve().then(()=>require("./es-B6GJLk9h.cjs")).then(e=>e.default),"./locales/fa.ts":()=>Promise.resolve().then(()=>require("./fa-BwgP93iV.cjs")).then(e=>e.default),"./locales/fr.ts":()=>Promise.resolve().then(()=>require("./fr-CQzk5zqY.cjs")).then(e=>e.default),"./locales/he.ts":()=>Promise.resolve().then(()=>require("./he-DcxxvRfs.cjs")).then(e=>e.default),"./locales/hi.ts":()=>Promise.resolve().then(()=>require("./hi-D-KHVWg4.cjs")).then(e=>e.default),"./locales/it.ts":()=>Promise.resolve().then(()=>require("./it-D344Dutu.cjs")).then(e=>e.default),"./locales/ja.ts":()=>Promise.resolve().then(()=>require("./ja-BNgnDZ27.cjs")).then(e=>e.default),"./locales/ko.ts":()=>Promise.resolve().then(()=>require("./ko-D-WJ9NK7.cjs")).then(e=>e.default),"./locales/nl.ts":()=>Promise.resolve().then(()=>require("./nl-CrqUlFie.cjs")).then(e=>e.default),"./locales/pl.ts":()=>Promise.resolve().then(()=>require("./pl-9UksIrvX.cjs")).then(e=>e.default),"./locales/pt.ts":()=>Promise.resolve().then(()=>require("./pt-_kfdzwqi.cjs")).then(e=>e.default),"./locales/ru.ts":()=>Promise.resolve().then(()=>require("./ru-CW1WNNlr.cjs")).then(e=>e.default),"./locales/tr.ts":()=>Promise.resolve().then(()=>require("./tr-B6GIRegf.cjs")).then(e=>e.default),"./locales/ur.ts":()=>Promise.resolve().then(()=>require("./ur-CtFl_tz6.cjs")).then(e=>e.default),"./locales/vi.ts":()=>Promise.resolve().then(()=>require("./vi-DyCZSpsk.cjs")).then(e=>e.default),"./locales/zh.ts":()=>Promise.resolve().then(()=>require("./zh-C3ZxMQKb.cjs")).then(e=>e.default)}),F=q({defaultLocale:p,defaultMessages:f,localeLoader:async e=>{if(e===p)return f;const t=oe[`./locales/${e}.ts`];return t?await t():f},providerName:"BeatUII18n"});exports.BeatUII18n=F;exports.Icon=ee;exports.LOGICAL_PROPERTY_MAP=$;exports.Locale=L;exports.backgroundValue=U;exports.borderColorValue=z;exports.defaultLocale=p;exports.defaultMessages=f;exports.formatFileSize=w;exports.getDirectionClassName=A;exports.getDirectionFromLocale=C;exports.getIconLocally=S;exports.getOppositeDirection=O;exports.getPhysicalProperty=M;exports.hoverBackgroundValue=_;exports.isIndexedDBAvailable=b;exports.isRTLLocale=T;exports.makeI18nProvider=q;exports.makeMessages=B;exports.resolveDirection=I;exports.storeIconLocally=D;exports.textColorValue=W;

package/dist/types/beatui-i18n/default.d.ts

@@ -138,6 +138,77 @@ export declare const defaultMessages: {
         deleteColumn: string;
         deleteTable: string;
     };
+    dataTable: {
+        sortAscending: string;
+        sortDescending: string;
+        clearSort: string;
+        filterPlaceholder: string;
+        clearFilter: string;
+        selectAll: string;
+        deselectAll: string;
+        selectedCount: (count: number) => string;
+        resetAll: string;
+        noResults: string;
+        loading: string;
+        filterPanelAddCondition: string;
+        filterPanelApply: string;
+        filterPanelClear: string;
+        filterPanelAnd: string;
+        filterPanelOr: string;
+        filterPanelContains: string;
+        filterPanelNotContains: string;
+        filterPanelEquals: string;
+        filterPanelNotEquals: string;
+        filterPanelStartsWith: string;
+        filterPanelEndsWith: string;
+        filterPanelIsNull: string;
+        filterPanelIsNotNull: string;
+        filterPanelGt: string;
+        filterPanelGte: string;
+        filterPanelLt: string;
+        filterPanelLte: string;
+        filterPanelBetween: string;
+        filterPanelValuePlaceholder: string;
+        sortMultiHint: string;
+        columnVisibility: string;
+        showAllColumns: string;
+        menuSortAsc: string;
+        menuSortDesc: string;
+        menuClearSort: string;
+        menuHideColumn: string;
+        menuChooseColumns: string;
+        menuResetColumns: string;
+        menuFilter: string;
+        rowCount: (filtered: number, total: number) => string;
+        filterTagsPlaceholder: string;
+        groupCount: (count: number) => string;
+        collapseGroup: string;
+        expandGroup: string;
+        describeFilter: {
+            textContains: (col: string, val: string) => string;
+            textNotContains: (col: string, val: string) => string;
+            textEquals: (col: string, val: string) => string;
+            textNotEquals: (col: string, val: string) => string;
+            textStartsWith: (col: string, val: string) => string;
+            textEndsWith: (col: string, val: string) => string;
+            compareEq: (col: string, val: string) => string;
+            compareNeq: (col: string, val: string) => string;
+            compareGt: (col: string, val: string) => string;
+            compareGte: (col: string, val: string) => string;
+            compareLt: (col: string, val: string) => string;
+            compareLte: (col: string, val: string) => string;
+            rangeBetween: (col: string, min: string, max: string) => string;
+            rangeGte: (col: string, val: string) => string;
+            rangeLte: (col: string, val: string) => string;
+            setIn: (col: string, vals: string) => string;
+            setNotIn: (col: string, vals: string) => string;
+            booleanIs: (col: string, val: string) => string;
+            isNull: (col: string) => string;
+            isNotNull: (col: string) => string;
+            compositeAnd: (descriptions: string[]) => string;
+            compositeOr: (descriptions: string[]) => string;
+        };
+    };
     prosemirror: {
         bold: string;
         italic: string;

package/dist/types/beatui-i18n/locales/en.d.ts

@@ -124,6 +124,77 @@ declare const en: {
         deleteColumn: string;
         deleteTable: string;
     };
+    dataTable: {
+        sortAscending: string;
+        sortDescending: string;
+        clearSort: string;
+        filterPlaceholder: string;
+        clearFilter: string;
+        selectAll: string;
+        deselectAll: string;
+        selectedCount: (count: number) => string;
+        resetAll: string;
+        noResults: string;
+        loading: string;
+        filterPanelAddCondition: string;
+        filterPanelApply: string;
+        filterPanelClear: string;
+        filterPanelAnd: string;
+        filterPanelOr: string;
+        filterPanelContains: string;
+        filterPanelNotContains: string;
+        filterPanelEquals: string;
+        filterPanelNotEquals: string;
+        filterPanelStartsWith: string;
+        filterPanelEndsWith: string;
+        filterPanelIsNull: string;
+        filterPanelIsNotNull: string;
+        filterPanelGt: string;
+        filterPanelGte: string;
+        filterPanelLt: string;
+        filterPanelLte: string;
+        filterPanelBetween: string;
+        filterPanelValuePlaceholder: string;
+        sortMultiHint: string;
+        columnVisibility: string;
+        showAllColumns: string;
+        menuSortAsc: string;
+        menuSortDesc: string;
+        menuClearSort: string;
+        menuHideColumn: string;
+        menuChooseColumns: string;
+        menuResetColumns: string;
+        menuFilter: string;
+        rowCount: (filtered: number, total: number) => string;
+        filterTagsPlaceholder: string;
+        groupCount: (count: number) => string;
+        collapseGroup: string;
+        expandGroup: string;
+        describeFilter: {
+            textContains: (col: string, val: string) => string;
+            textNotContains: (col: string, val: string) => string;
+            textEquals: (col: string, val: string) => string;
+            textNotEquals: (col: string, val: string) => string;
+            textStartsWith: (col: string, val: string) => string;
+            textEndsWith: (col: string, val: string) => string;
+            compareEq: (col: string, val: string) => string;
+            compareNeq: (col: string, val: string) => string;
+            compareGt: (col: string, val: string) => string;
+            compareGte: (col: string, val: string) => string;
+            compareLt: (col: string, val: string) => string;
+            compareLte: (col: string, val: string) => string;
+            rangeBetween: (col: string, min: string, max: string) => string;
+            rangeGte: (col: string, val: string) => string;
+            rangeLte: (col: string, val: string) => string;
+            setIn: (col: string, vals: string) => string;
+            setNotIn: (col: string, vals: string) => string;
+            booleanIs: (col: string, val: string) => string;
+            isNull: (col: string) => string;
+            isNotNull: (col: string) => string;
+            compositeAnd: (descriptions: string[]) => string;
+            compositeOr: (descriptions: string[]) => string;
+        };
+    };
     prosemirror: {
         bold: string;
         italic: string;

package/dist/types/beatui-i18n/translations.d.ts

@@ -148,6 +148,77 @@ export declare const BeatUII18n: import("@tempots/dom").Provider<import("@tempot
         deleteColumn: string;
         deleteTable: string;
     };
+    dataTable: {
+        sortAscending: string;
+        sortDescending: string;
+        clearSort: string;
+        filterPlaceholder: string;
+        clearFilter: string;
+        selectAll: string;
+        deselectAll: string;
+        selectedCount: (count: number) => string;
+        resetAll: string;
+        noResults: string;
+        loading: string;
+        filterPanelAddCondition: string;
+        filterPanelApply: string;
+        filterPanelClear: string;
+        filterPanelAnd: string;
+        filterPanelOr: string;
+        filterPanelContains: string;
+        filterPanelNotContains: string;
+        filterPanelEquals: string;
+        filterPanelNotEquals: string;
+        filterPanelStartsWith: string;
+        filterPanelEndsWith: string;
+        filterPanelIsNull: string;
+        filterPanelIsNotNull: string;
+        filterPanelGt: string;
+        filterPanelGte: string;
+        filterPanelLt: string;
+        filterPanelLte: string;
+        filterPanelBetween: string;
+        filterPanelValuePlaceholder: string;
+        sortMultiHint: string;
+        columnVisibility: string;
+        showAllColumns: string;
+        menuSortAsc: string;
+        menuSortDesc: string;
+        menuClearSort: string;
+        menuHideColumn: string;
+        menuChooseColumns: string;
+        menuResetColumns: string;
+        menuFilter: string;
+        rowCount: (filtered: number, total: number) => string;
+        filterTagsPlaceholder: string;
+        groupCount: (count: number) => string;
+        collapseGroup: string;
+        expandGroup: string;
+        describeFilter: {
+            textContains: (col: string, val: string) => string;
+            textNotContains: (col: string, val: string) => string;
+            textEquals: (col: string, val: string) => string;
+            textNotEquals: (col: string, val: string) => string;
+            textStartsWith: (col: string, val: string) => string;
+            textEndsWith: (col: string, val: string) => string;
+            compareEq: (col: string, val: string) => string;
+            compareNeq: (col: string, val: string) => string;
+            compareGt: (col: string, val: string) => string;
+            compareGte: (col: string, val: string) => string;
+            compareLt: (col: string, val: string) => string;
+            compareLte: (col: string, val: string) => string;
+            rangeBetween: (col: string, min: string, max: string) => string;
+            rangeGte: (col: string, val: string) => string;
+            rangeLte: (col: string, val: string) => string;
+            setIn: (col: string, vals: string) => string;
+            setNotIn: (col: string, vals: string) => string;
+            booleanIs: (col: string, val: string) => string;
+            isNull: (col: string) => string;
+            isNotNull: (col: string) => string;
+            compositeAnd: (descriptions: string[]) => string;
+            compositeOr: (descriptions: string[]) => string;
+        };
+    };
     prosemirror: {
         bold: string;
         italic: string;

package/dist/types/codehighlight/code-highlight.d.ts

@@ -0,0 +1,21 @@
+import { TNode, Value, Renderable } from '@tempots/dom';
+import type { BundledTheme } from 'shiki';
+export type CodeHighlightOptions = {
+    /** The source code to highlight. */
+    code: Value<string>;
+    /** The language identifier (e.g., 'typescript', 'css', 'json'). */
+    language?: Value<string>;
+    /** Light-mode Shiki theme. @default 'github-light' */
+    lightTheme?: BundledTheme;
+    /** Dark-mode Shiki theme. @default 'github-dark' */
+    darkTheme?: BundledTheme;
+};
+/**
+ * Renders a syntax-highlighted code block using Shiki.
+ *
+ * Themes are applied using CSS variables so that light/dark mode
+ * switching works automatically via the `.dark` class on `<html>`.
+ *
+ * Styles are injected into `<head>` on first use — no external CSS import needed.
+ */
+export declare function CodeHighlight(options: CodeHighlightOptions, ...children: TNode[]): Renderable;

package/dist/types/codehighlight/index.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Syntax-highlighted code block component powered by Shiki.
+ *
+ * Ships as a separate entry point (`@tempots/beatui/codehighlight`) to keep the
+ * core bundle small — Shiki grammars and themes are only loaded when this
+ * module is imported.
+ *
+ * ```ts
+ * import { CodeHighlight } from '@tempots/beatui/codehighlight'
+ * ```
+ *
+ * @module
+ */
+export { CodeHighlight, type CodeHighlightOptions } from './code-highlight';

package/dist/types/components/button/toggle-button.d.ts

@@ -9,7 +9,7 @@ export interface ToggleButtonOptions {
     /** Whether the button is currently pressed/active. */
     pressed: Value<boolean>;
     /** Callback invoked when the button is toggled. */
-    onToggle?: (pressed: boolean) => void;
+    onChange?: (pressed: boolean) => void;
     /** Whether the button is disabled. @default false */
     disabled?: Value<boolean>;
     /** Visual style variant. @default 'outline' */
@@ -42,7 +42,7 @@ export interface ToggleButtonOptions {
  *
  * const bold = prop(false)
  * ToggleButton(
- *   { pressed: bold, onToggle: bold.set, variant: 'outline' },
+ *   { pressed: bold, onChange: bold.set, variant: 'outline' },
  *   'B'
  * )
  * ```
@@ -52,9 +52,9 @@ export interface ToggleButtonOptions {
  * // Icon toggle
  * const starred = prop(false)
  * ToggleButton(
- *   { pressed: starred, onToggle: starred.set, color: 'yellow' },
+ *   { pressed: starred, onChange: starred.set, color: 'yellow' },
  *   Icon({ icon: starred.map(s => s ? 'lucide:star' : 'lucide:star-off') })
  * )
  * ```
  */
-export declare function ToggleButton({ pressed, onToggle, disabled, variant, size, color, roundedness, fullWidth, }: ToggleButtonOptions, ...children: TNode[]): import("@tempots/dom").Renderable;
+export declare function ToggleButton({ pressed, onChange, disabled, variant, size, color, roundedness, fullWidth, }: ToggleButtonOptions, ...children: TNode[]): import("@tempots/dom").Renderable;

package/dist/types/components/data/avatar.d.ts

@@ -23,6 +23,8 @@ export interface AvatarOptions {
     color?: Value<ThemeColorName>;
     /** Whether to add a border around the avatar. @default false */
     bordered?: Value<boolean>;
+    /** Theme color for the avatar border. Implies bordered when set. */
+    borderColor?: Value<ThemeColorName>;
 }
 /**
  * Renders a user avatar with image, initials, or icon fallback.
@@ -59,4 +61,4 @@ export interface AvatarOptions {
  * Avatar({ icon: 'mdi:account', size: 'xl', bordered: true })
  * ```
  */
-export declare function Avatar({ src, name, icon, size, variant, color, bordered, }: AvatarOptions, ...children: TNode[]): import("@tempots/dom").Renderable;
+export declare function Avatar({ src, name, icon, size, variant, color, bordered, borderColor, }: AvatarOptions, ...children: TNode[]): import("@tempots/dom").Renderable;

package/dist/types/components/data/badge.d.ts

@@ -17,35 +17,27 @@ export interface BadgeOptions {
     circle?: Value<boolean>;
     /** Whether the badge takes the full width of its container. @default false */
     fullWidth?: Value<boolean>;
-    /** Whether to render as a small colored dot indicator (8px by default). @default false */
-    dot?: Value<boolean>;
+    /** Callback when the close button is clicked. Renders a close button when set. */
+    onClose?: () => void;
+    /** Whether the badge is disabled. @default false */
+    disabled?: Value<boolean>;
 }
 /**
  * Generates CSS class names for the badge based on size, roundedness, and shape.
- *
- * @param size - Control size for padding and text
- * @param roundedness - Border radius preset
- * @param circle - Whether to force a circular shape
- * @param fullWidth - Whether to stretch to full container width
- * @param dot - Whether to render as a small dot indicator
- * @returns Space-separated CSS class string
  */
-export declare function generateBadgeClasses(size: ControlSize, roundedness: RadiusName, circle: boolean, fullWidth: boolean, dot: boolean): string;
+export declare function generateBadgeClasses(size: ControlSize, roundedness: RadiusName, circle: boolean, fullWidth: boolean, disabled: boolean): string;
 /**
  * Generates inline CSS custom properties for badge theming based on variant and color.
  * Sets background, text, border, and hover colors for both light and dark modes.
- *
- * @param variant - The visual style variant
- * @param color - The theme color
- * @returns Semicolon-separated CSS custom property declarations
  */
 export declare function generateBadgeStyles(variant: ButtonVariant, color: ExtendedColor): string;
 /**
  * A small status indicator or label component with theme-aware colors.
  * Supports all button variants (filled, light, outline, default, text) and
  * can be rendered as a pill, circle, or full-width element.
+ * Optionally renders a close button for removable badges.
  *
- * @param options - Configuration for variant, size, color, and shape
+ * @param options - Configuration for variant, size, color, shape, and close behavior
  * @param children - Content to display inside the badge (text, number, icon)
  * @returns A styled span element
  *
@@ -56,8 +48,8 @@ export declare function generateBadgeStyles(variant: ButtonVariant, color: Exten
  *
  * @example
  * ```typescript
- * // Circle badge for notification counts
- * Badge({ circle: true, color: 'danger', size: 'xs' }, '9+')
+ * // Removable badge
+ * Badge({ variant: 'light', color: 'info', onClose: () => remove(item) }, 'TypeScript')
  * ```
  */
-export declare function Badge({ variant, size, color, roundedness, circle, fullWidth, dot, }: BadgeOptions, ...children: TNode[]): import("@tempots/dom").Renderable;
+export declare function Badge({ variant, size, color, roundedness, circle, fullWidth, onClose, disabled, }: BadgeOptions, ...children: TNode[]): import("@tempots/dom").Renderable;

package/dist/types/components/data/column-filter-panel.d.ts

@@ -0,0 +1,31 @@
+import { TNode, Value } from '@tempots/dom';
+import { DataSource } from './data-source';
+import { ColumnValueType } from './data-table-types';
+import { ControlSize } from '../theme';
+/**
+ * Options for the {@link ColumnFilterPanel} component.
+ *
+ * @typeParam T - The type of data rows in the data source
+ * @typeParam C - Column identifier type (defaults to `string`)
+ */
+export interface ColumnFilterPanelOptions<T, C extends string = string> {
+    /** The data source to wire filtering into */
+    dataSource: DataSource<T, C>;
+    /** Column identifier */
+    column: C;
+    /** The column value type, determining which operators are available. @default 'text' */
+    columnType?: ColumnValueType;
+    /** Size variant. @default 'sm' */
+    size?: Value<ControlSize>;
+    /** When true, render only the panel content without trigger button and flyout wrapper. @default false */
+    embedded?: boolean;
+}
+/**
+ * A flyout-based per-column filter builder that lets users compose
+ * multiple conditions with AND/OR logic.
+ *
+ * @typeParam T - The type of data rows
+ * @param opts - Configuration for the filter panel
+ * @returns A trigger button with a flyout filter panel
+ */
+export declare function ColumnFilterPanel<T, C extends string = string>(opts: ColumnFilterPanelOptions<T, C>): TNode;

package/dist/types/components/data/column-filter.d.ts

@@ -0,0 +1,110 @@
+import { Value } from '@tempots/dom';
+import { DataSource } from './data-source';
+import { TextOperator } from './filter';
+import { ControlSize } from '../theme';
+/**
+ * Base options shared by all {@link ColumnFilter} variants.
+ *
+ * @typeParam T - The type of data rows in the data source
+ * @typeParam C - Column identifier type (defaults to `string`)
+ */
+export interface ColumnFilterBase<T, C extends string = string> {
+    /** The data source to wire filtering into */
+    dataSource: DataSource<T, C>;
+    /** Column identifier */
+    column: C;
+    /** Size variant. @default 'sm' */
+    size?: Value<ControlSize>;
+}
+/**
+ * Options for a text-input column filter.
+ *
+ * @typeParam T - The type of data rows in the data source
+ */
+export interface TextColumnFilter<T, C extends string = string> extends ColumnFilterBase<T, C> {
+    /** Discriminator — omit or set to `'text'` for a debounced text input. */
+    type?: 'text';
+    /** Placeholder text for the text input. @default 'Filter...' */
+    placeholder?: Value<string>;
+    /** Filter operator applied when text is non-empty. @default 'contains' */
+    operator?: TextOperator;
+    /** Debounce delay in milliseconds. @default 300 */
+    debounce?: number;
+}
+/**
+ * Options for a select-dropdown column filter.
+ *
+ * @typeParam T - The type of data rows in the data source
+ */
+export interface SelectColumnFilter<T, C extends string = string> extends ColumnFilterBase<T, C> {
+    /** Discriminator — must be `'select'` for a dropdown filter. */
+    type: 'select';
+    /** The list of value/label pairs to present in the dropdown. */
+    options: {
+        value: string;
+        label: string;
+    }[];
+    /**
+     * Label for the "show all rows" option at the top of the dropdown.
+     * @default 'All'
+     */
+    allLabel?: string;
+}
+/**
+ * Options for a multi-select tags column filter.
+ *
+ * @typeParam T - The type of data rows in the data source
+ */
+export interface TagsColumnFilter<T, C extends string = string> extends ColumnFilterBase<T, C> {
+    /** Discriminator — must be `'tags'` for a multi-select tag input filter. */
+    type: 'tags';
+    /** The list of value/label pairs. */
+    options: {
+        value: string;
+        label: string;
+    }[];
+    /** Placeholder text. @default 'Select values...' */
+    placeholder?: Value<string>;
+}
+/**
+ * Options for the {@link ColumnFilter} component.
+ *
+ * Use the `type` discriminator to select between `'text'` (default),
+ * `'select'`, and `'tags'` variants.
+ *
+ * @typeParam T - The type of data rows in the data source
+ * @typeParam C - Column identifier type (defaults to `string`)
+ */
+export type ColumnFilterOptions<T, C extends string = string> = TextColumnFilter<T, C> | SelectColumnFilter<T, C> | TagsColumnFilter<T, C>;
+/**
+ * A per-column filter input that wires into a {@link DataSource}.
+ *
+ * Supports two modes:
+ * - `'text'` (default): A debounced {@link TextInput} that filters rows by the
+ *   specified operator. The debounce timer is automatically cleared on disposal.
+ * - `'select'`: A {@link NativeSelect} dropdown that filters rows by exact
+ *   match. An "All" option (customisable via `allLabel`) removes the filter.
+ *
+ * @typeParam T - The type of data rows
+ * @param options - Filter configuration (discriminated by `type`)
+ * @returns A reactive filter control wired to the given data source
+ *
+ * @example
+ * ```ts
+ * // Text filter (default)
+ * ColumnFilter({ dataSource: ds, column: 'name', placeholder: 'Search name...' })
+ *
+ * // Select filter
+ * ColumnFilter({
+ *   dataSource: ds,
+ *   column: 'role',
+ *   type: 'select',
+ *   options: [
+ *     { value: 'admin', label: 'Admin' },
+ *     { value: 'user', label: 'User' },
+ *   ],
+ *   allLabel: 'All roles',
+ * })
+ * ```
+ */
+export declare function ColumnFilter<T, C extends string = string>(opts: ColumnFilterOptions<T, C>): import("@tempots/core").Renderable<import("@tempots/dom").DOMContext, typeof import("@tempots/dom").DOM_RENDERABLE_TYPE>;

package/dist/types/components/data/column-header-menu.d.ts

@@ -0,0 +1,42 @@
+import { Signal, TNode, Value } from '@tempots/dom';
+import { DataSource } from './data-source';
+import { ControlSize } from '../theme';
+/**
+ * Options for the {@link ColumnHeaderMenu} component.
+ */
+export interface ColumnHeaderMenuOptions<T, C extends string = string> {
+    /** The data source for sort state */
+    dataSource: DataSource<T, C>;
+    /** Column identifier */
+    column: C;
+    /** Whether this column supports sorting */
+    sortable?: boolean;
+    /** Whether this column can be hidden */
+    hideable?: boolean;
+    /** Size variant. @default 'md' */
+    size?: Value<ControlSize>;
+    /** Callback to hide this column */
+    onHideColumn?: () => void;
+    /** Columns that can be shown/hidden */
+    hideableColumns?: {
+        id: string;
+        label: string;
+    }[];
+    /** Currently hidden column IDs (reactive) */
+    hiddenColumns?: Signal<Set<string>>;
+    /** Toggle a column's visibility */
+    onToggleColumn?: (colId: string) => void;
+    /** Show all hidden columns */
+    onResetColumns?: () => void;
+    /** Filter content to embed as a submenu (ColumnFilterPanel, ColumnFilter, etc.) */
+    filterContent?: TNode;
+    /** Whether this column has an active filter (reactive) */
+    hasActiveFilter?: Signal<boolean>;
+    /** Callback to clear all filters on this column */
+    onClearFilter?: () => void;
+}
+/**
+ * A kebab menu (⋮) for a column header providing sort, filter, hide, and column
+ * management actions. Uses the existing {@link Menu} component.
+ */
+export declare function ColumnHeaderMenu<T, C extends string = string>(opts: ColumnHeaderMenuOptions<T, C>): TNode;