@orangesix/react 1.1.1 → 1.3.1

package/api/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react");exports.InputLabel=({iconPrefix:a="bi bi-",...r})=>r.label&&e.createElement("p",{className:"form-label"},r.icon&&e.createElement("i",{className:a+r.icon+" me-1"}),r.label,r.required&&e.createElement("span",{className:"text-danger"},"*"));
+"use strict";var e=require("react");exports.InputFeedback=({errors:a,name:r,...l})=>l.mode&&"Controlled"!==l.mode?e.createElement("div",{className:a[r??""]?"invalid-feedback is-invalid":"","data-name":r??"",id:"j_feedback",style:{display:a[r??""]?"block":"none"}},a[r??""]?a[r??""].message:""):e.createElement("div",{"data-name":r,id:"j_feedback"}),exports.InputLabel=({iconPrefix:a="bi bi-",...r})=>r.label&&e.createElement("p",{className:"form-label"},r.icon&&e.createElement("i",{className:a+r.icon+" me-1"}),r.label,r.required&&e.createElement("span",{className:"text-danger"},"*")),exports.InputProps=function(e){return{ref:e.ref,id:e.id,name:e.name,required:e.required,disabled:e.disabled,placeholder:e.placeholder,className:e.className,style:{width:"100%"},keyfilter:e.keyfilter}};
 //# sourceMappingURL=index.cjs.js.map

package/api/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../src/api/input.tsx"],"sourcesContent":["import React from \"react\";\r\nimport { ApiFieldComponentProps } from \"./types\";\r\n\r\n/**\r\n * API - `InputLabel`\r\n *\r\n * Um componente utilizado como label em todos os componente de campo do pacote.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const InputLabel = ({ iconPrefix = \"bi bi-\", ...props }: ApiFieldComponentProps) => {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return props.label\r\n        && <p className='form-label'>\r\n            {props.icon && <i className={iconPrefix + props.icon + \" me-1\"}/>}\r\n            {props.label}\r\n            {props.required && <span className=\"text-danger\">*</span>}\r\n        </p>;\r\n};"],"names":["iconPrefix","props","label","React","createElement","className","icon","required"],"mappings":"uDAS0B,EAAGA,aAAa,YAAaC,KAM5CA,EAAMC,OACNC,EAAGC,cAAA,IAAA,CAAAC,UAAU,cACXJ,EAAMK,MAAQH,EAAAC,cAAA,IAAA,CAAGC,UAAWL,EAAaC,EAAMK,KAAO,UACtDL,EAAMC,MACND,EAAMM,UAAYJ,EAAAC,cAAA,OAAA,CAAMC,UAAU,eAAsB"}
+{"version":3,"file":"index.cjs.js","sources":["../../src/api/input.tsx"],"sourcesContent":["import React from \"react\";\r\nimport { ApiComponentProps, ApiFieldComponentProps } from \"./types\";\r\n\r\n/**\r\n * API - `InputLabel`\r\n *\r\n * Um componente utilizado como label em todos os componente de entrada de dados do pacote.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const InputLabel = ({ iconPrefix = \"bi bi-\", ...props }: ApiFieldComponentProps) => {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return props.label\r\n        && <p className='form-label'>\r\n            {props.icon && <i className={iconPrefix + props.icon + \" me-1\"}/>}\r\n            {props.label}\r\n            {props.required && <span className=\"text-danger\">*</span>}\r\n        </p>;\r\n};\r\n\r\n/**\r\n * API - `InputFeedback`\r\n *\r\n * Um componente utilizado como container de feedback em todos os componente de entrada de dados do pacote.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const InputFeedback = ({ errors, name, ...props }: ApiFieldComponentProps & { errors?: any }) => {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return !props.mode || props.mode === \"Controlled\"\r\n        ? <div data-name={name}\r\n               id=\"j_feedback\"/>\r\n        : <div className={(!errors[name ?? \"\"] ? \"\" : \"invalid-feedback is-invalid\")}\r\n               data-name={name ?? \"\"}\r\n               id=\"j_feedback\"\r\n               style={{ display: errors[name ?? \"\"] ? \"block\" : \"none\" }}>{!errors[name ?? \"\"] ? \"\" : errors[name ?? \"\"].message}</div>;\r\n};\r\n\r\n/**\r\n * API - `InputProps`\r\n *\r\n * Retorna o objeto com as `Props` do core dos componentes de entrada de dados\r\n */\r\nexport function InputProps<T extends ApiComponentProps & ApiFieldComponentProps & { ref: any }>(props: T) {\r\n    return {\r\n        ref: props.ref,\r\n\r\n        id: props.id,\r\n        name: props.name,\r\n        required: props.required,\r\n        disabled: props.disabled,\r\n        placeholder: props.placeholder,\r\n\r\n        className: props.className,\r\n        style: { width: \"100%\" },\r\n\r\n        keyfilter: props.keyfilter,\r\n    };\r\n}"],"names":["errors","name","props","mode","React","createElement","className","id","style","display","message","iconPrefix","label","icon","required","ref","disabled","placeholder","width","keyfilter"],"mappings":"0DA6B6B,EAAGA,SAAQC,UAASC,KAMrCA,EAAMC,MAAuB,eAAfD,EAAMC,KAGtBC,EAAAC,cAAA,MAAA,CAAKC,UAAaN,EAAOC,GAAQ,IAAW,8BAAL,GAAmC,YAC1DA,GAAQ,GACnBM,GAAG,aACHC,MAAO,CAAEC,QAAST,EAAOC,GAAQ,IAAM,QAAU,SAAYD,EAAOC,GAAQ,IAAWD,EAAOC,GAAQ,IAAIS,QAAxB,IALvFN,EAAgBC,cAAA,MAAA,CAAA,YAAAJ,EACXM,GAAG,kCA5BQ,EAAGI,aAAa,YAAaT,KAM5CA,EAAMU,OACNR,EAAGC,cAAA,IAAA,CAAAC,UAAU,cACXJ,EAAMW,MAAQT,EAAAC,cAAA,IAAA,CAAGC,UAAWK,EAAaT,EAAMW,KAAO,UACtDX,EAAMU,MACNV,EAAMY,UAAYV,EAAAC,cAAA,OAAA,CAAMC,UAAU,eAAsB,yBA8B/D,SAA0FJ,GAC5F,MAAO,CACHa,IAAKb,EAAMa,IAEXR,GAAIL,EAAMK,GACVN,KAAMC,EAAMD,KACZa,SAAUZ,EAAMY,SAChBE,SAAUd,EAAMc,SAChBC,YAAaf,EAAMe,YAEnBX,UAAWJ,EAAMI,UACjBE,MAAO,CAAEU,MAAO,QAEhBC,UAAWjB,EAAMiB,UAEzB"}

package/api/index.d.ts

@@ -1,4 +1,7 @@
 import React, { CSSProperties } from 'react';
+import { Control } from 'react-hook-form';
+import * as primereact_keyfilter from 'primereact/keyfilter';
+import { KeyFilterType } from 'primereact/keyfilter';
 
 /**
  * Realiza o mapeamento dos valores da propriedades css `align-items`
@@ -103,7 +106,12 @@ interface ApiComponentProps {
 }
 
 /**
- * Define as tipagens ´default´ de tidos os componente de entrada de dados do pacote
+ * Define o modo do componente de entrada de dados
+ */
+type ApiFieldModeProps = "Controlled" | "HookForm";
+
+/**
+ * Define os tipos `default` para componente de entrada de dados
  */
 interface ApiFieldComponentProps {
 
@@ -146,19 +154,152 @@ interface ApiFieldComponentProps {
      * Desabilita a entrada de dados no campo
      */
     disabled?: boolean
+
+    /**
+     * Define o modo do componente de entrada de dados
+     */
+    mode?: ApiFieldModeProps
+
+    /**
+     * Define a opção de filtro de dados do componente
+     */
+    keyfilter?: KeyFilterType;
+
+    /**
+     * Determina se campo é apenas de leitura
+     */
+    readonly?: boolean
+}
+
+/**
+ * Define os tipos `default` para componente de entrada de dados controlled
+ * quando a propriedade `Readonly` estiver habilitada
+ */
+interface ApiFieldReadonlyControlledProps {
+    /**
+     * Define o valor do componente controlado
+     */
+    value: any
+
+    /**
+     * Determina se campo é apenas de leitura
+     */
+    readonly: true
+
+    /**
+     * Função para alterar o valor do componente controlado
+     */
+    onChange?: (value: any) => void
+
+    /**
+     * Função quando um usuário sai de um componente controlado
+     */
+    onBlur?: (value: any) => void
+}
+
+/**
+ Define os tipos `default` para componente de entrada de dados controlled
+ quando a propriedade `Readonly` estiver desabilitada
+ */
+interface ApiFieldWritableControlledProps {
+    /**
+     * Define o valor do componente controlado
+     */
+    value: any
+
+    /**
+     * Determina se campo é apenas de leitura
+     */
+    readonly?: false
+
+    /**
+     * Função para alterar o valor do componente controlado
+     */
+    onChange(value: any): void
+
+    /**
+     * Função quando um usuário sai de um componente controlado
+     */
+    onBlur?: (value: any) => void
+}
+
+/**
+ * Define os tipos `default` para componente de entrada de dados controlled
+ */
+type ApiFieldControlledProps =
+    | ApiFieldReadonlyControlledProps
+    | ApiFieldWritableControlledProps;
+
+/**
+ * Define os tipos `default` para componente de entrada de dados HookFomr
+ */
+interface ApiFieldHookFormProps {
+
+    /**
+     * Define o nome do campo
+     */
+    name: string
+
+    /**
+     * Objeto de controle do HookForm
+     */
+    control: Control<any>
+
+    /**
+     * Função executada quando o valor é modificado
+     */
+    onChange?: (value: any) => void
+
+    /**
+     * Função executada quando um usuário sai de um componente
+     */
+    onBlur?: (value: any) => void
 }
 
 /**
  * API - `InputLabel`
  *
- * Um componente utilizado como label em todos os componente de campo do pacote.
+ * Um componente utilizado como label em todos os componente de entrada de dados do pacote.
  * Permite personalizar o estilo e o conteúdo através de propriedades.
  */
 declare const InputLabel: ({ iconPrefix, ...props }: ApiFieldComponentProps) => "" | React.JSX.Element | undefined;
+/**
+ * API - `InputFeedback`
+ *
+ * Um componente utilizado como container de feedback em todos os componente de entrada de dados do pacote.
+ * Permite personalizar o estilo e o conteúdo através de propriedades.
+ */
+declare const InputFeedback: ({ errors, name, ...props }: ApiFieldComponentProps & {
+    errors?: any;
+}) => React.JSX.Element;
+/**
+ * API - `InputProps`
+ *
+ * Retorna o objeto com as `Props` do core dos componentes de entrada de dados
+ */
+declare function InputProps<T extends ApiComponentProps & ApiFieldComponentProps & {
+    ref: any;
+}>(props: T): {
+    ref: any;
+    id: string | undefined;
+    name: string | undefined;
+    required: boolean | undefined;
+    disabled: boolean | undefined;
+    placeholder: string | undefined;
+    className: string | undefined;
+    style: {
+        width: string;
+    };
+    keyfilter: primereact_keyfilter.KeyFilterType | undefined;
+};
 
 type IAlignItemsProps = AlignItemsProps;
 type IAPIComponentProps = ApiComponentProps;
 type IJustifyContentProps = JustifyContentProps;
+type TApiFieldModeProps = ApiFieldModeProps;
+type TApiFieldHookFormProps = ApiFieldHookFormProps;
 type IApiFieldComponentProps = ApiFieldComponentProps;
+type IApiFieldControlledProps = ApiFieldControlledProps;
 
-export { type IAPIComponentProps, type IAlignItemsProps, type IApiFieldComponentProps, type IJustifyContentProps, InputLabel };
+export { InputFeedback, InputLabel, InputProps };
+export type { IAPIComponentProps, IAlignItemsProps, IApiFieldComponentProps, IApiFieldControlledProps, IJustifyContentProps, TApiFieldHookFormProps, TApiFieldModeProps };

package/api/index.esm.js

@@ -1,2 +1,2 @@
-import e from"react";const a=({iconPrefix:a="bi bi-",...l})=>l.label&&e.createElement("p",{className:"form-label"},l.icon&&e.createElement("i",{className:a+l.icon+" me-1"}),l.label,l.required&&e.createElement("span",{className:"text-danger"},"*"));export{a as InputLabel};
+import e from"react";const a=({iconPrefix:a="bi bi-",...l})=>l.label&&e.createElement("p",{className:"form-label"},l.icon&&e.createElement("i",{className:a+l.icon+" me-1"}),l.label,l.required&&e.createElement("span",{className:"text-danger"},"*")),l=({errors:a,name:l,...r})=>r.mode&&"Controlled"!==r.mode?e.createElement("div",{className:a[l??""]?"invalid-feedback is-invalid":"","data-name":l??"",id:"j_feedback",style:{display:a[l??""]?"block":"none"}},a[l??""]?a[l??""].message:""):e.createElement("div",{"data-name":l,id:"j_feedback"});function r(e){return{ref:e.ref,id:e.id,name:e.name,required:e.required,disabled:e.disabled,placeholder:e.placeholder,className:e.className,style:{width:"100%"},keyfilter:e.keyfilter}}export{l as InputFeedback,a as InputLabel,r as InputProps};
 //# sourceMappingURL=index.esm.js.map

package/api/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../src/api/input.tsx"],"sourcesContent":["import React from \"react\";\r\nimport { ApiFieldComponentProps } from \"./types\";\r\n\r\n/**\r\n * API - `InputLabel`\r\n *\r\n * Um componente utilizado como label em todos os componente de campo do pacote.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const InputLabel = ({ iconPrefix = \"bi bi-\", ...props }: ApiFieldComponentProps) => {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return props.label\r\n        && <p className='form-label'>\r\n            {props.icon && <i className={iconPrefix + props.icon + \" me-1\"}/>}\r\n            {props.label}\r\n            {props.required && <span className=\"text-danger\">*</span>}\r\n        </p>;\r\n};"],"names":["InputLabel","iconPrefix","props","label","React","createElement","className","icon","required"],"mappings":"qBASO,MAAMA,EAAa,EAAGC,aAAa,YAAaC,KAM5CA,EAAMC,OACNC,EAAGC,cAAA,IAAA,CAAAC,UAAU,cACXJ,EAAMK,MAAQH,EAAAC,cAAA,IAAA,CAAGC,UAAWL,EAAaC,EAAMK,KAAO,UACtDL,EAAMC,MACND,EAAMM,UAAYJ,EAAAC,cAAA,OAAA,CAAMC,UAAU,eAAsB"}
+{"version":3,"file":"index.esm.js","sources":["../../src/api/input.tsx"],"sourcesContent":["import React from \"react\";\r\nimport { ApiComponentProps, ApiFieldComponentProps } from \"./types\";\r\n\r\n/**\r\n * API - `InputLabel`\r\n *\r\n * Um componente utilizado como label em todos os componente de entrada de dados do pacote.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const InputLabel = ({ iconPrefix = \"bi bi-\", ...props }: ApiFieldComponentProps) => {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return props.label\r\n        && <p className='form-label'>\r\n            {props.icon && <i className={iconPrefix + props.icon + \" me-1\"}/>}\r\n            {props.label}\r\n            {props.required && <span className=\"text-danger\">*</span>}\r\n        </p>;\r\n};\r\n\r\n/**\r\n * API - `InputFeedback`\r\n *\r\n * Um componente utilizado como container de feedback em todos os componente de entrada de dados do pacote.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const InputFeedback = ({ errors, name, ...props }: ApiFieldComponentProps & { errors?: any }) => {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return !props.mode || props.mode === \"Controlled\"\r\n        ? <div data-name={name}\r\n               id=\"j_feedback\"/>\r\n        : <div className={(!errors[name ?? \"\"] ? \"\" : \"invalid-feedback is-invalid\")}\r\n               data-name={name ?? \"\"}\r\n               id=\"j_feedback\"\r\n               style={{ display: errors[name ?? \"\"] ? \"block\" : \"none\" }}>{!errors[name ?? \"\"] ? \"\" : errors[name ?? \"\"].message}</div>;\r\n};\r\n\r\n/**\r\n * API - `InputProps`\r\n *\r\n * Retorna o objeto com as `Props` do core dos componentes de entrada de dados\r\n */\r\nexport function InputProps<T extends ApiComponentProps & ApiFieldComponentProps & { ref: any }>(props: T) {\r\n    return {\r\n        ref: props.ref,\r\n\r\n        id: props.id,\r\n        name: props.name,\r\n        required: props.required,\r\n        disabled: props.disabled,\r\n        placeholder: props.placeholder,\r\n\r\n        className: props.className,\r\n        style: { width: \"100%\" },\r\n\r\n        keyfilter: props.keyfilter,\r\n    };\r\n}"],"names":["InputLabel","iconPrefix","props","label","React","createElement","className","icon","required","InputFeedback","errors","name","mode","id","style","display","message","InputProps","ref","disabled","placeholder","width","keyfilter"],"mappings":"qBASO,MAAMA,EAAa,EAAGC,aAAa,YAAaC,KAM5CA,EAAMC,OACNC,EAAGC,cAAA,IAAA,CAAAC,UAAU,cACXJ,EAAMK,MAAQH,EAAAC,cAAA,IAAA,CAAGC,UAAWL,EAAaC,EAAMK,KAAO,UACtDL,EAAMC,MACND,EAAMM,UAAYJ,EAAAC,cAAA,OAAA,CAAMC,UAAU,eAAsB,MAUxDG,EAAgB,EAAGC,SAAQC,UAAST,KAMrCA,EAAMU,MAAuB,eAAfV,EAAMU,KAGtBR,EAAAC,cAAA,MAAA,CAAKC,UAAaI,EAAOC,GAAQ,IAAW,8BAAL,GAAmC,YAC1DA,GAAQ,GACnBE,GAAG,aACHC,MAAO,CAAEC,QAASL,EAAOC,GAAQ,IAAM,QAAU,SAAYD,EAAOC,GAAQ,IAAWD,EAAOC,GAAQ,IAAIK,QAAxB,IALvFZ,EAAgBC,cAAA,MAAA,CAAA,YAAAM,EACXE,GAAG,eAYZ,SAAUI,EAAgFf,GAC5F,MAAO,CACHgB,IAAKhB,EAAMgB,IAEXL,GAAIX,EAAMW,GACVF,KAAMT,EAAMS,KACZH,SAAUN,EAAMM,SAChBW,SAAUjB,EAAMiB,SAChBC,YAAalB,EAAMkB,YAEnBd,UAAWJ,EAAMI,UACjBQ,MAAO,CAAEO,MAAO,QAEhBC,UAAWpB,EAAMoB,UAEzB"}

package/autocomplete/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react"),a=require("primereact/utils"),t=require("primereact/autocomplete");const i=({children:t,...i})=>{const r={size:`box-size-${i.size??"100"}`,direction:`box-direction-${i.direction??"row"}`,justify:void 0===i.justify?"":Array.isArray(i.justify)?i.justify?.join(" "):i.justify,align:void 0===i.align?"":Array.isArray(i.align)?i.align?.join(" "):i.align},l={className:a.classNames(["box",i.className??"",r.size,r.direction,r.justify,r.align]),style:i.css,id:i.id};return e.createElement("div",{...l},t)},r=({iconPrefix:a="bi bi-",...t})=>t.label&&e.createElement("p",{className:"form-label"},t.icon&&e.createElement("i",{className:a+t.icon+" me-1"}),t.label,t.required&&e.createElement("span",{className:"text-danger"},"*"));function l(e){const a=e.dataTemplate?{itemTemplate:e.dataTemplate}:{};return{id:e.id,field:"name",name:e.name,forceSelection:!0,style:e.css??{},disabled:e.disabled,required:e.required,placeholder:e.placeholder,inputClassName:"form-control",appendTo:e.appendTo??"self",className:"autocomplete-primereact w-100",...a}}function s(e){return{completeMethod(a){e.onSearch(a.query)},onChange(a){e.onChange(a.value)},onSelect(a){e.onSelect&&e.onSelect(a.value)}}}exports.Autocomplete=({...a})=>e.createElement(i,{className:"autocomplete"+(a.className??""),css:a.css,size:a.size??"100"},e.createElement(r,{...a}),e.createElement(t.AutoComplete,{delay:a.searchDelay??500,maxLength:a.searchMax,minLength:a.searchMin??1,suggestions:a.data??[],value:a.value,...l(a),...s(a)}),e.createElement("div",{"data-name":a.name,id:"j_feedback"}));
+"use strict";var e=require("react"),a=require("primereact/utils"),t=require("primereact/autocomplete");const i=({children:t,...i})=>{const r={size:`box-size-${i.size??"100"}`,direction:`box-direction-${i.direction??"row"}`,justify:void 0===i.justify?"":Array.isArray(i.justify)?i.justify?.join(" "):i.justify,align:void 0===i.align?"":Array.isArray(i.align)?i.align?.join(" "):i.align},l={className:a.classNames(["box",i.className??"",r.size,r.direction,r.justify,r.align]),style:i.css,id:i.id};return e.createElement("div",{...l},t)},r=({iconPrefix:a="bi bi-",...t})=>t.label&&e.createElement("p",{className:"form-label"},t.icon&&e.createElement("i",{className:a+t.icon+" me-1"}),t.label,t.required&&e.createElement("span",{className:"text-danger"},"*"));function l(e){const a=e.dataTemplate?{itemTemplate:e.dataTemplate}:{};return{id:e.id,field:"name",name:e.name,forceSelection:e.forceSelect??!0,style:e.css??{},disabled:e.disabled,required:e.required,placeholder:e.placeholder,inputClassName:"form-control",appendTo:e.appendTo??"self",className:"autocomplete-primereact w-100",...a}}function s(e){return{completeMethod(a){e.onSearch(a.query)},onChange(a){e.onChange(a.value)},onSelect(a){e.onSelect&&e.onSelect(a.value)}}}exports.Autocomplete=({...a})=>e.createElement(i,{className:"autocomplete"+(a.className??""),css:a.css,size:a.size??"100"},e.createElement(r,{...a}),e.createElement(t.AutoComplete,{delay:a.searchDelay??500,maxLength:a.searchMax,minLength:a.searchMin??1,suggestions:a.data??[],value:a.value,...l(a),...s(a)}),e.createElement("div",{"data-name":a.name,id:"j_feedback"}));
 //# sourceMappingURL=index.cjs.js.map

package/autocomplete/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../src/box/box.tsx","../../src/api/input.tsx","../../src/autocomplete/core/core.tsx","../../src/autocomplete/core/event.tsx","../../src/autocomplete/autocomplete.tsx"],"sourcesContent":["import { BoxProps } from \"./types\";\r\nimport React, { HTMLAttributes } from \"react\";\r\nimport { classNames } from \"primereact/utils\";\r\n\r\n/**\r\n * Componente - `Box`\r\n *\r\n * Um componente versátil que pode ser utilizado para criar seções ou caixas em uma página.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n *\r\n * Exemplo de uso:\r\n * ```tsx\r\n * <Box align=\"align-items-center\"\r\n *      justify=\"justify-content-end\"\r\n *      size=\"25\">\r\n *   ...conteúdo HTML\r\n * </Box>\r\n * ```\r\n */\r\nexport const Box = ({ children, ...props }: BoxProps) => {\r\n    const css = {\r\n        size: `box-size-${(props.size ?? \"100\")}`,\r\n        direction: `box-direction-${props.direction ?? \"row\"}`,\r\n        justify: props.justify === undefined ? \"\" : Array.isArray(props.justify) ? props.justify?.join(\" \") : props.justify,\r\n        align: props.align === undefined ? \"\" : Array.isArray(props.align) ? props.align?.join(\" \") : props.align\r\n    };\r\n\r\n    const attr: HTMLAttributes<\"div\"> & Omit<BoxProps, \"children\"> = {\r\n        className: classNames([\r\n            \"box\",\r\n            props.className ?? \"\",\r\n            css.size,\r\n            css.direction,\r\n            css.justify,\r\n            css.align\r\n        ]),\r\n        style: props.css,\r\n        id: props.id\r\n    };\r\n\r\n    return (\r\n        <div {...attr as any}>{children}</div>\r\n    );\r\n};","import React from \"react\";\r\nimport { ApiFieldComponentProps } from \"./types\";\r\n\r\n/**\r\n * API - `InputLabel`\r\n *\r\n * Um componente utilizado como label em todos os componente de campo do pacote.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const InputLabel = ({ iconPrefix = \"bi bi-\", ...props }: ApiFieldComponentProps) => {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return props.label\r\n        && <p className='form-label'>\r\n            {props.icon && <i className={iconPrefix + props.icon + \" me-1\"}/>}\r\n            {props.label}\r\n            {props.required && <span className=\"text-danger\">*</span>}\r\n        </p>;\r\n};","import { AutocompleteProps } from \"../types\";\r\nimport { AutoCompleteProps as AutoCompletePropsPrimeReact } from \"primereact/autocomplete\";\r\n\r\n/**\r\n * Componente - `Autocomplete`\r\n *\r\n * Define as configurações do modo principal do autocomplete.\r\n */\r\nexport function autocompleCore(\r\n    props: AutocompleteProps\r\n): Partial<AutoCompletePropsPrimeReact> {\r\n\r\n    const itemTemplate: Partial<AutoCompletePropsPrimeReact> = props.dataTemplate\r\n        ? { itemTemplate: props.dataTemplate }\r\n        : {};\r\n    return {\r\n        id: props.id,\r\n        field: \"name\",\r\n        name: props.name,\r\n        forceSelection: true,\r\n        style: props.css ?? {},\r\n        disabled: props.disabled,\r\n        required: props.required,\r\n        placeholder: props.placeholder,\r\n        inputClassName: \"form-control\",\r\n        appendTo: props.appendTo ?? \"self\",\r\n        className: \"autocomplete-primereact w-100\",\r\n        ...itemTemplate\r\n    };\r\n}","import { AutocompleteProps } from \"../types\";\r\nimport {\r\n    AutoCompleteChangeEvent,\r\n    AutoCompleteCompleteEvent,\r\n    AutoCompleteProps as AutoCompletePropsPrimeReact, AutoCompleteSelectEvent\r\n} from \"primereact/autocomplete\";\r\n\r\n/**\r\n * Componente - `Autocomplete`\r\n *\r\n * Define as configuração de evento do componente\r\n */\r\nexport function autocompleteEvent(props: AutocompleteProps): Partial<AutoCompletePropsPrimeReact> {\r\n    return {\r\n        completeMethod(event: AutoCompleteCompleteEvent) {\r\n            props.onSearch(event.query);\r\n        },\r\n        onChange(event: AutoCompleteChangeEvent) {\r\n            props.onChange(event.value);\r\n        },\r\n        onSelect(event: AutoCompleteSelectEvent) {\r\n            if (props.onSelect) {\r\n                props.onSelect(event.value);\r\n            }\r\n        }\r\n    };\r\n}","import React from \"react\";\r\nimport { Box } from \"../box\";\r\nimport { InputLabel } from \"../api\";\r\nimport { AutocompleteProps } from \"./types\";\r\nimport { autocompleCore } from \"./core/core\";\r\nimport { autocompleteEvent } from \"./core/event\";\r\nimport { AutoComplete as AutoCompletePrimeReact } from \"primereact/autocomplete\";\r\n\r\n/**\r\n * Componente - `Autocomplete`\r\n *\r\n * AutoComplete é um componente de entrada que fornece sugestões em tempo real enquanto é digitado\r\n */\r\nexport const Autocomplete = ({ ...props }: AutocompleteProps) => {\r\n    return (\r\n        <Box className={\"autocomplete\" + (props.className ?? \"\")}\r\n             css={props.css}\r\n             size={props.size ?? \"100\"}>\r\n            <InputLabel {...props}/>\r\n            <AutoCompletePrimeReact delay={props.searchDelay ?? 500}\r\n                                    maxLength={props.searchMax}\r\n                                    minLength={props.searchMin ?? 1}\r\n                                    suggestions={props.data ?? []}\r\n                                    value={props.value}\r\n                                    {...autocompleCore(props)}\r\n                                    {...autocompleteEvent(props)}/>\r\n            <div data-name={props.name}\r\n                 id=\"j_feedback\"/>\r\n        </Box>\r\n    );\r\n};"],"names":["Box","children","props","css","size","direction","justify","undefined","Array","isArray","join","align","attr","className","classNames","style","id","React","createElement","InputLabel","iconPrefix","label","icon","required","autocompleCore","itemTemplate","dataTemplate","field","name","forceSelection","disabled","placeholder","inputClassName","appendTo","autocompleteEvent","completeMethod","event","onSearch","query","onChange","value","onSelect","AutoCompletePrimeReact","delay","searchDelay","maxLength","searchMax","minLength","searchMin","suggestions","data"],"mappings":"uGAmBO,MAAMA,EAAM,EAAGC,cAAaC,MAC/B,MAAMC,EAAM,CACRC,KAAM,YAAaF,EAAME,MAAQ,QACjCC,UAAW,iBAAiBH,EAAMG,WAAa,QAC/CC,aAA2BC,IAAlBL,EAAMI,QAAwB,GAAKE,MAAMC,QAAQP,EAAMI,SAAWJ,EAAMI,SAASI,KAAK,KAAOR,EAAMI,QAC5GK,WAAuBJ,IAAhBL,EAAMS,MAAsB,GAAKH,MAAMC,QAAQP,EAAMS,OAAST,EAAMS,OAAOD,KAAK,KAAOR,EAAMS,OAGlGC,EAA2D,CAC7DC,UAAWC,EAAAA,WAAW,CAClB,MACAZ,EAAMW,WAAa,GACnBV,EAAIC,KACJD,EAAIE,UACJF,EAAIG,QACJH,EAAIQ,QAERI,MAAOb,EAAMC,IACba,GAAId,EAAMc,IAGd,OACIC,EAASC,cAAA,MAAA,IAAAN,GAAcX,EAAe,EChCjCkB,EAAa,EAAGC,aAAa,YAAalB,KAM5CA,EAAMmB,OACNJ,EAAGC,cAAA,IAAA,CAAAL,UAAU,cACXX,EAAMoB,MAAQL,EAAAC,cAAA,IAAA,CAAGL,UAAWO,EAAalB,EAAMoB,KAAO,UACtDpB,EAAMmB,MACNnB,EAAMqB,UAAYN,EAAAC,cAAA,OAAA,CAAML,UAAU,eAAsB,MCX/D,SAAUW,EACZtB,GAGA,MAAMuB,EAAqDvB,EAAMwB,aAC3D,CAAED,aAAcvB,EAAMwB,cACtB,CAAE,EACR,MAAO,CACHV,GAAId,EAAMc,GACVW,MAAO,OACPC,KAAM1B,EAAM0B,KACZC,gBAAgB,EAChBd,MAAOb,EAAMC,KAAO,CAAE,EACtB2B,SAAU5B,EAAM4B,SAChBP,SAAUrB,EAAMqB,SAChBQ,YAAa7B,EAAM6B,YACnBC,eAAgB,eAChBC,SAAU/B,EAAM+B,UAAY,OAC5BpB,UAAW,mCACRY,EAEX,CCjBM,SAAUS,EAAkBhC,GAC9B,MAAO,CACH,cAAAiC,CAAeC,GACXlC,EAAMmC,SAASD,EAAME,MACxB,EACD,QAAAC,CAASH,GACLlC,EAAMqC,SAASH,EAAMI,MACxB,EACD,QAAAC,CAASL,GACDlC,EAAMuC,UACNvC,EAAMuC,SAASL,EAAMI,QAIrC,sBCb4B,KAAMtC,KAE1Be,EAAAC,cAAClB,EAAG,CAACa,UAAW,gBAAkBX,EAAMW,WAAa,IAChDV,IAAKD,EAAMC,IACXC,KAAMF,EAAME,MAAQ,OACrBa,EAACC,cAAAC,EAAe,IAAAjB,IAChBe,EAACC,cAAAwB,EAAAA,cAAuBC,MAAOzC,EAAM0C,aAAe,IAC5BC,UAAW3C,EAAM4C,UACjBC,UAAW7C,EAAM8C,WAAa,EAC9BC,YAAa/C,EAAMgD,MAAQ,GAC3BV,MAAOtC,EAAMsC,SACThB,EAAetB,MACfgC,EAAkBhC,KAC9Ce,EAAgBC,cAAA,MAAA,CAAA,YAAAhB,EAAM0B,KACjBZ,GAAG"}
+{"version":3,"file":"index.cjs.js","sources":["../../src/box/box.tsx","../../src/api/input.tsx","../../src/autocomplete/core/core.tsx","../../src/autocomplete/core/event.tsx","../../src/autocomplete/autocomplete.tsx"],"sourcesContent":["import { BoxProps } from \"./types\";\r\nimport React, { HTMLAttributes } from \"react\";\r\nimport { classNames } from \"primereact/utils\";\r\n\r\n/**\r\n * Componente - `Box`\r\n *\r\n * Um componente versátil que pode ser utilizado para criar seções ou caixas em uma página.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n *\r\n * Exemplo de uso:\r\n * ```tsx\r\n * <Box align=\"align-items-center\"\r\n *      justify=\"justify-content-end\"\r\n *      size=\"25\">\r\n *   ...conteúdo HTML\r\n * </Box>\r\n * ```\r\n */\r\nexport const Box = ({ children, ...props }: BoxProps) => {\r\n    const css = {\r\n        size: `box-size-${(props.size ?? \"100\")}`,\r\n        direction: `box-direction-${props.direction ?? \"row\"}`,\r\n        justify: props.justify === undefined ? \"\" : Array.isArray(props.justify) ? props.justify?.join(\" \") : props.justify,\r\n        align: props.align === undefined ? \"\" : Array.isArray(props.align) ? props.align?.join(\" \") : props.align\r\n    };\r\n\r\n    const attr: HTMLAttributes<\"div\"> & Omit<BoxProps, \"children\"> = {\r\n        className: classNames([\r\n            \"box\",\r\n            props.className ?? \"\",\r\n            css.size,\r\n            css.direction,\r\n            css.justify,\r\n            css.align\r\n        ]),\r\n        style: props.css,\r\n        id: props.id\r\n    };\r\n\r\n    return (\r\n        <div {...attr as any}>{children}</div>\r\n    );\r\n};","import React from \"react\";\r\nimport { ApiComponentProps, ApiFieldComponentProps } from \"./types\";\r\n\r\n/**\r\n * API - `InputLabel`\r\n *\r\n * Um componente utilizado como label em todos os componente de entrada de dados do pacote.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const InputLabel = ({ iconPrefix = \"bi bi-\", ...props }: ApiFieldComponentProps) => {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return props.label\r\n        && <p className='form-label'>\r\n            {props.icon && <i className={iconPrefix + props.icon + \" me-1\"}/>}\r\n            {props.label}\r\n            {props.required && <span className=\"text-danger\">*</span>}\r\n        </p>;\r\n};\r\n\r\n/**\r\n * API - `InputFeedback`\r\n *\r\n * Um componente utilizado como container de feedback em todos os componente de entrada de dados do pacote.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const InputFeedback = ({ errors, name, ...props }: ApiFieldComponentProps & { errors?: any }) => {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return !props.mode || props.mode === \"Controlled\"\r\n        ? <div data-name={name}\r\n               id=\"j_feedback\"/>\r\n        : <div className={(!errors[name ?? \"\"] ? \"\" : \"invalid-feedback is-invalid\")}\r\n               data-name={name ?? \"\"}\r\n               id=\"j_feedback\"\r\n               style={{ display: errors[name ?? \"\"] ? \"block\" : \"none\" }}>{!errors[name ?? \"\"] ? \"\" : errors[name ?? \"\"].message}</div>;\r\n};\r\n\r\n/**\r\n * API - `InputProps`\r\n *\r\n * Retorna o objeto com as `Props` do core dos componentes de entrada de dados\r\n */\r\nexport function InputProps<T extends ApiComponentProps & ApiFieldComponentProps & { ref: any }>(props: T) {\r\n    return {\r\n        ref: props.ref,\r\n\r\n        id: props.id,\r\n        name: props.name,\r\n        required: props.required,\r\n        disabled: props.disabled,\r\n        placeholder: props.placeholder,\r\n\r\n        className: props.className,\r\n        style: { width: \"100%\" },\r\n\r\n        keyfilter: props.keyfilter,\r\n    };\r\n}","import { AutocompleteProps } from \"../types\";\r\nimport { AutoCompleteProps as AutoCompletePropsPrimeReact } from \"primereact/autocomplete\";\r\n\r\n/**\r\n * Componente - `Autocomplete`\r\n *\r\n * Define as configurações do modo principal do autocomplete.\r\n */\r\nexport function autocompleCore(\r\n    props: AutocompleteProps\r\n): Partial<AutoCompletePropsPrimeReact> {\r\n\r\n    const itemTemplate: Partial<AutoCompletePropsPrimeReact> = props.dataTemplate\r\n        ? { itemTemplate: props.dataTemplate }\r\n        : {};\r\n    return {\r\n        id: props.id,\r\n        field: \"name\",\r\n        name: props.name,\r\n        forceSelection: props.forceSelect ?? true,\r\n        style: props.css ?? {},\r\n        disabled: props.disabled,\r\n        required: props.required,\r\n        placeholder: props.placeholder,\r\n        inputClassName: \"form-control\",\r\n        appendTo: props.appendTo ?? \"self\",\r\n        className: \"autocomplete-primereact w-100\",\r\n        ...itemTemplate\r\n    };\r\n}","import { AutocompleteProps } from \"../types\";\r\nimport {\r\n    AutoCompleteChangeEvent,\r\n    AutoCompleteCompleteEvent,\r\n    AutoCompleteProps as AutoCompletePropsPrimeReact, AutoCompleteSelectEvent\r\n} from \"primereact/autocomplete\";\r\n\r\n/**\r\n * Componente - `Autocomplete`\r\n *\r\n * Define as configuração de evento do componente\r\n */\r\nexport function autocompleteEvent(props: AutocompleteProps): Partial<AutoCompletePropsPrimeReact> {\r\n    return {\r\n        completeMethod(event: AutoCompleteCompleteEvent) {\r\n            props.onSearch(event.query);\r\n        },\r\n        onChange(event: AutoCompleteChangeEvent) {\r\n            props.onChange(event.value);\r\n        },\r\n        onSelect(event: AutoCompleteSelectEvent) {\r\n            if (props.onSelect) {\r\n                props.onSelect(event.value);\r\n            }\r\n        }\r\n    };\r\n}","import React from \"react\";\r\nimport { Box } from \"../box\";\r\nimport { InputLabel } from \"../api\";\r\nimport { AutocompleteProps } from \"./types\";\r\nimport { autocompleCore } from \"./core/core\";\r\nimport { autocompleteEvent } from \"./core/event\";\r\nimport { AutoComplete as AutoCompletePrimeReact } from \"primereact/autocomplete\";\r\n\r\n/**\r\n * Componente - `Autocomplete`\r\n *\r\n * AutoComplete é um componente de entrada que fornece sugestões em tempo real enquanto é digitado\r\n */\r\nexport const Autocomplete = ({ ...props }: AutocompleteProps) => {\r\n    return (\r\n        <Box className={\"autocomplete\" + (props.className ?? \"\")}\r\n             css={props.css}\r\n             size={props.size ?? \"100\"}>\r\n            <InputLabel {...props}/>\r\n            <AutoCompletePrimeReact delay={props.searchDelay ?? 500}\r\n                                    maxLength={props.searchMax}\r\n                                    minLength={props.searchMin ?? 1}\r\n                                    suggestions={props.data ?? []}\r\n                                    value={props.value}\r\n                                    {...autocompleCore(props)}\r\n                                    {...autocompleteEvent(props)}/>\r\n            <div data-name={props.name}\r\n                 id=\"j_feedback\"/>\r\n        </Box>\r\n    );\r\n};"],"names":["Box","children","props","css","size","direction","justify","undefined","Array","isArray","join","align","attr","className","classNames","style","id","React","createElement","InputLabel","iconPrefix","label","icon","required","autocompleCore","itemTemplate","dataTemplate","field","name","forceSelection","forceSelect","disabled","placeholder","inputClassName","appendTo","autocompleteEvent","completeMethod","event","onSearch","query","onChange","value","onSelect","AutoCompletePrimeReact","delay","searchDelay","maxLength","searchMax","minLength","searchMin","suggestions","data"],"mappings":"uGAmBO,MAAMA,EAAM,EAAGC,cAAaC,MAC/B,MAAMC,EAAM,CACRC,KAAM,YAAaF,EAAME,MAAQ,QACjCC,UAAW,iBAAiBH,EAAMG,WAAa,QAC/CC,aAA2BC,IAAlBL,EAAMI,QAAwB,GAAKE,MAAMC,QAAQP,EAAMI,SAAWJ,EAAMI,SAASI,KAAK,KAAOR,EAAMI,QAC5GK,WAAuBJ,IAAhBL,EAAMS,MAAsB,GAAKH,MAAMC,QAAQP,EAAMS,OAAST,EAAMS,OAAOD,KAAK,KAAOR,EAAMS,OAGlGC,EAA2D,CAC7DC,UAAWC,EAAAA,WAAW,CAClB,MACAZ,EAAMW,WAAa,GACnBV,EAAIC,KACJD,EAAIE,UACJF,EAAIG,QACJH,EAAIQ,QAERI,MAAOb,EAAMC,IACba,GAAId,EAAMc,IAGd,OACIC,EAASC,cAAA,MAAA,IAAAN,GAAcX,EAAe,EChCjCkB,EAAa,EAAGC,aAAa,YAAalB,KAM5CA,EAAMmB,OACNJ,EAAGC,cAAA,IAAA,CAAAL,UAAU,cACXX,EAAMoB,MAAQL,EAAAC,cAAA,IAAA,CAAGL,UAAWO,EAAalB,EAAMoB,KAAO,UACtDpB,EAAMmB,MACNnB,EAAMqB,UAAYN,EAAAC,cAAA,OAAA,CAAML,UAAU,eAAsB,MCX/D,SAAUW,EACZtB,GAGA,MAAMuB,EAAqDvB,EAAMwB,aAC3D,CAAED,aAAcvB,EAAMwB,cACtB,CAAE,EACR,MAAO,CACHV,GAAId,EAAMc,GACVW,MAAO,OACPC,KAAM1B,EAAM0B,KACZC,eAAgB3B,EAAM4B,cAAe,EACrCf,MAAOb,EAAMC,KAAO,CAAE,EACtB4B,SAAU7B,EAAM6B,SAChBR,SAAUrB,EAAMqB,SAChBS,YAAa9B,EAAM8B,YACnBC,eAAgB,eAChBC,SAAUhC,EAAMgC,UAAY,OAC5BrB,UAAW,mCACRY,EAEX,CCjBM,SAAUU,EAAkBjC,GAC9B,MAAO,CACH,cAAAkC,CAAeC,GACXnC,EAAMoC,SAASD,EAAME,MACxB,EACD,QAAAC,CAASH,GACLnC,EAAMsC,SAASH,EAAMI,MACxB,EACD,QAAAC,CAASL,GACDnC,EAAMwC,UACNxC,EAAMwC,SAASL,EAAMI,QAIrC,sBCb4B,KAAMvC,KAE1Be,EAAAC,cAAClB,EAAG,CAACa,UAAW,gBAAkBX,EAAMW,WAAa,IAChDV,IAAKD,EAAMC,IACXC,KAAMF,EAAME,MAAQ,OACrBa,EAACC,cAAAC,EAAe,IAAAjB,IAChBe,EAACC,cAAAyB,EAAAA,cAAuBC,MAAO1C,EAAM2C,aAAe,IAC5BC,UAAW5C,EAAM6C,UACjBC,UAAW9C,EAAM+C,WAAa,EAC9BC,YAAahD,EAAMiD,MAAQ,GAC3BV,MAAOvC,EAAMuC,SACTjB,EAAetB,MACfiC,EAAkBjC,KAC9Ce,EAAgBC,cAAA,MAAA,CAAA,YAAAhB,EAAM0B,KACjBZ,GAAG"}

package/autocomplete/index.d.ts

@@ -1,4 +1,5 @@
 import React, { CSSProperties } from 'react';
+import { KeyFilterType } from 'primereact/keyfilter';
 
 /**
  * Define as tipagens `default` de todos os componentes do pacote
@@ -27,7 +28,12 @@ interface ApiComponentProps {
 }
 
 /**
- * Define as tipagens ´default´ de tidos os componente de entrada de dados do pacote
+ * Define o modo do componente de entrada de dados
+ */
+type ApiFieldModeProps = "Controlled" | "HookForm";
+
+/**
+ * Define os tipos `default` para componente de entrada de dados
  */
 interface ApiFieldComponentProps {
 
@@ -70,6 +76,21 @@ interface ApiFieldComponentProps {
      * Desabilita a entrada de dados no campo
      */
     disabled?: boolean
+
+    /**
+     * Define o modo do componente de entrada de dados
+     */
+    mode?: ApiFieldModeProps
+
+    /**
+     * Define a opção de filtro de dados do componente
+     */
+    keyfilter?: KeyFilterType;
+
+    /**
+     * Determina se campo é apenas de leitura
+     */
+    readonly?: boolean
 }
 
 interface AutocompleteDataProps {
@@ -106,6 +127,11 @@ interface AutocompleteProps extends ApiComponentProps, ApiFieldComponentProps {
      */
     appendTo?: "self" | HTMLElement;
 
+    /**
+     * Determina se é obrigatório a seleção do elemento
+     */
+    forceSelect?: boolean
+
     /**
      * Define o tempo para realizar a pesquisa da sugestão de dados.
      */
@@ -146,4 +172,5 @@ declare const Autocomplete: ({ ...props }: AutocompleteProps) => React.JSX.Eleme
 
 type IAutocompleteDataProps = AutocompleteDataProps;
 
-export { Autocomplete, type IAutocompleteDataProps };
+export { Autocomplete };
+export type { IAutocompleteDataProps };

package/autocomplete/index.esm.js

@@ -1,2 +1,2 @@
-import e from"react";import{classNames as a}from"primereact/utils";import{AutoComplete as t}from"primereact/autocomplete";const i=({children:t,...i})=>{const r={size:`box-size-${i.size??"100"}`,direction:`box-direction-${i.direction??"row"}`,justify:void 0===i.justify?"":Array.isArray(i.justify)?i.justify?.join(" "):i.justify,align:void 0===i.align?"":Array.isArray(i.align)?i.align?.join(" "):i.align},n={className:a(["box",i.className??"",r.size,r.direction,r.justify,r.align]),style:i.css,id:i.id};return e.createElement("div",{...n},t)},r=({iconPrefix:a="bi bi-",...t})=>t.label&&e.createElement("p",{className:"form-label"},t.icon&&e.createElement("i",{className:a+t.icon+" me-1"}),t.label,t.required&&e.createElement("span",{className:"text-danger"},"*"));function n(e){const a=e.dataTemplate?{itemTemplate:e.dataTemplate}:{};return{id:e.id,field:"name",name:e.name,forceSelection:!0,style:e.css??{},disabled:e.disabled,required:e.required,placeholder:e.placeholder,inputClassName:"form-control",appendTo:e.appendTo??"self",className:"autocomplete-primereact w-100",...a}}function l(e){return{completeMethod(a){e.onSearch(a.query)},onChange(a){e.onChange(a.value)},onSelect(a){e.onSelect&&e.onSelect(a.value)}}}const s=({...a})=>e.createElement(i,{className:"autocomplete"+(a.className??""),css:a.css,size:a.size??"100"},e.createElement(r,{...a}),e.createElement(t,{delay:a.searchDelay??500,maxLength:a.searchMax,minLength:a.searchMin??1,suggestions:a.data??[],value:a.value,...n(a),...l(a)}),e.createElement("div",{"data-name":a.name,id:"j_feedback"}));export{s as Autocomplete};
+import e from"react";import{classNames as a}from"primereact/utils";import{AutoComplete as t}from"primereact/autocomplete";const i=({children:t,...i})=>{const r={size:`box-size-${i.size??"100"}`,direction:`box-direction-${i.direction??"row"}`,justify:void 0===i.justify?"":Array.isArray(i.justify)?i.justify?.join(" "):i.justify,align:void 0===i.align?"":Array.isArray(i.align)?i.align?.join(" "):i.align},l={className:a(["box",i.className??"",r.size,r.direction,r.justify,r.align]),style:i.css,id:i.id};return e.createElement("div",{...l},t)},r=({iconPrefix:a="bi bi-",...t})=>t.label&&e.createElement("p",{className:"form-label"},t.icon&&e.createElement("i",{className:a+t.icon+" me-1"}),t.label,t.required&&e.createElement("span",{className:"text-danger"},"*"));function l(e){const a=e.dataTemplate?{itemTemplate:e.dataTemplate}:{};return{id:e.id,field:"name",name:e.name,forceSelection:e.forceSelect??!0,style:e.css??{},disabled:e.disabled,required:e.required,placeholder:e.placeholder,inputClassName:"form-control",appendTo:e.appendTo??"self",className:"autocomplete-primereact w-100",...a}}function n(e){return{completeMethod(a){e.onSearch(a.query)},onChange(a){e.onChange(a.value)},onSelect(a){e.onSelect&&e.onSelect(a.value)}}}const c=({...a})=>e.createElement(i,{className:"autocomplete"+(a.className??""),css:a.css,size:a.size??"100"},e.createElement(r,{...a}),e.createElement(t,{delay:a.searchDelay??500,maxLength:a.searchMax,minLength:a.searchMin??1,suggestions:a.data??[],value:a.value,...l(a),...n(a)}),e.createElement("div",{"data-name":a.name,id:"j_feedback"}));export{c as Autocomplete};
 //# sourceMappingURL=index.esm.js.map

package/autocomplete/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../src/box/box.tsx","../../src/api/input.tsx","../../src/autocomplete/core/core.tsx","../../src/autocomplete/core/event.tsx","../../src/autocomplete/autocomplete.tsx"],"sourcesContent":["import { BoxProps } from \"./types\";\r\nimport React, { HTMLAttributes } from \"react\";\r\nimport { classNames } from \"primereact/utils\";\r\n\r\n/**\r\n * Componente - `Box`\r\n *\r\n * Um componente versátil que pode ser utilizado para criar seções ou caixas em uma página.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n *\r\n * Exemplo de uso:\r\n * ```tsx\r\n * <Box align=\"align-items-center\"\r\n *      justify=\"justify-content-end\"\r\n *      size=\"25\">\r\n *   ...conteúdo HTML\r\n * </Box>\r\n * ```\r\n */\r\nexport const Box = ({ children, ...props }: BoxProps) => {\r\n    const css = {\r\n        size: `box-size-${(props.size ?? \"100\")}`,\r\n        direction: `box-direction-${props.direction ?? \"row\"}`,\r\n        justify: props.justify === undefined ? \"\" : Array.isArray(props.justify) ? props.justify?.join(\" \") : props.justify,\r\n        align: props.align === undefined ? \"\" : Array.isArray(props.align) ? props.align?.join(\" \") : props.align\r\n    };\r\n\r\n    const attr: HTMLAttributes<\"div\"> & Omit<BoxProps, \"children\"> = {\r\n        className: classNames([\r\n            \"box\",\r\n            props.className ?? \"\",\r\n            css.size,\r\n            css.direction,\r\n            css.justify,\r\n            css.align\r\n        ]),\r\n        style: props.css,\r\n        id: props.id\r\n    };\r\n\r\n    return (\r\n        <div {...attr as any}>{children}</div>\r\n    );\r\n};","import React from \"react\";\r\nimport { ApiFieldComponentProps } from \"./types\";\r\n\r\n/**\r\n * API - `InputLabel`\r\n *\r\n * Um componente utilizado como label em todos os componente de campo do pacote.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const InputLabel = ({ iconPrefix = \"bi bi-\", ...props }: ApiFieldComponentProps) => {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return props.label\r\n        && <p className='form-label'>\r\n            {props.icon && <i className={iconPrefix + props.icon + \" me-1\"}/>}\r\n            {props.label}\r\n            {props.required && <span className=\"text-danger\">*</span>}\r\n        </p>;\r\n};","import { AutocompleteProps } from \"../types\";\r\nimport { AutoCompleteProps as AutoCompletePropsPrimeReact } from \"primereact/autocomplete\";\r\n\r\n/**\r\n * Componente - `Autocomplete`\r\n *\r\n * Define as configurações do modo principal do autocomplete.\r\n */\r\nexport function autocompleCore(\r\n    props: AutocompleteProps\r\n): Partial<AutoCompletePropsPrimeReact> {\r\n\r\n    const itemTemplate: Partial<AutoCompletePropsPrimeReact> = props.dataTemplate\r\n        ? { itemTemplate: props.dataTemplate }\r\n        : {};\r\n    return {\r\n        id: props.id,\r\n        field: \"name\",\r\n        name: props.name,\r\n        forceSelection: true,\r\n        style: props.css ?? {},\r\n        disabled: props.disabled,\r\n        required: props.required,\r\n        placeholder: props.placeholder,\r\n        inputClassName: \"form-control\",\r\n        appendTo: props.appendTo ?? \"self\",\r\n        className: \"autocomplete-primereact w-100\",\r\n        ...itemTemplate\r\n    };\r\n}","import { AutocompleteProps } from \"../types\";\r\nimport {\r\n    AutoCompleteChangeEvent,\r\n    AutoCompleteCompleteEvent,\r\n    AutoCompleteProps as AutoCompletePropsPrimeReact, AutoCompleteSelectEvent\r\n} from \"primereact/autocomplete\";\r\n\r\n/**\r\n * Componente - `Autocomplete`\r\n *\r\n * Define as configuração de evento do componente\r\n */\r\nexport function autocompleteEvent(props: AutocompleteProps): Partial<AutoCompletePropsPrimeReact> {\r\n    return {\r\n        completeMethod(event: AutoCompleteCompleteEvent) {\r\n            props.onSearch(event.query);\r\n        },\r\n        onChange(event: AutoCompleteChangeEvent) {\r\n            props.onChange(event.value);\r\n        },\r\n        onSelect(event: AutoCompleteSelectEvent) {\r\n            if (props.onSelect) {\r\n                props.onSelect(event.value);\r\n            }\r\n        }\r\n    };\r\n}","import React from \"react\";\r\nimport { Box } from \"../box\";\r\nimport { InputLabel } from \"../api\";\r\nimport { AutocompleteProps } from \"./types\";\r\nimport { autocompleCore } from \"./core/core\";\r\nimport { autocompleteEvent } from \"./core/event\";\r\nimport { AutoComplete as AutoCompletePrimeReact } from \"primereact/autocomplete\";\r\n\r\n/**\r\n * Componente - `Autocomplete`\r\n *\r\n * AutoComplete é um componente de entrada que fornece sugestões em tempo real enquanto é digitado\r\n */\r\nexport const Autocomplete = ({ ...props }: AutocompleteProps) => {\r\n    return (\r\n        <Box className={\"autocomplete\" + (props.className ?? \"\")}\r\n             css={props.css}\r\n             size={props.size ?? \"100\"}>\r\n            <InputLabel {...props}/>\r\n            <AutoCompletePrimeReact delay={props.searchDelay ?? 500}\r\n                                    maxLength={props.searchMax}\r\n                                    minLength={props.searchMin ?? 1}\r\n                                    suggestions={props.data ?? []}\r\n                                    value={props.value}\r\n                                    {...autocompleCore(props)}\r\n                                    {...autocompleteEvent(props)}/>\r\n            <div data-name={props.name}\r\n                 id=\"j_feedback\"/>\r\n        </Box>\r\n    );\r\n};"],"names":["Box","children","props","css","size","direction","justify","undefined","Array","isArray","join","align","attr","className","classNames","style","id","React","createElement","InputLabel","iconPrefix","label","icon","required","autocompleCore","itemTemplate","dataTemplate","field","name","forceSelection","disabled","placeholder","inputClassName","appendTo","autocompleteEvent","completeMethod","event","onSearch","query","onChange","value","onSelect","Autocomplete","AutoCompletePrimeReact","delay","searchDelay","maxLength","searchMax","minLength","searchMin","suggestions","data"],"mappings":"0HAmBO,MAAMA,EAAM,EAAGC,cAAaC,MAC/B,MAAMC,EAAM,CACRC,KAAM,YAAaF,EAAME,MAAQ,QACjCC,UAAW,iBAAiBH,EAAMG,WAAa,QAC/CC,aAA2BC,IAAlBL,EAAMI,QAAwB,GAAKE,MAAMC,QAAQP,EAAMI,SAAWJ,EAAMI,SAASI,KAAK,KAAOR,EAAMI,QAC5GK,WAAuBJ,IAAhBL,EAAMS,MAAsB,GAAKH,MAAMC,QAAQP,EAAMS,OAAST,EAAMS,OAAOD,KAAK,KAAOR,EAAMS,OAGlGC,EAA2D,CAC7DC,UAAWC,EAAW,CAClB,MACAZ,EAAMW,WAAa,GACnBV,EAAIC,KACJD,EAAIE,UACJF,EAAIG,QACJH,EAAIQ,QAERI,MAAOb,EAAMC,IACba,GAAId,EAAMc,IAGd,OACIC,EAASC,cAAA,MAAA,IAAAN,GAAcX,EAAe,EChCjCkB,EAAa,EAAGC,aAAa,YAAalB,KAM5CA,EAAMmB,OACNJ,EAAGC,cAAA,IAAA,CAAAL,UAAU,cACXX,EAAMoB,MAAQL,EAAAC,cAAA,IAAA,CAAGL,UAAWO,EAAalB,EAAMoB,KAAO,UACtDpB,EAAMmB,MACNnB,EAAMqB,UAAYN,EAAAC,cAAA,OAAA,CAAML,UAAU,eAAsB,MCX/D,SAAUW,EACZtB,GAGA,MAAMuB,EAAqDvB,EAAMwB,aAC3D,CAAED,aAAcvB,EAAMwB,cACtB,CAAE,EACR,MAAO,CACHV,GAAId,EAAMc,GACVW,MAAO,OACPC,KAAM1B,EAAM0B,KACZC,gBAAgB,EAChBd,MAAOb,EAAMC,KAAO,CAAE,EACtB2B,SAAU5B,EAAM4B,SAChBP,SAAUrB,EAAMqB,SAChBQ,YAAa7B,EAAM6B,YACnBC,eAAgB,eAChBC,SAAU/B,EAAM+B,UAAY,OAC5BpB,UAAW,mCACRY,EAEX,CCjBM,SAAUS,EAAkBhC,GAC9B,MAAO,CACH,cAAAiC,CAAeC,GACXlC,EAAMmC,SAASD,EAAME,MACxB,EACD,QAAAC,CAASH,GACLlC,EAAMqC,SAASH,EAAMI,MACxB,EACD,QAAAC,CAASL,GACDlC,EAAMuC,UACNvC,EAAMuC,SAASL,EAAMI,QAIrC,CCba,MAAAE,EAAe,KAAMxC,KAE1Be,EAAAC,cAAClB,EAAG,CAACa,UAAW,gBAAkBX,EAAMW,WAAa,IAChDV,IAAKD,EAAMC,IACXC,KAAMF,EAAME,MAAQ,OACrBa,EAACC,cAAAC,EAAe,IAAAjB,IAChBe,EAACC,cAAAyB,GAAuBC,MAAO1C,EAAM2C,aAAe,IAC5BC,UAAW5C,EAAM6C,UACjBC,UAAW9C,EAAM+C,WAAa,EAC9BC,YAAahD,EAAMiD,MAAQ,GAC3BX,MAAOtC,EAAMsC,SACThB,EAAetB,MACfgC,EAAkBhC,KAC9Ce,EAAgBC,cAAA,MAAA,CAAA,YAAAhB,EAAM0B,KACjBZ,GAAG"}
+{"version":3,"file":"index.esm.js","sources":["../../src/box/box.tsx","../../src/api/input.tsx","../../src/autocomplete/core/core.tsx","../../src/autocomplete/core/event.tsx","../../src/autocomplete/autocomplete.tsx"],"sourcesContent":["import { BoxProps } from \"./types\";\r\nimport React, { HTMLAttributes } from \"react\";\r\nimport { classNames } from \"primereact/utils\";\r\n\r\n/**\r\n * Componente - `Box`\r\n *\r\n * Um componente versátil que pode ser utilizado para criar seções ou caixas em uma página.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n *\r\n * Exemplo de uso:\r\n * ```tsx\r\n * <Box align=\"align-items-center\"\r\n *      justify=\"justify-content-end\"\r\n *      size=\"25\">\r\n *   ...conteúdo HTML\r\n * </Box>\r\n * ```\r\n */\r\nexport const Box = ({ children, ...props }: BoxProps) => {\r\n    const css = {\r\n        size: `box-size-${(props.size ?? \"100\")}`,\r\n        direction: `box-direction-${props.direction ?? \"row\"}`,\r\n        justify: props.justify === undefined ? \"\" : Array.isArray(props.justify) ? props.justify?.join(\" \") : props.justify,\r\n        align: props.align === undefined ? \"\" : Array.isArray(props.align) ? props.align?.join(\" \") : props.align\r\n    };\r\n\r\n    const attr: HTMLAttributes<\"div\"> & Omit<BoxProps, \"children\"> = {\r\n        className: classNames([\r\n            \"box\",\r\n            props.className ?? \"\",\r\n            css.size,\r\n            css.direction,\r\n            css.justify,\r\n            css.align\r\n        ]),\r\n        style: props.css,\r\n        id: props.id\r\n    };\r\n\r\n    return (\r\n        <div {...attr as any}>{children}</div>\r\n    );\r\n};","import React from \"react\";\r\nimport { ApiComponentProps, ApiFieldComponentProps } from \"./types\";\r\n\r\n/**\r\n * API - `InputLabel`\r\n *\r\n * Um componente utilizado como label em todos os componente de entrada de dados do pacote.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const InputLabel = ({ iconPrefix = \"bi bi-\", ...props }: ApiFieldComponentProps) => {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return props.label\r\n        && <p className='form-label'>\r\n            {props.icon && <i className={iconPrefix + props.icon + \" me-1\"}/>}\r\n            {props.label}\r\n            {props.required && <span className=\"text-danger\">*</span>}\r\n        </p>;\r\n};\r\n\r\n/**\r\n * API - `InputFeedback`\r\n *\r\n * Um componente utilizado como container de feedback em todos os componente de entrada de dados do pacote.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const InputFeedback = ({ errors, name, ...props }: ApiFieldComponentProps & { errors?: any }) => {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return !props.mode || props.mode === \"Controlled\"\r\n        ? <div data-name={name}\r\n               id=\"j_feedback\"/>\r\n        : <div className={(!errors[name ?? \"\"] ? \"\" : \"invalid-feedback is-invalid\")}\r\n               data-name={name ?? \"\"}\r\n               id=\"j_feedback\"\r\n               style={{ display: errors[name ?? \"\"] ? \"block\" : \"none\" }}>{!errors[name ?? \"\"] ? \"\" : errors[name ?? \"\"].message}</div>;\r\n};\r\n\r\n/**\r\n * API - `InputProps`\r\n *\r\n * Retorna o objeto com as `Props` do core dos componentes de entrada de dados\r\n */\r\nexport function InputProps<T extends ApiComponentProps & ApiFieldComponentProps & { ref: any }>(props: T) {\r\n    return {\r\n        ref: props.ref,\r\n\r\n        id: props.id,\r\n        name: props.name,\r\n        required: props.required,\r\n        disabled: props.disabled,\r\n        placeholder: props.placeholder,\r\n\r\n        className: props.className,\r\n        style: { width: \"100%\" },\r\n\r\n        keyfilter: props.keyfilter,\r\n    };\r\n}","import { AutocompleteProps } from \"../types\";\r\nimport { AutoCompleteProps as AutoCompletePropsPrimeReact } from \"primereact/autocomplete\";\r\n\r\n/**\r\n * Componente - `Autocomplete`\r\n *\r\n * Define as configurações do modo principal do autocomplete.\r\n */\r\nexport function autocompleCore(\r\n    props: AutocompleteProps\r\n): Partial<AutoCompletePropsPrimeReact> {\r\n\r\n    const itemTemplate: Partial<AutoCompletePropsPrimeReact> = props.dataTemplate\r\n        ? { itemTemplate: props.dataTemplate }\r\n        : {};\r\n    return {\r\n        id: props.id,\r\n        field: \"name\",\r\n        name: props.name,\r\n        forceSelection: props.forceSelect ?? true,\r\n        style: props.css ?? {},\r\n        disabled: props.disabled,\r\n        required: props.required,\r\n        placeholder: props.placeholder,\r\n        inputClassName: \"form-control\",\r\n        appendTo: props.appendTo ?? \"self\",\r\n        className: \"autocomplete-primereact w-100\",\r\n        ...itemTemplate\r\n    };\r\n}","import { AutocompleteProps } from \"../types\";\r\nimport {\r\n    AutoCompleteChangeEvent,\r\n    AutoCompleteCompleteEvent,\r\n    AutoCompleteProps as AutoCompletePropsPrimeReact, AutoCompleteSelectEvent\r\n} from \"primereact/autocomplete\";\r\n\r\n/**\r\n * Componente - `Autocomplete`\r\n *\r\n * Define as configuração de evento do componente\r\n */\r\nexport function autocompleteEvent(props: AutocompleteProps): Partial<AutoCompletePropsPrimeReact> {\r\n    return {\r\n        completeMethod(event: AutoCompleteCompleteEvent) {\r\n            props.onSearch(event.query);\r\n        },\r\n        onChange(event: AutoCompleteChangeEvent) {\r\n            props.onChange(event.value);\r\n        },\r\n        onSelect(event: AutoCompleteSelectEvent) {\r\n            if (props.onSelect) {\r\n                props.onSelect(event.value);\r\n            }\r\n        }\r\n    };\r\n}","import React from \"react\";\r\nimport { Box } from \"../box\";\r\nimport { InputLabel } from \"../api\";\r\nimport { AutocompleteProps } from \"./types\";\r\nimport { autocompleCore } from \"./core/core\";\r\nimport { autocompleteEvent } from \"./core/event\";\r\nimport { AutoComplete as AutoCompletePrimeReact } from \"primereact/autocomplete\";\r\n\r\n/**\r\n * Componente - `Autocomplete`\r\n *\r\n * AutoComplete é um componente de entrada que fornece sugestões em tempo real enquanto é digitado\r\n */\r\nexport const Autocomplete = ({ ...props }: AutocompleteProps) => {\r\n    return (\r\n        <Box className={\"autocomplete\" + (props.className ?? \"\")}\r\n             css={props.css}\r\n             size={props.size ?? \"100\"}>\r\n            <InputLabel {...props}/>\r\n            <AutoCompletePrimeReact delay={props.searchDelay ?? 500}\r\n                                    maxLength={props.searchMax}\r\n                                    minLength={props.searchMin ?? 1}\r\n                                    suggestions={props.data ?? []}\r\n                                    value={props.value}\r\n                                    {...autocompleCore(props)}\r\n                                    {...autocompleteEvent(props)}/>\r\n            <div data-name={props.name}\r\n                 id=\"j_feedback\"/>\r\n        </Box>\r\n    );\r\n};"],"names":["Box","children","props","css","size","direction","justify","undefined","Array","isArray","join","align","attr","className","classNames","style","id","React","createElement","InputLabel","iconPrefix","label","icon","required","autocompleCore","itemTemplate","dataTemplate","field","name","forceSelection","forceSelect","disabled","placeholder","inputClassName","appendTo","autocompleteEvent","completeMethod","event","onSearch","query","onChange","value","onSelect","Autocomplete","AutoCompletePrimeReact","delay","searchDelay","maxLength","searchMax","minLength","searchMin","suggestions","data"],"mappings":"0HAmBO,MAAMA,EAAM,EAAGC,cAAaC,MAC/B,MAAMC,EAAM,CACRC,KAAM,YAAaF,EAAME,MAAQ,QACjCC,UAAW,iBAAiBH,EAAMG,WAAa,QAC/CC,aAA2BC,IAAlBL,EAAMI,QAAwB,GAAKE,MAAMC,QAAQP,EAAMI,SAAWJ,EAAMI,SAASI,KAAK,KAAOR,EAAMI,QAC5GK,WAAuBJ,IAAhBL,EAAMS,MAAsB,GAAKH,MAAMC,QAAQP,EAAMS,OAAST,EAAMS,OAAOD,KAAK,KAAOR,EAAMS,OAGlGC,EAA2D,CAC7DC,UAAWC,EAAW,CAClB,MACAZ,EAAMW,WAAa,GACnBV,EAAIC,KACJD,EAAIE,UACJF,EAAIG,QACJH,EAAIQ,QAERI,MAAOb,EAAMC,IACba,GAAId,EAAMc,IAGd,OACIC,EAASC,cAAA,MAAA,IAAAN,GAAcX,EAAe,EChCjCkB,EAAa,EAAGC,aAAa,YAAalB,KAM5CA,EAAMmB,OACNJ,EAAGC,cAAA,IAAA,CAAAL,UAAU,cACXX,EAAMoB,MAAQL,EAAAC,cAAA,IAAA,CAAGL,UAAWO,EAAalB,EAAMoB,KAAO,UACtDpB,EAAMmB,MACNnB,EAAMqB,UAAYN,EAAAC,cAAA,OAAA,CAAML,UAAU,eAAsB,MCX/D,SAAUW,EACZtB,GAGA,MAAMuB,EAAqDvB,EAAMwB,aAC3D,CAAED,aAAcvB,EAAMwB,cACtB,CAAE,EACR,MAAO,CACHV,GAAId,EAAMc,GACVW,MAAO,OACPC,KAAM1B,EAAM0B,KACZC,eAAgB3B,EAAM4B,cAAe,EACrCf,MAAOb,EAAMC,KAAO,CAAE,EACtB4B,SAAU7B,EAAM6B,SAChBR,SAAUrB,EAAMqB,SAChBS,YAAa9B,EAAM8B,YACnBC,eAAgB,eAChBC,SAAUhC,EAAMgC,UAAY,OAC5BrB,UAAW,mCACRY,EAEX,CCjBM,SAAUU,EAAkBjC,GAC9B,MAAO,CACH,cAAAkC,CAAeC,GACXnC,EAAMoC,SAASD,EAAME,MACxB,EACD,QAAAC,CAASH,GACLnC,EAAMsC,SAASH,EAAMI,MACxB,EACD,QAAAC,CAASL,GACDnC,EAAMwC,UACNxC,EAAMwC,SAASL,EAAMI,QAIrC,CCba,MAAAE,EAAe,KAAMzC,KAE1Be,EAAAC,cAAClB,EAAG,CAACa,UAAW,gBAAkBX,EAAMW,WAAa,IAChDV,IAAKD,EAAMC,IACXC,KAAMF,EAAME,MAAQ,OACrBa,EAACC,cAAAC,EAAe,IAAAjB,IAChBe,EAACC,cAAA0B,GAAuBC,MAAO3C,EAAM4C,aAAe,IAC5BC,UAAW7C,EAAM8C,UACjBC,UAAW/C,EAAMgD,WAAa,EAC9BC,YAAajD,EAAMkD,MAAQ,GAC3BX,MAAOvC,EAAMuC,SACTjB,EAAetB,MACfiC,EAAkBjC,KAC9Ce,EAAgBC,cAAA,MAAA,CAAA,YAAAhB,EAAM0B,KACjBZ,GAAG"}

package/button/_button.scss

@@ -0,0 +1,56 @@
+$box-sizes: (
+        '5': 5%,
+        '10': 10%,
+        '12-5':12.5%,
+        '15': 15%,
+        '17-5':17.5%,
+        '20': 20%,
+        '22-5':25.5%,
+        '25': 25%,
+        '30': 30%,
+        '33': 33%,
+        '35': 35%,
+        '40': 40%,
+        '45': 45%,
+        '50': 50%,
+        '55': 55%,
+        '60': 60%,
+        '65': 65%,
+        '70': 70%,
+        '75': 75%,
+        '80': 80%,
+        '85': 85%,
+        '90': 90%,
+        '95': 95%,
+        '100': 100%
+) !default;
+
+$box-space-margin: .5rem !default;
+$box-space-padding: .5rem !default;
+
+.box {
+  display: flex;
+  flex-wrap: wrap;
+  position: relative;
+
+  @each $key, $value in $box-sizes {
+    &.box-size-#{$key} {
+      width: calc(var(--box-size-#{$key}, #{$value}) - #{$box-space-margin});
+      margin: calc(#{$box-space-margin} / 2) calc(#{$box-space-margin} / 2);
+      padding: #{$box-space-padding};
+
+      @media (max-width: 576px) {
+        width: calc(100% - #{$box-space-margin});
+      }
+    }
+  }
+
+  &.box-direction-row {
+    flex-direction: row;
+  }
+
+  &.box-direction-column {
+    flex-direction: column;
+  }
+}
+

package/button/index.cjs.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react"),i=require("primereact/button");exports.Button=({...a})=>e.createElement(i.Button,{badge:a.badge,badgeClassName:a.badgeClassName,className:a.className,disabled:a.disabled,icon:void 0!==a.icon?`${a.iconPrefix??"bi bi-"}${a.icon??""} ${a.label?"me-1":""}`:void 0,iconPos:a.iconPos,id:a.id,label:a.label,link:a.isLink,loading:a.isLoading,pt:{loadingIcon:{className:"me-1"}},ref:a.ref,severity:a.color,size:a.size,style:a.css,type:a.type,onClick:a.onClick});
+//# sourceMappingURL=index.cjs.js.map

package/button/index.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs.js","sources":["../../src/button/button.tsx"],"sourcesContent":["import React from \"react\";\r\nimport { ButtonProps } from \"./types\";\r\nimport { Button as ButtonPrimeReact } from \"primereact/button\";\r\n\r\n/**\r\n * Componente - `Button`\r\n *\r\n * Um componente versátil que pode ser utilizado para realizar ações por exemplo em formulários de dados.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const Button = ({ ...props }: ButtonProps) => {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return (\r\n        <ButtonPrimeReact badge={props.badge}\r\n                          badgeClassName={props.badgeClassName}\r\n                          className={props.className}\r\n                          disabled={props.disabled}\r\n                          icon={props.icon !== undefined ? `${props.iconPrefix ?? \"bi bi-\"}${props.icon ?? \"\"} ${props.label ? \"me-1\" : \"\"}` : undefined}\r\n                          iconPos={props.iconPos}\r\n                          id={props.id}\r\n                          label={props.label}\r\n                          link={props.isLink}\r\n                          loading={props.isLoading}\r\n                          pt={{ loadingIcon: { className: \"me-1\" } }}\r\n                          ref={props.ref}\r\n                          severity={props.color}\r\n                          size={props.size}\r\n                          style={props.css}\r\n                          type={props.type}\r\n                          onClick={props.onClick}/>\r\n    );\r\n};"],"names":["props","React","createElement","ButtonPrimeReact","Button","badge","badgeClassName","className","disabled","icon","undefined","iconPrefix","label","iconPos","id","link","isLink","loading","isLoading","pt","loadingIcon","ref","severity","color","size","style","css","type","onClick"],"mappings":"kFAUsB,KAAMA,KAOpBC,EAAAC,cAACC,EAAgBC,OAAA,CAACC,MAAOL,EAAMK,MACbC,eAAgBN,EAAMM,eACtBC,UAAWP,EAAMO,UACjBC,SAAUR,EAAMQ,SAChBC,UAAqBC,IAAfV,EAAMS,KAAqB,GAAGT,EAAMW,YAAc,WAAWX,EAAMS,MAAQ,MAAMT,EAAMY,MAAQ,OAAS,UAAOF,EACrHG,QAASb,EAAMa,QACfC,GAAId,EAAMc,GACVF,MAAOZ,EAAMY,MACbG,KAAMf,EAAMgB,OACZC,QAASjB,EAAMkB,UACfC,GAAI,CAAEC,YAAa,CAAEb,UAAW,SAChCc,IAAKrB,EAAMqB,IACXC,SAAUtB,EAAMuB,MAChBC,KAAMxB,EAAMwB,KACZC,MAAOzB,EAAM0B,IACbC,KAAM3B,EAAM2B,KACZC,QAAS5B,EAAM4B"}

package/button/index.d.ts

@@ -0,0 +1,109 @@
+import React, { CSSProperties, Ref } from 'react';
+
+/**
+ * Define as tipagens `default` de todos os componentes do pacote
+ */
+interface ApiComponentProps {
+
+    /**
+     * Propriedade para identificar o id do elemento
+     */
+    id?: string
+
+    /**
+     * Adiciona no atributo `class` do componente o valor atribuido nessa propriedade
+     */
+    className?: string
+
+    /**
+     * Define o tamanho da box do componente de acordo com o valores abaixo
+     */
+    size?: "5" | "10" | "12-5" | "15" | "17-5" | "20" | "22-5" | "25" | "30" | "33" | "35" | "40" | "45" | "50" | "55" | "60" | "65" | "70" | "75" | "80" | "85" | "90" | "95" | "100"
+
+    /**
+     * Define as propriedades css do component `style`
+     */
+    css?: CSSProperties
+}
+
+interface ButtonProps extends Omit<ApiComponentProps, "size"> {
+    /**
+     * Define o objeto de referência do botão
+     */
+    ref?: Ref<any>
+
+    /**
+     * Define o tipo do botão
+     */
+    type?: "submit" | "reset" | "button";
+
+    /**
+     * Define o legenda do botão
+     */
+    label?: string
+
+    /**
+     * Desabilita a ação no botão
+     */
+    disabled?: boolean
+
+    /**
+     * Define o tamanho do botão
+     */
+    size?: "small" | "large";
+
+    /**
+     * Define o conteúdo do badge dentro do botão
+     */
+    badge?: string
+
+    /**
+     * Define a classe de estilização do badge de do botão
+     */
+    badgeClassName?: string
+
+    /**
+     * Define se o botão vai ser do tipo link
+     */
+    isLink?: boolean
+
+    /**
+     * Define se botão está estado de loading
+     */
+    isLoading?: boolean
+
+    /**
+     * Define o prefixo dos icones do pacote
+     */
+    iconPrefix?: "bi bi-" | "pi pi-"
+
+    /**
+     * Define o icone que vai ser utilizando no botão
+     */
+    icon?: string
+
+    /**
+     * Define a posição do icone dentro do botão
+     */
+    iconPos?: "top" | "bottom" | "left" | "right";
+
+    /**
+     * Define a cor do botão
+     */
+    color?: "secondary" | "success" | "info" | "warning" | "danger" | "help" | "contrast";
+
+    /**
+     * Evento de click dentro do botão
+     */
+    onClick?: () => void
+}
+
+/**
+ * Componente - `Button`
+ *
+ * Um componente versátil que pode ser utilizado para realizar ações por exemplo em formulários de dados.
+ * Permite personalizar o estilo e o conteúdo através de propriedades.
+ */
+declare const Button: ({ ...props }: ButtonProps) => React.JSX.Element;
+
+export { Button };

package/button/index.esm.js

@@ -0,0 +1,2 @@
+import e from"react";import{Button as i}from"primereact/button";const a=({...a})=>e.createElement(i,{badge:a.badge,badgeClassName:a.badgeClassName,className:a.className,disabled:a.disabled,icon:void 0!==a.icon?`${a.iconPrefix??"bi bi-"}${a.icon??""} ${a.label?"me-1":""}`:void 0,iconPos:a.iconPos,id:a.id,label:a.label,link:a.isLink,loading:a.isLoading,pt:{loadingIcon:{className:"me-1"}},ref:a.ref,severity:a.color,size:a.size,style:a.css,type:a.type,onClick:a.onClick});export{a as Button};
+//# sourceMappingURL=index.esm.js.map

package/button/index.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":["../../src/button/button.tsx"],"sourcesContent":["import React from \"react\";\r\nimport { ButtonProps } from \"./types\";\r\nimport { Button as ButtonPrimeReact } from \"primereact/button\";\r\n\r\n/**\r\n * Componente - `Button`\r\n *\r\n * Um componente versátil que pode ser utilizado para realizar ações por exemplo em formulários de dados.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const Button = ({ ...props }: ButtonProps) => {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return (\r\n        <ButtonPrimeReact badge={props.badge}\r\n                          badgeClassName={props.badgeClassName}\r\n                          className={props.className}\r\n                          disabled={props.disabled}\r\n                          icon={props.icon !== undefined ? `${props.iconPrefix ?? \"bi bi-\"}${props.icon ?? \"\"} ${props.label ? \"me-1\" : \"\"}` : undefined}\r\n                          iconPos={props.iconPos}\r\n                          id={props.id}\r\n                          label={props.label}\r\n                          link={props.isLink}\r\n                          loading={props.isLoading}\r\n                          pt={{ loadingIcon: { className: \"me-1\" } }}\r\n                          ref={props.ref}\r\n                          severity={props.color}\r\n                          size={props.size}\r\n                          style={props.css}\r\n                          type={props.type}\r\n                          onClick={props.onClick}/>\r\n    );\r\n};"],"names":["Button","props","React","createElement","ButtonPrimeReact","badge","badgeClassName","className","disabled","icon","undefined","iconPrefix","label","iconPos","id","link","isLink","loading","isLoading","pt","loadingIcon","ref","severity","color","size","style","css","type","onClick"],"mappings":"gEAUa,MAAAA,EAAS,KAAMC,KAOpBC,EAAAC,cAACC,EAAgB,CAACC,MAAOJ,EAAMI,MACbC,eAAgBL,EAAMK,eACtBC,UAAWN,EAAMM,UACjBC,SAAUP,EAAMO,SAChBC,UAAqBC,IAAfT,EAAMQ,KAAqB,GAAGR,EAAMU,YAAc,WAAWV,EAAMQ,MAAQ,MAAMR,EAAMW,MAAQ,OAAS,UAAOF,EACrHG,QAASZ,EAAMY,QACfC,GAAIb,EAAMa,GACVF,MAAOX,EAAMW,MACbG,KAAMd,EAAMe,OACZC,QAAShB,EAAMiB,UACfC,GAAI,CAAEC,YAAa,CAAEb,UAAW,SAChCc,IAAKpB,EAAMoB,IACXC,SAAUrB,EAAMsB,MAChBC,KAAMvB,EAAMuB,KACZC,MAAOxB,EAAMyB,IACbC,KAAM1B,EAAM0B,KACZC,QAAS3B,EAAM2B"}

package/button/package.json

@@ -0,0 +1,5 @@
+{
+  "main": "./index.cjs.js",
+  "module": "./index.esm.js",
+  "types": "./index.d.ts"
+}