@webority/ui-react 0.61.2 → 0.63.0

package/dist/components/AppDatePicker.js

@@ -1 +1 @@
-import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppRequiredMark.js";import r from"./useWuiControl.js";import{forwardRef as i,useId as a}from"react";import{jsx as o,jsxs as s}from"react/jsx-runtime";import"@webority/ui-elements/elements/datepicker";var c=[`sm`,`md`,`lg`],l=i(function({value:i,onChange:l,label:u,required:d=!1,hint:f,error:p,name:m,min:h,max:g,placeholder:_=`Enter Date`,disabled:v,size:y,firstDay:b,displayFormat:x,id:S,ariaLabel:C,className:w=``,fieldClassName:T=``,...E},D){t(`AppDatePicker`,E),e(`AppDatePicker`,`size`,y,c);let O=a(),k=S||O,{setRef:A}=r({ref:D,value:i??``,onChange:l}),j=!u&&!p&&!f,M=p?`${k}-error`:void 0,N=f?`${k}-hint`:void 0,P=o(`wui-datepicker`,{ref:A,id:k,name:m,min:h,max:g,placeholder:_,size:y||void 0,"first-day":b==null?void 0:String(b),"display-format":x||void 0,"aria-label":C||(typeof u==`string`?u:void 0),"aria-describedby":M||N,"aria-invalid":p?`true`:void 0,disabled:v?``:void 0,required:d?``:void 0,className:w||void 0,...E});return j?P:s(`div`,{className:`field${T?` ${T}`:``}`,children:[u&&s(`label`,{className:`label`,htmlFor:k,children:[u,d&&o(n,{})]}),P,p&&o(`div`,{className:`field-error`,id:M,children:p}),!p&&f&&o(`div`,{className:`field-hint`,id:N,children:f})]})});export{l as default};
+import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppRequiredMark.js";import r from"./useWuiControl.js";import{forwardRef as i,useId as a}from"react";import{jsx as o,jsxs as s}from"react/jsx-runtime";import"@webority/ui-elements/elements/datepicker";var c=[`sm`,`md`,`lg`],l=i(function({value:i,onChange:l,label:u,required:d=!1,hint:f,error:p,name:m,min:h,max:g,placeholder:_=`Choose a date`,disabled:v,size:y,firstDay:b,displayFormat:x,id:S,ariaLabel:C,className:w=``,fieldClassName:T=``,...E},D){t(`AppDatePicker`,E),e(`AppDatePicker`,`size`,y,c);let O=a(),k=S||O,{setRef:A}=r({ref:D,value:i??``,onChange:l}),j=!u&&!p&&!f,M=p?`${k}-error`:void 0,N=f?`${k}-hint`:void 0,P=o(`wui-datepicker`,{ref:A,id:k,name:m,min:h,max:g,placeholder:_,size:y||void 0,"first-day":b==null?void 0:String(b),"display-format":x||void 0,"aria-label":C||(typeof u==`string`?u:void 0),"aria-describedby":M||N,"aria-invalid":p?`true`:void 0,disabled:v?``:void 0,required:d?``:void 0,className:w||void 0,...E});return j?P:s(`div`,{className:`field${T?` ${T}`:``}`,children:[u&&s(`label`,{className:`label`,htmlFor:k,children:[u,d&&o(n,{})]}),P,p&&o(`div`,{className:`field-error`,id:M,children:p}),!p&&f&&o(`div`,{className:`field-hint`,id:N,children:f})]})});export{l as default};

package/dist/components/AppDropdown.js

@@ -1 +1 @@
-import e from"./warnUnknownProps.js";import{shortcutAria as t,shortcutChip as n}from"../lib/shortcutChip.js";import r from"./AppIcon.js";import i from"./renderIconProp.js";import{forwardRef as a,useEffect as o,useRef as s,useState as c}from"react";import{Dropdown as l}from"react-bootstrap";import{jsx as u,jsxs as d}from"react/jsx-runtime";var f=!1;function p(){let e=!0;try{e=process.env.NODE_ENV!==`production`}catch{e=!0}!e||f||(f=!0,console.warn("[@webority/ui-react] <AppDropdown> icon-only toggle has no accessible name — pass `label` or `ariaLabel`."))}function m({icon:r,iconSize:a,toggleClassName:f,label:m,ariaLabel:g,align:_=`end`,items:v=[],menuClassName:y=``,linkComponent:b,children:x,trigger:S,show:C,onToggle:w,...T}){e(`AppDropdown`,T),!S&&!g&&!m&&p();let E=f??(S?`wui-dropdown-trigger`:`topbar-icon-btn`),D=C!==void 0,[O,k]=c(!1),A=D?!!C:O,j=s(null);j.current=(e,t)=>{D||k(e),w?.(e,t)};let M=s(null);return o(()=>{if(!A)return;let e=M.current?.getBoundingClientRect(),t=()=>{let t=M.current?.getBoundingClientRect();(!e||!t||Math.abs(t.top-e.top)>2||Math.abs(t.left-e.left)>2)&&j.current(!1,{source:`scroll`})},n=()=>j.current(!1,{source:`resize`});return window.addEventListener(`scroll`,t,{capture:!0,passive:!0}),window.addEventListener(`resize`,n),()=>{window.removeEventListener(`scroll`,t,{capture:!0}),window.removeEventListener(`resize`,n)}},[A]),d(l,{ref:M,align:_,show:A,onToggle:(e,t)=>j.current(e,t),...T,children:[u(l.Toggle,{as:h,icon:r,iconSize:a,btnClassName:E,trigger:S,title:m,"aria-label":g??(S?void 0:m)}),u(l.Menu,{className:y,renderOnMount:!0,popperConfig:{strategy:`fixed`},children:x??v.map(e=>{if(e.divider)return u(l.Divider,{},e.key);let r=e.to?b?{as:b,to:e.to}:{as:`a`,href:e.to}:{as:`button`,type:`button`};return d(l.Item,{...r,onClick:e.onClick,className:e.danger?`danger`:void 0,"aria-keyshortcuts":t(e.shortcut),children:[e.image?u(`img`,{src:e.image,alt:``}):i(e.icon,{size:16}),e.label,n(e.shortcut)]},e.key)})})]})}var h=a(function({icon:e,iconSize:t=20,btnClassName:n=`topbar-icon-btn`,trigger:i,"aria-label":a,className:o,...s},c){return u(`button`,{ref:c,type:`button`,className:n,"aria-label":a,...s,children:i??u(r,{name:e,size:t})})});export{m as default};
+import e from"./warnUnknownProps.js";import{shortcutAria as t,shortcutChip as n}from"../lib/shortcutChip.js";import r from"./AppIcon.js";import i from"./renderIconProp.js";import{forwardRef as a,useEffect as o,useRef as s,useState as c}from"react";import{Dropdown as l}from"react-bootstrap";import{jsx as u,jsxs as d}from"react/jsx-runtime";var f=!1;function p(){let e=!0;try{e=process.env.NODE_ENV!==`production`}catch{e=!0}!e||f||(f=!0,console.warn("[@webority/ui-react] <AppDropdown> icon-only toggle has no accessible name — pass `label` or `ariaLabel`."))}function m({icon:r,iconSize:a,toggleClassName:f,label:m,ariaLabel:g,align:_=`end`,items:v=[],menuClassName:y=``,linkComponent:b,children:x,trigger:S,show:C,onToggle:w,...T}){e(`AppDropdown`,T),!S&&!g&&!m&&p();let E=f??(S?`wui-dropdown-trigger`:`topbar-icon-btn`),D=C!==void 0,[O,k]=c(!1),A=D?!!C:O,j=s(null);j.current=(e,t)=>{D||k(e),w?.(e,t)};let M=s(null);return o(()=>{if(!A)return;let e=M.current?.getBoundingClientRect(),t=()=>{let t=M.current?.getBoundingClientRect();(!e||!t||Math.abs(t.top-e.top)>2||Math.abs(t.left-e.left)>2)&&j.current(!1,{source:`scroll`})},n=()=>j.current(!1,{source:`resize`});return window.addEventListener(`scroll`,t,{capture:!0,passive:!0}),window.addEventListener(`resize`,n),()=>{window.removeEventListener(`scroll`,t,{capture:!0}),window.removeEventListener(`resize`,n)}},[A]),d(l,{ref:M,align:_,show:A,onToggle:(e,t)=>j.current(e,t),...T,children:[u(l.Toggle,{as:h,icon:r,iconSize:a,btnClassName:E,trigger:S,title:m,"aria-label":g??(S?void 0:m)}),u(l.Menu,{className:y,renderOnMount:!0,popperConfig:{strategy:`fixed`},children:x??v.map(e=>{if(e.header!=null)return u(`div`,{className:`dropdown-header`,children:e.header},e.key);if(e.divider)return u(l.Divider,{},e.key);let r=e.to?b?{as:b,to:e.to}:{as:`a`,href:e.to}:{as:`button`,type:`button`};return d(l.Item,{...r,onClick:e.onClick,className:e.danger?`danger`:void 0,"aria-keyshortcuts":t(e.shortcut),children:[e.image?u(`img`,{src:e.image,alt:``}):i(e.icon,{size:16}),e.label,n(e.shortcut)]},e.key)})})]})}var h=a(function({icon:e,iconSize:t=20,btnClassName:n=`topbar-icon-btn`,trigger:i,"aria-label":a,className:o,...s},c){return u(`button`,{ref:c,type:`button`,className:n,"aria-label":a,...s,children:i??u(r,{name:e,size:t})})});export{m as default};

package/dist/components/AppFilterBar.js

@@ -1 +1 @@
-import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import r from"./AppButton.js";import i from"./AppSegmented.js";import a from"./AppChip.js";import o from"./AppDateRangePicker.js";import{emptyFacetValue as s,isFacetActive as c}from"../lib/listQuery.js";import l from"./AppMultiSelect.js";import u from"./AppSearch.js";import d from"./AppSelect.js";import{useEffect as f,useRef as p,useSyncExternalStore as m}from"react";import{jsx as h,jsxs as g}from"react/jsx-runtime";var _=`(max-width: 575.98px)`,v=3,y=e=>{let t=window.matchMedia?.(_);return t?.addEventListener(`change`,e),()=>t?.removeEventListener(`change`,e)},b=()=>window.matchMedia?.(_).matches??!1,x=[`enum`,`multiEnum`,`dateRange`,`text`],S=4,C=e=>(e.type===`enum`||e.type===`multiEnum`)&&!e.options?.length,w=(e,t)=>e.options?.find(e=>e.value===t)?.label??t;function T(e,t){if(!c(e,t))return[];if(e.type===`enum`)return[{id:e.key,text:w(e,t),clear:()=>s(e)}];if(e.type===`multiEnum`)return t.map(n=>({id:`${e.key}:${n}`,text:w(e,n),clear:()=>t.filter(e=>e!==n)}));if(e.type===`dateRange`){let n=t.from&&t.to?`${t.from} to ${t.to}`:t.from?`From ${t.from}`:`Until ${t.to}`;return[{id:e.key,text:n,clear:()=>s(e)}]}return[]}function E({facets:i,value:o,onChange:l,inline:u=v,className:d=``,..._}){t(`AppFilterBar`,_);let S=m(y,b,()=>!1),w=p(null);for(let t of i)e(`AppFilterBar`,`facets[].type`,t.type,x);let E=i.filter(e=>!C(e)),O=E.flatMap(e=>T(e,o[e.key]).map(t=>({...t,facet:e}))),k=E.filter(e=>c(e,o[e.key])),A=S?0:Math.max(0,u),j=E.slice(A),M=j.filter(e=>k.includes(e)).length,N=j.length>0;f(()=>{if(!N)return;let e=e=>{let t=w.current;t?.open&&(e.type===`keydown`?e.key===`Escape`:!e.composedPath().includes(t))&&(t.open=!1)};return document.addEventListener(`click`,e),document.addEventListener(`keydown`,e),()=>{document.removeEventListener(`click`,e),document.removeEventListener(`keydown`,e)}},[N]);let P=e=>h(D,{facet:e,value:o[e.key],onChange:t=>l(e.key,t)},e.key),F=(e,t)=>t>0&&h(`span`,{className:e,children:` (${t})`});return g(`div`,{className:`wui-filter-bar d-flex flex-wrap align-items-center gap-2${S&&N?` wui-filter-bar--folded`:``}${d?` ${d}`:``}`,..._,children:[E.slice(0,A).map(P),N&&g(`details`,{ref:w,className:`wui-filter-more`,children:[g(`summary`,{className:`btn btn-outline-primary btn-sm wui-filter-more-trigger`,children:[h(n,{name:`filter`,size:14,className:`me-2`}),`Filters`,F(`wui-filter-count-desktop`,M),F(`wui-filter-count-phone`,k.length)]}),g(`div`,{className:`wui-filter-more-panel`,children:[h(`div`,{className:`wui-filter-more-head`,children:`Filters`}),j.map(P)]})]}),O.map(e=>h(a,{size:`sm`,label:`${e.facet.label}: ${e.text}`,removeLabel:`Remove ${e.facet.label} filter ${e.text}`,onRemove:()=>l(e.facet.key,e.clear())},e.id)),k.length>1&&h(r,{variant:`ghost`,size:`sm`,onClick:()=>{for(let e of k)l(e.key,s(e))},children:`Clear all`})]})}function D({facet:e,value:t,onChange:n}){if(e.type===`enum`){let r=e.options??[];return r.length<S?h(i,{label:e.label,name:e.key,size:`sm`,value:t??``,onChange:n,options:[{value:``,label:`All`},...r]}):h(d,{"aria-label":e.label,name:e.key,placeholder:e.label,size:`sm`,clearable:!0,value:t??``,onChange:n,options:r})}return e.type===`multiEnum`?h(l,{"aria-label":e.label,name:e.key,placeholder:e.label,size:`sm`,collapseChips:!0,values:t??[],onChange:n,options:e.options??[]}):e.type===`dateRange`?h(o,{ariaLabel:e.label,startName:`${e.key}From`,endName:`${e.key}To`,placeholder:e.label,size:`sm`,start:t?.from??``,end:t?.to??``,onChange:e=>n({from:e.start??``,to:e.end??``})}):h(u,{ariaLabel:e.label,name:e.key,placeholder:e.label,size:`sm`,value:t??``,onChange:n})}export{E as default};
+import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import r from"./AppButton.js";import i from"./AppSegmented.js";import a from"./AppChip.js";import o from"./AppDateRangePicker.js";import{emptyFacetValue as s,isFacetActive as c}from"../lib/listQuery.js";import l from"./AppMultiSelect.js";import u from"./AppSearch.js";import d from"./AppSelect.js";import{useEffect as f,useRef as p,useSyncExternalStore as m}from"react";import{jsx as h,jsxs as g}from"react/jsx-runtime";var _=`(max-width: 575.98px)`,v=3,y=e=>{let t=window.matchMedia?.(_);return t?.addEventListener(`change`,e),()=>t?.removeEventListener(`change`,e)},b=()=>window.matchMedia?.(_).matches??!1,x=[`enum`,`multiEnum`,`dateRange`,`text`],S=4,C=e=>(e.type===`enum`||e.type===`multiEnum`)&&!e.options?.length,w=(e,t)=>e.options?.find(e=>e.value===t)?.label??t;function T(e,t){if(!c(e,t))return[];if(e.type===`enum`)return[{id:e.key,text:w(e,t),clear:()=>s(e)}];if(e.type===`multiEnum`)return t.map(n=>({id:`${e.key}:${n}`,text:w(e,n),clear:()=>t.filter(e=>e!==n)}));if(e.type===`dateRange`){let n=t.from&&t.to?`${t.from} to ${t.to}`:t.from?`From ${t.from}`:`Until ${t.to}`;return[{id:e.key,text:n,clear:()=>s(e)}]}return[]}var E=new Set;function D(e){let t=!0;try{t=process.env.NODE_ENV!==`production`}catch{t=!0}!t||E.has(e)||(E.add(e),console.warn(`[@webority/ui-react] <AppFilterBar> facet "${e}" sets allLabel, which only an enum facet uses.`))}function O({facets:i,value:o,onChange:l,inline:u=v,className:d=``,..._}){t(`AppFilterBar`,_);let S=m(y,b,()=>!1),w=p(null);for(let t of i)e(`AppFilterBar`,`facets[].type`,t.type,x);for(let e of i)e.allLabel!=null&&e.type!==`enum`&&D(e.key);let E=i.filter(e=>!C(e)),O=E.flatMap(e=>T(e,o[e.key]).map(t=>({...t,facet:e}))),A=E.filter(e=>c(e,o[e.key])),j=S?0:Math.max(0,u),M=E.slice(j),N=M.filter(e=>A.includes(e)).length,P=M.length>0;f(()=>{if(!P)return;let e=e=>{let t=w.current;t?.open&&(e.type===`keydown`?e.key===`Escape`:!e.composedPath().includes(t))&&(t.open=!1)};return document.addEventListener(`click`,e),document.addEventListener(`keydown`,e),()=>{document.removeEventListener(`click`,e),document.removeEventListener(`keydown`,e)}},[P]);let F=e=>h(k,{facet:e,value:o[e.key],onChange:t=>l(e.key,t)},e.key),I=(e,t)=>t>0&&h(`span`,{className:e,children:` (${t})`});return g(`div`,{className:`wui-filter-bar d-flex flex-wrap align-items-center gap-2${S&&P?` wui-filter-bar--folded`:``}${d?` ${d}`:``}`,..._,children:[E.slice(0,j).map(F),P&&g(`details`,{ref:w,className:`wui-filter-more`,children:[g(`summary`,{className:`btn btn-outline-primary btn-sm wui-filter-more-trigger`,children:[h(n,{name:`filter`,size:14,className:`me-2`}),`Filters`,I(`wui-filter-count-desktop`,N),I(`wui-filter-count-phone`,A.length)]}),g(`div`,{className:`wui-filter-more-panel`,children:[h(`div`,{className:`wui-filter-more-head`,children:`Filters`}),M.map(F)]})]}),O.map(e=>h(a,{size:`sm`,label:`${e.facet.label}: ${e.text}`,removeLabel:`Remove ${e.facet.label} filter ${e.text}`,onRemove:()=>l(e.facet.key,e.clear())},e.id)),A.length>1&&h(r,{variant:`ghost`,size:`sm`,onClick:()=>{for(let e of A)l(e.key,s(e))},children:`Clear all`})]})}function k({facet:e,value:t,onChange:n}){if(e.type===`enum`){let r=e.options??[];return r.length<S?h(i,{label:e.label,name:e.key,size:`sm`,value:t??``,onChange:n,options:[{value:``,label:e.allLabel||`All`},...r]}):h(d,{"aria-label":e.label,name:e.key,placeholder:e.label,size:`sm`,clearable:!0,value:t??``,onChange:n,options:r})}return e.type===`multiEnum`?h(l,{"aria-label":e.label,name:e.key,placeholder:e.label,size:`sm`,collapseChips:!0,values:t??[],onChange:n,options:e.options??[]}):e.type===`dateRange`?h(o,{ariaLabel:e.label,startName:`${e.key}From`,endName:`${e.key}To`,placeholder:e.label,size:`sm`,start:t?.from??``,end:t?.to??``,onChange:e=>n({from:e.start??``,to:e.end??``})}):h(u,{ariaLabel:e.label,name:e.key,placeholder:e.label,size:`sm`,value:t??``,onChange:n})}export{O as default};

package/dist/types/components/AppConsentBanner.d.ts

@@ -13,6 +13,8 @@ import "@webority/ui-elements/elements/consent-banner";
  * Any element carrying `data-consent-settings` reopens the banner with the switches showing, so
  * a footer "Cookie settings" link needs no code: withdrawing consent must be as easy as giving it.
  *
+ * On phones (under 576px) it is a slim bar along the bottom edge; Cookie settings stays behind its button.
+ *
  * ```jsx
  * initConsent({ requiresOptIn, cookieDomain: ".example.com" }); // app bootstrap, once
  *

package/dist/types/components/AppDatePicker.d.ts

@@ -19,7 +19,7 @@ import "@webority/ui-elements/elements/datepicker";
  * @param {string} [props.name]
  * @param {string} [props.min]
  * @param {string} [props.max]
- * @param {string} [props.placeholder="Enter Date"]
+ * @param {string} [props.placeholder="Choose a date"]
  * @param {boolean} [props.disabled]
  * @param {'sm'|'md'|'lg'} [props.size] Control height tier, matching AppInput.
  * @param {0|1|2|3|4|5|6} [props.firstDay] First weekday of the calendar, 0 Sunday to 6 Saturday. Unset, it

package/dist/types/components/AppDropdown.d.ts

@@ -15,12 +15,14 @@
  * @param {string} [props.label] Tooltip + accessible-name fallback for the toggle.
  * @param {"start"|"end"} [props.align="end"] Menu alignment.
  * @param {string} [props.ariaLabel]
- * @param {{ key: string, label?: string, icon?: string|import('react').ReactNode, image?: string, to?: string, onClick?: () => void, danger?: boolean, shortcut?: string, divider?: true }[]} [props.items]
+ * @param {{ key: string, label?: string, icon?: string|import('react').ReactNode, image?: string, to?: string, onClick?: () => void, danger?: boolean, shortcut?: string, divider?: true, header?: string }[]} [props.items]
  *   `icon` is a glyph name OR a custom node (e.g. an iconsax glyph); `image` is a picture URL (external logo/avatar) — pass one.
  *   `shortcut` is the key that runs the item ("E"), drawn as a key chip at the end of the row; the
  *   page binds the key itself (useListShortcuts).
  *   An item with `divider: true` renders a separator instead of an action; it needs no
  *   `label`/`onClick`, just a unique `key`.
+ *   An item with `header` renders a small group heading (`<div class="dropdown-header">`) instead of an action;
+ *   it needs no `label`/`onClick`, just a unique `key`.
  * @param {string} [props.menuClassName]
  * @param {import('react').ElementType} [props.linkComponent] Component for `to` items (e.g. Link).
  * @param {import('react').ReactNode} [props.children] Rich menu content — renders inside the
@@ -57,6 +59,7 @@ export default function AppDropdown({ icon, iconSize, toggleClassName, label, ar
         danger?: boolean;
         shortcut?: string;
         divider?: true;
+        header?: string;
     }[];
     menuClassName?: string;
     linkComponent?: import('react').ElementType;

package/dist/types/components/AppFilterBar.d.ts

@@ -5,7 +5,7 @@
  *
  * `value` is an object keyed by facet key. A facet's value is a string for `enum` and `text`, an array
  * of strings for `multiEnum`, and `{ from, to }` (yyyy-MM-dd strings) for `dateRange`; the empty value
- * is "", [] and `{ from: "", to: "" }`. An `enum` shows as segments (with an "All" segment) up to three
+ * is "", [] and `{ from: "", to: "" }`. An `enum` shows as segments (with an "All" segment, renamed by `allLabel`) up to three
  * options and as a clearable select beyond that. A `text` facet has no chip: its box shows the text
  * and clears itself. The controls, chips and Clear all share one row, the search box wider and
  * selects and date ranges narrow; it wraps only when full, and each facet takes its own line on a phone.
@@ -18,8 +18,9 @@
  *
  * @param {object} props
  * @param {{ key: string, label: string, type: 'enum'|'multiEnum'|'dateRange'|'text',
- *   options?: { value: string, label: string }[] }[]} props.facets `options` fills an `enum` or `multiEnum`;
+ *   options?: { value: string, label: string }[], allLabel?: string }[]} props.facets `options` fills an `enum` or `multiEnum`;
  *   one with no options draws nothing. `label` names the control for assistive technology and is its placeholder.
+ *   `allLabel` names an `enum` facet's clearing segment ("All payments"; default "All"); a facet shown as a select ignores it.
  * @param {Record<string, string|string[]|{ from: string, to: string }>} props.value The current filters.
  * @param {(key: string, value: string|string[]|{ from: string, to: string }) => void} props.onChange
  *   Called with the facet key and its new value. Clear all calls it once per active facet, with the empty value.
@@ -35,6 +36,7 @@ export default function AppFilterBar({ facets: allFacets, value, onChange, inlin
             value: string;
             label: string;
         }[];
+        allLabel?: string;
     }[];
     value: Record<string, string | string[] | {
         from: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webority/ui-react",
-  "version": "0.61.2",
+  "version": "0.63.0",
   "description": "Webority shared React component library — App* primitives on react-bootstrap + the @webority/theme design system.",
   "license": "SEE LICENSE IN LICENSE",
   "type": "module",
@@ -27,8 +27,8 @@
   },
   "sideEffects": false,
   "dependencies": {
-    "@webority/ui-elements": "0.61.2",
-    "@webority/theme": "0.61.2"
+    "@webority/theme": "0.63.0",
+    "@webority/ui-elements": "0.63.0"
   },
   "peerDependencies": {
     "@webority/analytics": "^0.23.0",