@1interface/widgets 0.4.0 → 0.4.1

package/dist/index.mjs

@@ -1 +1 @@
-import{A as a,m as e,B as s,n as t,o as r,p as i,C as o,q as d,t as n,v as u,w as l,x as m,D as g,y as C,z as T,F as c,E as p,G as S,I,H as x,J as A,L as F,K as R,N as W,O as E,R as N,P as O,Q as f,S as h,T as v,U as D,V as L,W as _,X as k,Y as B,Z as M,_ as U,$ as w,a0 as P,a1 as V,a2 as b,a3 as H,e as j,a4 as q,a5 as y,a6 as G,a7 as Y,a8 as z,a9 as J,e as K,e as Q,aa as X,ab as Z,f as $,ac as aa,a as ea,u as sa,ad as ta,ae as ra,af as ia,ag as oa,ah as da,ai as na}from"./index-CuqDLhq-.js";import"react/jsx-runtime";import"react";export{a as ACTION_TYPES,e as ActionHandlerContext,s as Badge,t as BasicRoot,r as Box,i as Button,o as CONSUMER_ACTIONS,d as Caption,n as Card,u as Chart,l as Checkbox,m as Col,g as DEFAULT_CONFIG,C as DatePicker,T as Divider,c as FileUploadRequest,p as Form,S as FormContext,I as Icon,x as Image,A as Input,F as Label,R as ListView,W as ListViewItem,E as Markdown,N as REDUCER_ACTIONS,O as RadioGroup,f as Row,h as SELF_CONTAINED_ACTIONS,v as Select,D as Spacer,L as Text,_ as Textarea,k as Title,B as Transition,M as Video,U as WidgetErrorBoundary,w as WidgetRenderer,P as WidgetStateManager,V as WidgetStateProvider,b as WidgetThemeProvider,H as configureMap,j as defaultActionHandler,q as formatOrderItems,y as markRequiredLabels,G as mergeConfig,Y as renderWidget,z as resolveTemplate,J as safeRenderWidget,K as useAction,Q as useActionHandler,X as useFileUploadState,Z as useFormContext,$ as useMessageId,aa as useSelectedCategory,ea as useTheme,sa as useTokens,ta as useVariants,ra as useWidgetDispatch,ia as useWidgetState,oa as useWidgetTheme,da as validateFields,na as validateForm};
+import{A as a,m as e,B as s,n as t,o as r,p as i,C as o,q as d,t as n,v as u,w as l,x as m,D as g,y as C,z as T,F as c,E as p,G as S,I,H as x,J as A,L as F,K as R,N as W,O as E,R as N,P as O,Q as f,S as h,T as v,U as D,V as L,W as _,X as k,Y as B,Z as M,_ as U,$ as w,a0 as P,a1 as V,a2 as b,a3 as H,e as j,a4 as q,a5 as y,a6 as G,a7 as Y,a8 as z,a9 as J,e as K,e as Q,aa as X,ab as Z,f as $,ac as aa,a as ea,u as sa,ad as ta,ae as ra,af as ia,ag as oa,ah as da,ai as na}from"./index-B8c0C8Dl.js";import"react/jsx-runtime";import"react";export{a as ACTION_TYPES,e as ActionHandlerContext,s as Badge,t as BasicRoot,r as Box,i as Button,o as CONSUMER_ACTIONS,d as Caption,n as Card,u as Chart,l as Checkbox,m as Col,g as DEFAULT_CONFIG,C as DatePicker,T as Divider,c as FileUploadRequest,p as Form,S as FormContext,I as Icon,x as Image,A as Input,F as Label,R as ListView,W as ListViewItem,E as Markdown,N as REDUCER_ACTIONS,O as RadioGroup,f as Row,h as SELF_CONTAINED_ACTIONS,v as Select,D as Spacer,L as Text,_ as Textarea,k as Title,B as Transition,M as Video,U as WidgetErrorBoundary,w as WidgetRenderer,P as WidgetStateManager,V as WidgetStateProvider,b as WidgetThemeProvider,H as configureMap,j as defaultActionHandler,q as formatOrderItems,y as markRequiredLabels,G as mergeConfig,Y as renderWidget,z as resolveTemplate,J as safeRenderWidget,K as useAction,Q as useActionHandler,X as useFileUploadState,Z as useFormContext,$ as useMessageId,aa as useSelectedCategory,ea as useTheme,sa as useTokens,ta as useVariants,ra as useWidgetDispatch,ia as useWidgetState,oa as useWidgetTheme,da as validateFields,na as validateForm};

package/native/components/Input.js

@@ -1 +1 @@
-import{jsx as o,jsxs as A}from"react/jsx-runtime";import{useEffect as D,useState as I}from"react";import{Platform as H,Pressable as R,TextInput as W,View as h,Text as b}from"react-native";import{PRIMITIVE_KINDS as N,resolveStyle as M,useTheme as v}from"../theme";import{controlRadius as C}from"../theme/style";import{useActionHandler as w,useMessageId as z,useWidgetDispatch as V,useWidgetState as E}from"../state";import{REDUCER_ACTIONS as F}from"../state";import{useRegisterRequired as $,useFieldError as B}from"./Form";function K(e){switch(e){case"email":return"email-address";case"number":case"currency":case"card_number":case"cvc":return"number-pad";case"tel":return"phone-pad";case"url":return"url";default:return"default"}}function L(e){switch(e){case"email":return"email";case"password":return"password";case"tel":return"tel";case"card_number":return"cc-number";case"cvc":return"cc-csc";case"month_year":return"cc-exp";default:return}}function q(e){return e.replace(/\D/g,"").slice(0,19).replace(/(.{4})/g,"$1 ").trim()}function G(e){const t=e.replace(/\D/g,"").slice(0,4);return t.length<3?t:`${t.slice(0,2)}/${t.slice(2)}`}function U(e){return e.replace(/\D/g,"").slice(0,4)}function X(e){const t=e.replace(/[^\d.]/g,""),a=t.indexOf("."),c=(a===-1?t:t.slice(0,a)).replace(/\B(?=(\d{3})+(?!\d))/g,",");if(a===-1)return c;const u=t.slice(a+1).replace(/\./g,"").slice(0,2);return`${c}.${u}`}function oe(e){const{tokens:t,variants:a}=v(),c=w(),u=V(),g=z(),d=E(),s=t.control.size[e.size],r=a.input[e.variant],T=e.gutterSize?t.control.size[e.gutterSize].padH:s.padH;$(e.name,e.required,e.inputType??"text",e.pattern);const f=B(e.name);if(e.inputType==="counter")return o(j,{...e});const p=d.formFields[e.name],[i,x]=I(p??e.defaultValue??""),[n,m]=I(!1),S=!!f;D(()=>{i!==(d.formFields[e.name]??"")&&u({type:F.SET_FORM_FIELD,payload:{name:e.name,value:i}})},[i]);const _={...t.layout.input.wrap,borderRadius:C(e.size,t,e.pill),backgroundColor:r.bg,borderColor:r.border,borderWidth:r.borderWidth},k=M(_,N.BOX,{controlHeightPx:s.h,hasBackground:r.bg!==void 0});function O(l){let y=l;switch(e.inputType){case"card_number":y=q(l);break;case"month_year":y=G(l);break;case"cvc":y=U(l);break;case"currency":y=X(l);break}x(y),e.onChangeAction&&c({...e.onChangeAction,payload:{...e.onChangeAction.payload??{},[e.name]:y,...g?{messageId:g}:{}}})}function P(){if(e.pattern)try{const l=new RegExp(e.pattern);m(!l.test(i))}catch{}}return A(h,{children:[o(h,{style:[k,S?{borderColor:t.color.danger.solid}:null],children:o(W,{value:i,onChangeText:O,onBlur:P,placeholder:e.placeholder,placeholderTextColor:t.color.placeholder,editable:!e.disabled,autoFocus:e.autoFocus,selectTextOnFocus:!!e.autoSelect,secureTextEntry:e.inputType==="password",keyboardType:K(e.inputType),autoComplete:e.allowAutofillExtensions===!1?"off":L(e.inputType),style:[t.layout.input.field,{fontSize:s.font,color:r.fg,caretColor:r.fg,fontFamily:t.font.family,outlineStyle:"none",paddingHorizontal:T,...H.OS==="web"?{height:"100%"}:{flex:1,paddingVertical:Math.max(6,(s.h-s.font-4)/2)},borderRadius:C(e.size,t,e.pill)},n?{color:t.color.danger.solid}:null]})}),S?o(b,{style:{color:t.color.danger.solid,fontSize:12,marginTop:4,fontFamily:t.font.family},children:f}):null]})}function j(e){const{tokens:t}=v(),a=w(),c=V(),u=z(),g=E(),d=t.control.size[e.size],s=g.formFields[e.name]??e.defaultValue??"0",[r,T]=I(()=>parseInt(s,10)||0);function f(n){if(e.disabled)return;const m=Math.max(0,r+n);T(m),c({type:F.SET_FORM_FIELD,payload:{name:e.name,value:String(m)}}),e.onChangeAction&&a({...e.onChangeAction,payload:{...e.onChangeAction.payload??{},name:e.name,delta:n,value:m,...u?{messageId:u}:{}}})}const p=n=>({...t.layout.counter.btn,width:t.counter.btn,height:t.counter.btn,borderRadius:t.counter.btnRadius,opacity:n?t.ui.pressedOpacity:1}),i={color:t.color.text,fontSize:t.counter.glyph.fontSize,fontWeight:t.counter.glyph.weight,lineHeight:t.counter.glyph.lineHeight},x={height:d.h,minWidth:t.counter.valueMinWidth,paddingHorizontal:t.space[12],borderRadius:C(e.size,t,e.pill),borderColor:t.color.borderInput,borderWidth:t.ui.hairlineBorder,alignItems:"center",justifyContent:"center"};return A(h,{style:[t.layout.counter.row,{gap:t.counter.rowGap,height:d.h}],children:[o(R,{accessibilityLabel:`Decrease ${e.name}`,onPress:()=>f(-1),disabled:e.disabled,style:({pressed:n})=>p(n),children:o(b,{style:i,children:"\u2212"})}),o(h,{style:x,children:o(b,{style:[t.layout.counter.valueText,{color:t.color.text,fontSize:d.font,fontWeight:t.font.weight.normal}],children:r})}),o(R,{accessibilityLabel:`Increase ${e.name}`,onPress:()=>f(1),disabled:e.disabled,style:({pressed:n})=>p(n),children:o(b,{style:i,children:"+"})})]})}export{oe as Input};
+import{jsx as o,jsxs as _}from"react/jsx-runtime";import{useEffect as U,useRef as A,useState as S}from"react";import{Platform as X,Pressable as k,TextInput as j,View as v,Text as T}from"react-native";import{PRIMITIVE_KINDS as J,resolveStyle as Q,useTheme as D}from"../theme";import{controlRadius as R}from"../theme/style";import{useActionHandler as N,useMessageId as P,useWidgetDispatch as H,useWidgetState as M}from"../state";import{REDUCER_ACTIONS as O}from"../state";import{useRegisterRequired as Y,useFieldError as Z}from"./Form";import{applyMask as ee,isMaskedInputType as W}from"../lib/utils";function te(e){switch(e){case"email":return"email-address";case"number":case"currency":case"card_number":case"cvc":return"number-pad";case"tel":return"phone-pad";case"url":return"url";default:return"default"}}function ne(e){switch(e){case"email":return"email";case"password":return"password";case"tel":return"tel";case"card_number":return"cc-number";case"cvc":return"cc-csc";case"month_year":return"cc-exp";default:return}}function ye(e){const{tokens:t,variants:x}=D(),C=N(),h=H(),m=P(),s=M(),l=t.control.size[e.size],r=x.input[e.variant],I=e.gutterSize?t.control.size[e.gutterSize].padH:l.padH;Y(e.name,e.required,e.inputType??"text",e.pattern);const d=Z(e.name);if(e.inputType==="counter")return o(oe,{...e});const g=s.formFields[e.name],[a,w]=S(g??e.defaultValue??""),[n,y]=S(!1),E=!!d,f=W(e.inputType),[z,V]=S(void 0),F=A(null),p=A(null);U(()=>{a!==(s.formFields[e.name]??"")&&h({type:O.SET_FORM_FIELD,payload:{name:e.name,value:a}})},[a]);const B={...t.layout.input.wrap,borderRadius:R(e.size,t,e.pill),backgroundColor:r.bg,borderColor:r.border,borderWidth:r.borderWidth},K=Q(B,J.BOX,{controlHeightPx:l.h,hasBackground:r.bg!==void 0});function L(i){if(!f)return;const u=i.nativeEvent.target;if(typeof u?.selectionStart=="number"){p.current=u.selectionStart;return}const b=F.current;if(b){const c=i.nativeEvent.text??"";p.current=b.end+(c.length-a.length)}else p.current=null}function q(i){F.current=i.nativeEvent.selection,z&&V(void 0)}function $(i){let u=i;if(f&&W(e.inputType)){const b=p.current;p.current=null;const c=ee(e.inputType,i,b);u=c.value,c.caret!==null&&V({start:c.caret,end:c.caret})}w(u),e.onChangeAction&&C({...e.onChangeAction,payload:{...e.onChangeAction.payload??{},[e.name]:u,...m?{messageId:m}:{}}})}function G(){if(e.pattern)try{const i=new RegExp(e.pattern);y(!i.test(a))}catch{}}return _(v,{children:[o(v,{style:[K,E?{borderColor:t.color.danger.solid}:null],children:o(j,{value:a,onChange:f?L:void 0,onChangeText:$,onSelectionChange:f?q:void 0,selection:f?z:void 0,onBlur:G,placeholder:e.placeholder,placeholderTextColor:t.color.placeholder,editable:!e.disabled,autoFocus:e.autoFocus,selectTextOnFocus:!!e.autoSelect,secureTextEntry:e.inputType==="password",keyboardType:te(e.inputType),autoComplete:e.allowAutofillExtensions===!1?"off":ne(e.inputType),style:[t.layout.input.field,{fontSize:l.font,color:r.fg,caretColor:r.fg,fontFamily:t.font.family,outlineStyle:"none",paddingHorizontal:I,...X.OS==="web"?{height:"100%"}:{flex:1,paddingVertical:Math.max(6,(l.h-l.font-4)/2)},borderRadius:R(e.size,t,e.pill)},n?{color:t.color.danger.solid}:null]})}),E?o(T,{style:{color:t.color.danger.solid,fontSize:12,marginTop:4,fontFamily:t.font.family},children:d}):null]})}function oe(e){const{tokens:t}=D(),x=N(),C=H(),h=P(),m=M(),s=t.control.size[e.size],l=m.formFields[e.name]??e.defaultValue??"0",[r,I]=S(()=>parseInt(l,10)||0);function d(n){if(e.disabled)return;const y=Math.max(0,r+n);I(y),C({type:O.SET_FORM_FIELD,payload:{name:e.name,value:String(y)}}),e.onChangeAction&&x({...e.onChangeAction,payload:{...e.onChangeAction.payload??{},name:e.name,delta:n,value:y,...h?{messageId:h}:{}}})}const g=n=>({...t.layout.counter.btn,width:t.counter.btn,height:t.counter.btn,borderRadius:t.counter.btnRadius,opacity:n?t.ui.pressedOpacity:1}),a={color:t.color.text,fontSize:t.counter.glyph.fontSize,fontWeight:t.counter.glyph.weight,lineHeight:t.counter.glyph.lineHeight},w={height:s.h,minWidth:t.counter.valueMinWidth,paddingHorizontal:t.space[12],borderRadius:R(e.size,t,e.pill),borderColor:t.color.borderInput,borderWidth:t.ui.hairlineBorder,alignItems:"center",justifyContent:"center"};return _(v,{style:[t.layout.counter.row,{gap:t.counter.rowGap,height:s.h}],children:[o(k,{accessibilityLabel:`Decrease ${e.name}`,onPress:()=>d(-1),disabled:e.disabled,style:({pressed:n})=>g(n),children:o(T,{style:a,children:"\u2212"})}),o(v,{style:w,children:o(T,{style:[t.layout.counter.valueText,{color:t.color.text,fontSize:s.font,fontWeight:t.font.weight.normal}],children:r})}),o(k,{accessibilityLabel:`Increase ${e.name}`,onPress:()=>d(1),disabled:e.disabled,style:({pressed:n})=>g(n),children:o(T,{style:a,children:"+"})})]})}export{ye as Input};

package/native/lib/utils.js

@@ -1 +1 @@
-import{clsx as a}from"clsx";import{twMerge as c}from"tailwind-merge";function p(...r){return c(a(r))}const g=(r,e)=>{if(!r)return"";const t=r.split(" ");return t.length>e?t.slice(0,e).join(" "):r},m=()=>"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,r=>{const e=Math.random()*16|0;return(r==="x"?e:e&3|8).toString(16)}),h=(r,e=new Date)=>{if(!r)return"";const t=new Date(r);if(isNaN(t.getTime()))return"";const n=e.getTime()-t.getTime(),s=Math.floor(n/(1e3*60)),o=Math.floor(n/(1e3*60*60)),i=Math.floor(n/(1e3*60*60*24));return s<1?"Just now":s<60?`${s}m ago`:o<24?`${o}h ago`:i<7?`${i}d ago`:new Intl.DateTimeFormat("en-GB",{day:"2-digit",month:"short",year:"numeric",hour:"2-digit",minute:"2-digit",hour12:!1}).format(t)},d=r=>r?r.split(" ").map(e=>e.charAt(0).toUpperCase()+e.slice(1)).join(" "):"",y=r=>r?r.replace(/([a-z0-9])([A-Z])/g,"$1 $2").replace(/^(.)/,e=>e.toUpperCase()).split(" ").map(e=>e.charAt(0).toUpperCase()+e.slice(1).toLowerCase()).join(" ").trim():"",C=r=>r?r.toLowerCase().replace(/[^a-z0-9\s]/g,"").replace(/\s+/g,"").trim():"",D=r=>r.replace(/\D/g,"").slice(0,16).replace(/(.{4})/g,"$1 ").trim(),u=r=>{const e=r.match(/^(\d{2})\/(\d{2})$/);if(!e)return!1;const t=Number(e[1]),n=Number(e[2]);if(t<1||t>12)return!1;const s=new Date,o=s.getFullYear()%100,i=s.getMonth()+1;return!(n<o||n===o&&t<i||t>12)},l=r=>{if(!r)return"";if(!u(r)){const e=r.match(/^(\d{2})\/(\d{2})$/);if(e){const t=Number(e[1]),n=Number(e[2]),s=new Date,o=s.getFullYear()%100,i=s.getMonth()+1;if(n<o||n===o&&t<i||t>12)return""}}return r},T=r=>{const e=r.replace(/\D/g,"").slice(0,4);if(e.length===4){const t=e.slice(0,2)+"/"+e.slice(2);return l(t)}else{if(e.length>=3)return`${e.slice(0,2)}/${e.slice(2)}`;if(e.length>=1)return e}return""},M=r=>r.replace(/\D/g,"").slice(0,4);function $(r){return Array.isArray(r)&&Array.isArray(r[0])?r.flat():r}export{d as capitalizeFirst,p as cn,M as formatCVC,y as formatCamelCaseToTitle,D as formatCardNumber,T as formatExpiryDate,h as formatTimestamp,m as generateUniqueId,$ as getArrayOfObjects,C as removeSpecialCharsAndSpaces,l as sanitizeExpiryDate,g as truncateWordLimit,u as validateExpiryDate};
+import{clsx as u}from"clsx";import{twMerge as l}from"tailwind-merge";function C(...e){return l(u(e))}const D=(e,t)=>{if(!e)return"";const r=e.split(" ");return r.length>t?r.slice(0,t).join(" "):e},$=()=>"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,e=>{const t=Math.random()*16|0;return(e==="x"?t:t&3|8).toString(16)}),k=(e,t=new Date)=>{if(!e)return"";const r=new Date(e);if(isNaN(r.getTime()))return"";const s=t.getTime()-r.getTime(),n=Math.floor(s/(1e3*60)),i=Math.floor(s/(1e3*60*60)),o=Math.floor(s/(1e3*60*60*24));return n<1?"Just now":n<60?`${n}m ago`:i<24?`${i}h ago`:o<7?`${o}d ago`:new Intl.DateTimeFormat("en-GB",{day:"2-digit",month:"short",year:"numeric",hour:"2-digit",minute:"2-digit",hour12:!1}).format(r)},A=e=>e?e.split(" ").map(t=>t.charAt(0).toUpperCase()+t.slice(1)).join(" "):"",I=e=>e?e.replace(/([a-z0-9])([A-Z])/g,"$1 $2").replace(/^(.)/,t=>t.toUpperCase()).split(" ").map(t=>t.charAt(0).toUpperCase()+t.slice(1).toLowerCase()).join(" ").trim():"",S=e=>e?e.toLowerCase().replace(/[^a-z0-9\s]/g,"").replace(/\s+/g,"").trim():"",f=new Set(["card_number","month_year","cvc","currency"]);function E(e){return e!==void 0&&f.has(e)}function p(e){return e.replace(/\D/g,"").slice(0,19).replace(/(.{4})/g,"$1 ").trim()}function g(e){const t=e.replace(/\D/g,"").slice(0,4);return t.length<3?t:`${t.slice(0,2)}/${t.slice(2)}`}function x(e){return e.replace(/\D/g,"").slice(0,4)}function m(e){const t=e.replace(/[^\d.]/g,""),r=t.indexOf("."),s=(r===-1?t:t.slice(0,r)).replace(/\B(?=(\d{3})+(?!\d))/g,",");if(r===-1)return s;const n=t.slice(r+1).replace(/\./g,"").slice(0,2);return`${s}.${n}`}function d(e,t){switch(e){case"card_number":return p(t);case"month_year":return g(t);case"cvc":return x(t);case"currency":return m(t)}}function h(e){return e==="currency"?/[\d.]/:/\d/}function y(e,t,r){if(t<=0)return 0;let s=0;for(let n=0;n<e.length;n++)if(r.test(e[n])&&++s===t)return n+1;return e.length}function N(e,t,r){const s=d(e,t);if(r===null)return{value:s,caret:null};const n=h(e),i=Math.max(0,Math.min(r,t.length));let o=0;for(let a=0;a<i;a++)n.test(t[a])&&o++;let c=y(s,o,n);if(o>0&&i>0&&!n.test(t[i-1]))for(;c<s.length&&!n.test(s[c]);)c++;return{value:s,caret:c}}const M=e=>{const t=e.match(/^(\d{2})\/(\d{2})$/);if(!t)return!1;const r=Number(t[1]),s=Number(t[2]);if(r<1||r>12)return!1;const n=new Date,i=n.getFullYear()%100,o=n.getMonth()+1;return!(s<i||s===i&&r<o||r>12)},_=e=>{if(!e)return"";if(!M(e)){const t=e.match(/^(\d{2})\/(\d{2})$/);if(t){const r=Number(t[1]),s=Number(t[2]),n=new Date,i=n.getFullYear()%100,o=n.getMonth()+1;if(s<i||s===i&&r<o||r>12)return""}}return e};function v(e){return Array.isArray(e)&&Array.isArray(e[0])?e.flat():e}export{N as applyMask,A as capitalizeFirst,C as cn,x as formatCVC,I as formatCamelCaseToTitle,p as formatCardNumber,m as formatCurrency,g as formatExpiry,d as formatMasked,k as formatTimestamp,$ as generateUniqueId,v as getArrayOfObjects,E as isMaskedInputType,S as removeSpecialCharsAndSpaces,_ as sanitizeExpiryDate,D as truncateWordLimit,M as validateExpiryDate};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@1interface/widgets",
-  "version": "0.4.0",
+  "version": "0.4.1",
   "type": "module",
   "license": "UNLICENSED",
   "private": false,