@webority/ui-react 0.50.0 → 0.51.0

package/dist/components/AppFileViewer.js

@@ -1 +1 @@
-import e from"./warnUnknownProps.js";import{forwardRef as t,useCallback as n,useEffect as r,useLayoutEffect as i,useRef as a,useState as o}from"react";import{Fragment as s,jsx as c,jsxs as l}from"react/jsx-runtime";import{createPortal as u}from"react-dom";var d=`wui-file-viewer:load`,f=`wui-file-viewer:error`,p=`wui-file-viewer:prefs-change`,m=t(function({src:t,name:m,type:h,prefs:g,onPrefsChange:_,viewKey:v,download:y=!1,workerSrc:b,assetBase:x,captions:S,actions:C,onLoad:w,onError:T,className:E=``,style:D,...O},k){e(`AppFileViewer`,O);let A=a(null),j=a(w),M=a(T),N=a(_),[P,F]=o(null),I=n(e=>{A.current=e,typeof k==`function`?k(e):k&&(k.current=e)},[k]);return i(()=>{g!==void 0&&(A.current.prefs=g)},[g]),r(()=>{j.current=w,M.current=T,N.current=_}),r(()=>{let e=A.current,t=e=>j.current?.(e.detail),n=e=>M.current?.(e.detail),r=e=>N.current?.(e.detail);return e.addEventListener(d,t),e.addEventListener(f,n),e.addEventListener(p,r),()=>{e.removeEventListener(d,t),e.removeEventListener(f,n),e.removeEventListener(p,r)}},[]),r(()=>{let e=!0;return import(`@webority/ui-elements/file-viewer`).then(()=>{let t=A.current;e&&t?.isConnected&&F(t.actionsContainer)}).catch(t=>{console.warn(`[AppFileViewer] the viewer failed to load:`,t?.message),e&&M.current?.({message:t?.message??String(t)})}),()=>{e=!1}},[]),l(s,{children:[c(`wui-file-viewer`,{ref:I,src:t,name:m||void 0,type:h||void 0,"view-key":v||void 0,download:y?``:void 0,"worker-src":b||void 0,"asset-base":x||void 0,captions:S||void 0,className:E||void 0,style:D,...O}),P&&C!=null&&u(c(`div`,{slot:`actions`,className:`wui-file-viewer-slot`,children:C}),P)]})});export{m as default};
+import e from"./warnUnknownProps.js";import{forwardRef as t,useCallback as n,useEffect as r,useLayoutEffect as i,useRef as a,useState as o}from"react";import{Fragment as s,jsx as c,jsxs as l}from"react/jsx-runtime";import{createPortal as u}from"react-dom";var d=`wui-file-viewer:load`,f=`wui-file-viewer:error`,p=`wui-file-viewer:prefs-change`,m=t(function({src:t,name:m,type:h,prefs:g,onPrefsChange:_,viewKey:v,download:y=!1,print:b=!0,workerSrc:x,assetBase:S,captions:C,actions:w,onLoad:T,onError:E,className:D=``,style:O,...k},A){e(`AppFileViewer`,k);let j=a(null),M=a(T),N=a(E),P=a(_),[F,I]=o(null),L=n(e=>{j.current=e,typeof A==`function`?A(e):A&&(A.current=e)},[A]);return i(()=>{g!==void 0&&(j.current.prefs=g)},[g]),r(()=>{M.current=T,N.current=E,P.current=_}),r(()=>{let e=j.current,t=e=>M.current?.(e.detail),n=e=>N.current?.(e.detail),r=e=>P.current?.(e.detail);return e.addEventListener(d,t),e.addEventListener(f,n),e.addEventListener(p,r),()=>{e.removeEventListener(d,t),e.removeEventListener(f,n),e.removeEventListener(p,r)}},[]),r(()=>{let e=!0;return import(`@webority/ui-elements/file-viewer`).then(()=>{let t=j.current;e&&t?.isConnected&&I(t.actionsContainer)}).catch(t=>{console.warn(`[AppFileViewer] the viewer failed to load:`,t?.message),e&&N.current?.({message:t?.message??String(t)})}),()=>{e=!1}},[]),l(s,{children:[c(`wui-file-viewer`,{ref:L,src:t,name:m||void 0,type:h||void 0,"view-key":v||void 0,download:y?``:void 0,print:b?void 0:`false`,"worker-src":x||void 0,"asset-base":S||void 0,captions:C||void 0,className:D||void 0,style:O,...k}),F&&w!=null&&u(c(`div`,{slot:`actions`,className:`wui-file-viewer-slot`,children:w}),F)]})});export{m as default};

package/dist/components/AppInput.js

@@ -1 +1 @@
-import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import r from"./AppPopover.js";import ee from"./AppInfoTip.js";import i from"./AppRequiredMark.js";import{MASK_INPUT_TYPES as te,MASK_NAMES as ne,attachInputMask as re,evaluatePassword as ie,formatMasked as ae,isMaskPattern as oe,postedMasked as se}from"@webority/ui-elements/helpers";import{forwardRef as a,useEffect as o,useId as ce,useRef as le,useState as s}from"react";import{Form as c}from"react-bootstrap";import{jsx as l,jsxs as u}from"react/jsx-runtime";var ue=[`sm`,`md`,`lg`],de=[`bare`],d=a(function({label:a,required:d=!1,error:fe,hint:f,help:p,helpLabel:pe=`More information`,type:m=`text`,size:h=`md`,leftIcon:g,rightIcon:_,onRightIconClick:v,rightIconLabel:me,unit:y,id:he,name:ge,className:_e=``,fieldClassName:b=``,disabled:x=!1,clearable:S=!1,showCount:ve=!1,maxLength:C,prefix:w,suffix:T,action:E,floatingLabel:D=!1,variant:O,passwordRequirements:k=!1,requirementsPlacement:ye=`auto`,mask:A,postFormatted:j=!1,onMaskChange:M,...N},P){t(`AppInput`,N),e(`AppInput`,`size`,h,ue),e(`AppInput`,`variant`,O,de),A!=null&&!oe(A)&&e(`AppInput`,`mask`,A,ne),A!=null&&e(`AppInput`,`type`,m,te);let[F,be]=s(!1),[xe,Se]=s(``),I=fe||xe,Ce=ce(),L=he||Ce,R=m===`password`,we=R&&F?`text`:m,z=le(null),Te=e=>{z.current=e,typeof P==`function`?P(e):P&&(P.current=e)},B=String(N.value??N.defaultValue??``),[Ee,V]=s(()=>!!B),[H,U]=s(()=>B.length),W=S&&!x,G=S||ve,K=R&&!!k,[De,q]=s(B);o(()=>{!K||N.value===void 0||q(String(N.value??``))},[N.value,K]),o(()=>{if(!G||N.value===void 0)return;let e=String(N.value??``);V(!!e),U(e.length)},[N.value,G]);let Oe=e=>{V(!!e.target.value),U(e.target.value.length),N.onInput?.(e)},ke=e=>{K&&q(e.target.value),G?Oe(e):N.onInput?.(e)},Ae=A?{...N.value!==void 0&&{value:ae(A,N.value)},...N.defaultValue!==void 0&&{defaultValue:ae(A,N.defaultValue)}}:null,J=le(M);J.current=M,o(()=>{let e=z.current;if(!(!A||!e))return re(e,{mask:A,postFormatted:j,onChange:(e,t)=>J.current?.(e,t),onInvalidChange:Se})},[A,j]);let Y=e=>A&&!j&&e?t=>{let n=t.target,r=new Proxy(n,{get:(e,t)=>{if(t===`value`)return se(A,e.value);let n=Reflect.get(e,t,e);return typeof n==`function`?n.bind(e):n}});e(Object.create(t,{target:{value:r}}))}:e,je=W?l(`button`,{type:`button`,className:`input-clear`,onClick:()=>{let e=z.current;if(!e)return;let t=Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype,`value`)?.set;t?t.call(e,``):e.value=``,e.dispatchEvent(new Event(`input`,{bubbles:!0})),V(!1),e.focus()},"aria-label":`Clear`,tabIndex:-1,hidden:!Ee,children:l(n,{name:`x`,size:16})}):null,X=I&&L?`${L}-error`:void 0,Me=f&&L?`${L}-hint`:void 0,Ne=X||Me,Pe=[`input`,h===`sm`?`input-sm`:``,h===`lg`?`input-lg`:``,I?`error`:``,R?`pw`:``,y?`num-input`:``,!(D&&a||w||T||y||R||_)&&S&&W?`has-clear`:``,O===`bare`?`input-bare`:``,_e].filter(Boolean).join(` `),Z=l(c.Control,{id:L,name:ge,type:we,className:Pe,disabled:x,required:d,"aria-invalid":I?`true`:`false`,"aria-describedby":Ne,maxLength:C,...N,onChange:Y(N.onChange),onBlur:Y(N.onBlur),...Ae,placeholder:D?` `:N.placeholder,ref:Te,onInput:G||K?ke:N.onInput}),Q=k===!0||k,Fe=Q&&typeof Q==`object`&&Q.title||`Password requirements`,Ie=K?ie(De,Q):null,Le=K?l(`ul`,{className:`pw-criteria`,"aria-live":`polite`,children:Ie.map(e=>u(`li`,{className:`pw-rule ${e.met?`met`:`unmet`}`,children:[l(`span`,{className:`pw-mark`,"aria-hidden":`true`}),l(`span`,{className:`pw-rule-text`,children:e.label}),l(`span`,{className:`visually-hidden`,children:e.met?`: met`:`: not met`})]},e.key))}):null,$;if(D&&a)$=u(`div`,{className:`field-float`,children:[Z,u(`label`,{className:`float-label`,htmlFor:L,children:[a,d&&l(i,{})]})]});else if(E)$=u(`div`,{className:`input-action-row`,children:[u(`div`,{className:g?`input-icon`:`input-wrap`,children:[g&&l(`span`,{className:`ic`,children:l(n,{name:g,size:16})}),Z]}),l(`div`,{className:`input-action`,children:E})]});else if(w||T)$=u(`div`,{className:`input-affixed`,children:[w!=null&&l(`span`,{className:`affix affix-pre`,children:w}),Z,T!=null&&l(`span`,{className:`affix affix-suf`,children:T})]});else if(y)$=u(`div`,{className:`input-with-unit`,children:[Z,l(`span`,{className:`unit`,children:y})]});else if(R){let e=u(`div`,{className:g?`input-icon`:`input-wrap`,children:[g&&l(`span`,{className:`ic`,children:l(n,{name:g,size:16})}),Z,u(`button`,{type:`button`,className:`pw-toggle${F?` pw-revealed`:``}`,onClick:()=>be(e=>!e),"aria-label":F?`Hide password`:`Show password`,tabIndex:-1,children:[l(n,{name:`eye`,size:18,className:`pw-eye`}),l(n,{name:`eye-off`,size:18,className:`pw-eye-off`})]})]});$=K?l(r,{trigger:e,triggerType:`focus`,placement:ye,title:Fe,className:`pw-popover`,children:Le}):e}else $=_?u(`div`,{className:`input-wrap`,children:[Z,l(`button`,{type:`button`,className:`pw-toggle`,onClick:v,disabled:!v,tabIndex:-1,"aria-label":me||_,children:l(n,{name:_,size:18})})]}):S?u(`div`,{className:g?`input-icon`:`input-wrap`,children:[g&&l(`span`,{className:`ic`,children:l(n,{name:g,size:16})}),Z,je]}):g?u(`div`,{className:`input-icon`,children:[l(`span`,{className:`ic`,children:l(n,{name:g,size:16})}),Z]}):Z;return u(c.Group,{className:`field${b?` ${b}`:``}`,children:[a&&!D&&u(c.Label,{className:`label`,htmlFor:L,children:[a,d&&l(i,{}),p&&l(ee,{label:pe,children:p})]}),$,I?l(`div`,{className:`field-error`,id:X,children:I}):f?l(`div`,{className:`field-hint`,id:Me,children:f}):null,ve&&u(`div`,{className:`field-count${C&&H>=C?` at-limit`:``}`,children:[H,C?` / ${C}`:``]})]})});export{d as default};
+import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import r from"./AppPopover.js";import ee from"./AppInfoTip.js";import i from"./AppRequiredMark.js";import{MASK_INPUT_TYPES as te,MASK_NAMES as ne,attachInputMask as re,evaluatePassword as ie,formatMasked as a,isMaskPattern as ae,postedMasked as oe}from"@webority/ui-elements/helpers";import{forwardRef as o,useEffect as s,useId as se,useRef as ce,useState as c}from"react";import{Form as l}from"react-bootstrap";import{jsx as u,jsxs as d}from"react/jsx-runtime";var le=[`sm`,`md`,`lg`],ue=[`bare`],f=o(function({label:o,required:f=!1,error:de,hint:p,help:m,helpLabel:fe=`More information`,type:h=`text`,size:g=`md`,leftIcon:_,rightIcon:v,onRightIconClick:y,rightIconLabel:pe,unit:b,id:me,name:he,className:ge=``,fieldClassName:_e=``,disabled:ve=!1,clearable:x=!1,showCount:S=!1,maxLength:C,prefix:w,suffix:T,action:ye,floatingLabel:E=!1,variant:D,passwordRequirements:O=!1,requirementsPlacement:k=`auto`,mask:A,postFormatted:j=!1,onMaskChange:M,...N},P){t(`AppInput`,N),e(`AppInput`,`size`,g,le),e(`AppInput`,`variant`,D,ue),A!=null&&!ae(A)&&e(`AppInput`,`mask`,A,ne),A!=null&&e(`AppInput`,`type`,h,te);let[F,be]=c(!1),[xe,Se]=c(``),I=de||xe,Ce=se(),L=me||Ce,R=h===`password`,we=R&&F?`text`:h,z=ce(null),Te=e=>{z.current=e,typeof P==`function`?P(e):P&&(P.current=e)},B=String(N.value??N.defaultValue??``),[Ee,V]=c(()=>!!B),[H,U]=c(()=>B.length),W=x&&!ve,G=x||S,K=R&&!!O,[De,q]=c(B);s(()=>{!K||N.value===void 0||q(String(N.value??``))},[N.value,K]),s(()=>{if(!G||N.value===void 0)return;let e=String(N.value??``);V(!!e),U(e.length)},[N.value,G]);let Oe=e=>{V(!!e.target.value),U(e.target.value.length),N.onInput?.(e)},ke=e=>{K&&q(e.target.value),G?Oe(e):N.onInput?.(e)},Ae=A?{...N.value!==void 0&&{value:a(A,N.value)},...N.defaultValue!==void 0&&{defaultValue:a(A,N.defaultValue)}}:null,J=ce(M);J.current=M,s(()=>{let e=z.current;if(!(!A||!e))return re(e,{mask:A,postFormatted:j,onChange:(e,t)=>J.current?.(e,t),onInvalidChange:Se})},[A,j]);let Y=e=>A&&!j&&e?t=>{let n=t.target,r=new Proxy(n,{get:(e,t)=>{if(t===`value`)return oe(A,e.value);let n=Reflect.get(e,t,e);return typeof n==`function`?n.bind(e):n}});e(Object.create(t,{target:{value:r}}))}:e,je=W?u(`button`,{type:`button`,className:`input-clear`,onClick:()=>{let e=z.current;if(!e)return;let t=Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype,`value`)?.set;t?t.call(e,``):e.value=``,e.dispatchEvent(new Event(`input`,{bubbles:!0})),V(!1),e.focus()},"aria-label":`Clear`,tabIndex:-1,hidden:!Ee,children:u(n,{name:`x`,size:16})}):null,Me=I&&L?`${L}-error`:void 0,Ne=p&&L?`${L}-hint`:void 0,X=K&&k===`inline`,Pe=X&&L?`${L}-requirements`:void 0,Fe=Me||(X?Pe:Ne),Ie=[`input`,g===`sm`?`input-sm`:``,g===`lg`?`input-lg`:``,I?`error`:``,R?`pw`:``,b?`num-input`:``,!(E&&o||w||T||b||R||v)&&x&&W?`has-clear`:``,D===`bare`?`input-bare`:``,ge].filter(Boolean).join(` `),Z=u(l.Control,{id:L,name:he,type:we,className:Ie,disabled:ve,required:f,"aria-invalid":I?`true`:`false`,"aria-describedby":Fe,maxLength:C,...N,onChange:Y(N.onChange),onBlur:Y(N.onBlur),...Ae,placeholder:E?` `:N.placeholder,ref:Te,onInput:G||K?ke:N.onInput}),Q=O===!0||O,Le=Q&&typeof Q==`object`&&Q.title||`Password requirements`,Re=K?ie(De,Q):null,ze=K?u(`ul`,{className:`pw-criteria`,"aria-live":`polite`,id:Pe,"aria-label":X?Le:void 0,children:Re.map(e=>d(`li`,{className:`pw-rule ${e.met?`met`:`unmet`}`,children:[u(`span`,{className:`pw-mark`,"aria-hidden":`true`}),u(`span`,{className:`pw-rule-text`,children:e.label}),u(`span`,{className:`visually-hidden`,children:e.met?`: met`:`: not met`})]},e.key))}):null,$;if(E&&o)$=d(`div`,{className:`field-float`,children:[Z,d(`label`,{className:`float-label`,htmlFor:L,children:[o,f&&u(i,{})]})]});else if(ye)$=d(`div`,{className:`input-action-row`,children:[d(`div`,{className:_?`input-icon`:`input-wrap`,children:[_&&u(`span`,{className:`ic`,children:u(n,{name:_,size:16})}),Z]}),u(`div`,{className:`input-action`,children:ye})]});else if(w||T)$=d(`div`,{className:`input-affixed`,children:[w!=null&&u(`span`,{className:`affix affix-pre`,children:w}),Z,T!=null&&u(`span`,{className:`affix affix-suf`,children:T})]});else if(b)$=d(`div`,{className:`input-with-unit`,children:[Z,u(`span`,{className:`unit`,children:b})]});else if(R){let e=d(`div`,{className:_?`input-icon`:`input-wrap`,children:[_&&u(`span`,{className:`ic`,children:u(n,{name:_,size:16})}),Z,d(`button`,{type:`button`,className:`pw-toggle${F?` pw-revealed`:``}`,onClick:()=>be(e=>!e),"aria-label":F?`Hide password`:`Show password`,tabIndex:-1,children:[u(n,{name:`eye`,size:18,className:`pw-eye`}),u(n,{name:`eye-off`,size:18,className:`pw-eye-off`})]})]});$=K&&!X?u(r,{trigger:e,triggerType:`focus`,placement:k,title:Le,className:`pw-popover`,children:ze}):e}else $=v?d(`div`,{className:`input-wrap`,children:[Z,u(`button`,{type:`button`,className:`pw-toggle`,onClick:y,disabled:!y,tabIndex:-1,"aria-label":pe||v,children:u(n,{name:v,size:18})})]}):x?d(`div`,{className:_?`input-icon`:`input-wrap`,children:[_&&u(`span`,{className:`ic`,children:u(n,{name:_,size:16})}),Z,je]}):_?d(`div`,{className:`input-icon`,children:[u(`span`,{className:`ic`,children:u(n,{name:_,size:16})}),Z]}):Z;return d(l.Group,{className:`field${_e?` ${_e}`:``}`,children:[o&&!E&&d(l.Label,{className:`label`,htmlFor:L,children:[o,f&&u(i,{}),m&&u(ee,{label:fe,children:m})]}),$,X&&u(`div`,{className:`wui-pw-inline`,children:ze}),I?u(`div`,{className:`field-error`,id:Me,children:I}):p&&!X?u(`div`,{className:`field-hint`,id:Ne,children:p}):null,S&&d(`div`,{className:`field-count${C&&H>=C?` at-limit`:``}`,children:[H,C?` / ${C}`:``]})]})});export{f as default};

package/dist/components/toast.js

@@ -1 +1 @@
-import{dismissAllToasts as e,pushToast as t}from"./toastStore.js";function n(){e()}var r=new Set([`success`,`info`,`warning`,`danger`]);function i(e,n=`info`){let i=`info`,a={};typeof n==`string`?i=r.has(n)?n:`info`:typeof n==`object`&&n&&(a=n,i=r.has(a.variant)?a.variant:`info`),t(e,i,a)}function a(e,n={}){t(e,`danger`,n)}i.promise=(e,t,n={})=>{let r=n.id||`promise-${Date.now()}-${Math.random()}`;return i(t.loading||`Loading...`,{...n,variant:`info`,id:r,duration:0}),e.then(e=>(i((typeof t.success==`function`?t.success(e):t.success)||`Done`,{...n,variant:`success`,id:r,duration:n.duration===void 0?5e3:n.duration}),e)).catch(e=>{throw i((typeof t.error==`function`?t.error(e):t.error)||`Error`,{...n,variant:`danger`,id:r,duration:n.duration===void 0?5e3:n.duration}),e})};export{n as dismissAll,a as errorToast,i as toast};
+import e from"./warnInvalidValue.js";import{dismissAllToasts as t,pushToast as n}from"./toastStore.js";function r(){t()}var i=new Set([`success`,`info`,`warning`,`danger`]);function a(t,r=`info`){let a=`info`,o={};typeof r==`string`?(e(`toast`,`variant`,r,i),a=i.has(r)?r:`info`):typeof r==`object`&&r&&(o=r,e(`toast`,`variant`,o.variant,i),a=i.has(o.variant)?o.variant:`info`),n(t,a,o)}function o(e,t={}){n(e,`danger`,t)}a.promise=(e,t,n={})=>{let r=n.id||`promise-${Date.now()}-${Math.random()}`;return a(t.loading||`Loading...`,{...n,variant:`info`,id:r,duration:0}),e.then(e=>(a((typeof t.success==`function`?t.success(e):t.success)||`Done`,{...n,variant:`success`,id:r,duration:n.duration===void 0?5e3:n.duration}),e)).catch(e=>{throw a((typeof t.error==`function`?t.error(e):t.error)||`Error`,{...n,variant:`danger`,id:r,duration:n.duration===void 0?5e3:n.duration}),e})};export{r as dismissAll,o as errorToast,a as toast};

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

@@ -36,6 +36,7 @@
  * @param {string} [props.viewKey] Remembers the view settings (zoom, two-page view, thumbnails)
  *   in this browser under this key. Without it they last for the viewer's life.
  * @param {boolean} [props.download=false] Shows a download button in the toolbar.
+ * @param {boolean} [props.print=true] Shows the print button for a PDF or an image. Pass false to hide it.
  * @param {string} [props.workerSrc] URL of a hosted pdf.js worker, for a site whose content
  *   security policy refuses blob: workers. Defaults to the bundled copy.
  * @param {string} [props.captions] A WebVTT captions file for a video; adds a captions button to the player.

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

@@ -50,8 +50,9 @@
  *   a live "Password requirements" checklist on focus that ticks each rule green as the user types
  *   (client-side, before any server validation). The rule set is the one shared with Razor via
  *   `@webority/ui-elements`, so both surfaces validate identically.
- * @param {"auto"|"top"|"bottom"|"start"|"end"} [props.requirementsPlacement="auto"] Which side the
- *   requirements popover opens; `auto` flips to stay in view.
+ * @param {"auto"|"top"|"bottom"|"start"|"end"|"inline"} [props.requirementsPlacement="auto"] Which side
+ *   the requirements popover opens; `auto` flips to stay in view. `inline` has no popover: the checklist
+ *   sits under the input, always visible, in place of the hint.
  * @param {string} [props.mask] Format the value while it is typed. A named mask
  *   (`phone-in`, `pan`, `gstin`, `aadhaar`, `ifsc`, `pin-code`, `date` as DD-MM-YYYY, `amount` with
  *   Indian grouping) or a pattern, where `9` is a digit, `A` a letter, `*` a digit or letter and any

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webority/ui-react",
-  "version": "0.50.0",
+  "version": "0.51.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/theme": "0.50.0",
-    "@webority/ui-elements": "0.50.0"
+    "@webority/theme": "0.51.0",
+    "@webority/ui-elements": "0.51.0"
   },
   "peerDependencies": {
     "@webority/analytics": "^0.20.0",