@orangesix/react 1.1.1 → 1.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (81) hide show
  1. package/api/index.cjs.js +1 -1
  2. package/api/index.cjs.js.map +1 -1
  3. package/api/index.d.ts +100 -3
  4. package/api/index.esm.js +1 -1
  5. package/api/index.esm.js.map +1 -1
  6. package/autocomplete/index.cjs.js.map +1 -1
  7. package/autocomplete/index.d.ts +17 -1
  8. package/autocomplete/index.esm.js.map +1 -1
  9. package/editor/index.cjs.js +1 -1
  10. package/editor/index.cjs.js.map +1 -1
  11. package/editor/index.d.ts +17 -1
  12. package/editor/index.esm.js +1 -1
  13. package/editor/index.esm.js.map +1 -1
  14. package/input/index.cjs.js +2 -0
  15. package/input/index.cjs.js.map +1 -0
  16. package/input/index.d.ts +210 -0
  17. package/input/index.esm.js +2 -0
  18. package/input/index.esm.js.map +1 -0
  19. package/input/package.json +5 -0
  20. package/inputfilter/index.cjs.js.map +1 -1
  21. package/inputfilter/index.d.ts +17 -1
  22. package/inputfilter/index.esm.js.map +1 -1
  23. package/loading/_loading.scss +10 -0
  24. package/loading/index.cjs.js +2 -0
  25. package/loading/index.cjs.js.map +1 -0
  26. package/loading/index.d.ts +172 -0
  27. package/loading/index.esm.js +2 -0
  28. package/loading/index.esm.js.map +1 -0
  29. package/loading/package.json +5 -0
  30. package/modal/index.cjs.js +2 -0
  31. package/modal/index.cjs.js.map +1 -0
  32. package/modal/index.d.ts +68 -0
  33. package/modal/index.esm.js +2 -0
  34. package/modal/index.esm.js.map +1 -0
  35. package/modal/package.json +5 -0
  36. package/package.json +15 -4
  37. package/picklist/index.cjs.js +2 -0
  38. package/picklist/index.cjs.js.map +1 -0
  39. package/picklist/index.d.ts +73 -0
  40. package/picklist/index.esm.js +2 -0
  41. package/picklist/index.esm.js.map +1 -0
  42. package/picklist/package.json +5 -0
  43. package/radio/index.cjs.js +2 -0
  44. package/radio/index.cjs.js.map +1 -0
  45. package/radio/index.d.ts +188 -0
  46. package/radio/index.esm.js +2 -0
  47. package/radio/index.esm.js.map +1 -0
  48. package/radio/package.json +5 -0
  49. package/select/index.cjs.js +2 -0
  50. package/select/index.cjs.js.map +1 -0
  51. package/select/index.d.ts +195 -0
  52. package/select/index.esm.js +2 -0
  53. package/select/index.esm.js.map +1 -0
  54. package/select/package.json +5 -0
  55. package/style/scss/_variables.scss +4 -0
  56. package/style/scss/bootstrap.scss +1 -0
  57. package/style/scss/components/button/_button.scss +494 -494
  58. package/style/scss/components/data/_datatable.scss +1 -0
  59. package/style/scss/components/data/_picklist.scss +61 -61
  60. package/style/scss/components/input/_iconfield.scss +5 -4
  61. package/style/scss/components/input/_inputswitch.scss +80 -70
  62. package/style/scss/core/_mixins.scss +195 -195
  63. package/style/scss/core/_reset.scss +75 -74
  64. package/switch/index.cjs.js +2 -0
  65. package/switch/index.cjs.js.map +1 -0
  66. package/switch/index.d.ts +169 -0
  67. package/switch/index.esm.js +2 -0
  68. package/switch/index.esm.js.map +1 -0
  69. package/switch/package.json +5 -0
  70. package/table/index.cjs.js +1 -1
  71. package/table/index.cjs.js.map +1 -1
  72. package/table/index.d.ts +14 -1
  73. package/table/index.esm.js +1 -1
  74. package/table/index.esm.js.map +1 -1
  75. package/tabview/index.d.ts +17 -1
  76. package/textarea/index.cjs.js +2 -0
  77. package/textarea/index.cjs.js.map +1 -0
  78. package/textarea/index.d.ts +165 -0
  79. package/textarea/index.esm.js +2 -0
  80. package/textarea/index.esm.js.map +1 -0
  81. package/textarea/package.json +5 -0
package/api/index.cjs.js CHANGED
@@ -1,2 +1,2 @@
1
- "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"},"*"));
1
+ "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}};
2
2
  //# sourceMappingURL=index.cjs.js.map
@@ -1 +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"}
1
+ {"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 CHANGED
@@ -1,4 +1,7 @@
1
1
  import React, { CSSProperties } from 'react';
2
+ import { Control } from 'react-hook-form';
3
+ import * as primereact_keyfilter from 'primereact/keyfilter';
4
+ import { KeyFilterType } from 'primereact/keyfilter';
2
5
 
3
6
  /**
4
7
  * Realiza o mapeamento dos valores da propriedades css `align-items`
@@ -103,7 +106,12 @@ interface ApiComponentProps {
103
106
  }
104
107
 
105
108
  /**
106
- * Define as tipagens ´default´ de tidos os componente de entrada de dados do pacote
109
+ * Define o modo do componente de entrada de dados
110
+ */
111
+ type ApiFieldModeProps = "Controlled" | "HookForm";
112
+
113
+ /**
114
+ * Define os tipos `default` para componente de entrada de dados
107
115
  */
108
116
  interface ApiFieldComponentProps {
109
117
 
@@ -146,19 +154,108 @@ interface ApiFieldComponentProps {
146
154
  * Desabilita a entrada de dados no campo
147
155
  */
148
156
  disabled?: boolean
157
+
158
+ /**
159
+ * Define o modo do componente de entrada de dados
160
+ */
161
+ mode?: ApiFieldModeProps
162
+
163
+ /**
164
+ * Define a opção de filtro de dados do componente
165
+ */
166
+ keyfilter?: KeyFilterType;
167
+ }
168
+
169
+ /**
170
+ * Define os tipos `default` para componente de entrada de dados controlled
171
+ */
172
+ interface ApiFieldControlledProps {
173
+
174
+ /**
175
+ * Define o valor do componente controlado
176
+ */
177
+ value: any
178
+
179
+ /**
180
+ * Função para alterar o valor do componente controlado
181
+ */
182
+ onChange(value: any): void
183
+
184
+ /**
185
+ * Função quando um usuário sai de um componente controlado
186
+ */
187
+ onBlur?: (value: any) => void
188
+ }
189
+
190
+ /**
191
+ * Define os tipos `default` para componente de entrada de dados HookFomr
192
+ */
193
+ interface ApiFieldHookFormProps {
194
+
195
+ /**
196
+ * Define o nome do campo
197
+ */
198
+ name: string
199
+
200
+ /**
201
+ * Objeto de controle do HookForm
202
+ */
203
+ control: Control<any>
204
+
205
+ /**
206
+ * Função executada quando o valor é modificado
207
+ */
208
+ onChange?: (value: any) => void
209
+
210
+ /**
211
+ * Função executada quando um usuário sai de um componente
212
+ */
213
+ onBlur?: (value: any) => void
149
214
  }
150
215
 
151
216
  /**
152
217
  * API - `InputLabel`
153
218
  *
154
- * Um componente utilizado como label em todos os componente de campo do pacote.
219
+ * Um componente utilizado como label em todos os componente de entrada de dados do pacote.
155
220
  * Permite personalizar o estilo e o conteúdo através de propriedades.
156
221
  */
157
222
  declare const InputLabel: ({ iconPrefix, ...props }: ApiFieldComponentProps) => "" | React.JSX.Element | undefined;
223
+ /**
224
+ * API - `InputFeedback`
225
+ *
226
+ * Um componente utilizado como container de feedback em todos os componente de entrada de dados do pacote.
227
+ * Permite personalizar o estilo e o conteúdo através de propriedades.
228
+ */
229
+ declare const InputFeedback: ({ errors, name, ...props }: ApiFieldComponentProps & {
230
+ errors?: any;
231
+ }) => React.JSX.Element;
232
+ /**
233
+ * API - `InputProps`
234
+ *
235
+ * Retorna o objeto com as `Props` do core dos componentes de entrada de dados
236
+ */
237
+ declare function InputProps<T extends ApiComponentProps & ApiFieldComponentProps & {
238
+ ref: any;
239
+ }>(props: T): {
240
+ ref: any;
241
+ id: string | undefined;
242
+ name: string | undefined;
243
+ required: boolean | undefined;
244
+ disabled: boolean | undefined;
245
+ placeholder: string | undefined;
246
+ className: string | undefined;
247
+ style: {
248
+ width: string;
249
+ };
250
+ keyfilter: primereact_keyfilter.KeyFilterType | undefined;
251
+ };
158
252
 
159
253
  type IAlignItemsProps = AlignItemsProps;
160
254
  type IAPIComponentProps = ApiComponentProps;
161
255
  type IJustifyContentProps = JustifyContentProps;
256
+ type TApiFieldModeProps = ApiFieldModeProps;
257
+ type TApiFieldHookFormProps = ApiFieldHookFormProps;
162
258
  type IApiFieldComponentProps = ApiFieldComponentProps;
259
+ type IApiFieldControlledProps = ApiFieldControlledProps;
163
260
 
164
- export { type IAPIComponentProps, type IAlignItemsProps, type IApiFieldComponentProps, type IJustifyContentProps, InputLabel };
261
+ export { type IAPIComponentProps, type IAlignItemsProps, type IApiFieldComponentProps, type IApiFieldControlledProps, type IJustifyContentProps, InputFeedback, InputLabel, InputProps, type TApiFieldHookFormProps, type TApiFieldModeProps };
package/api/index.esm.js CHANGED
@@ -1,2 +1,2 @@
1
- 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};
1
+ 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};
2
2
  //# sourceMappingURL=index.esm.js.map
@@ -1 +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"}
1
+ {"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"}
@@ -1 +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"}
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 { 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: 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"}
@@ -1,4 +1,5 @@
1
1
  import React, { CSSProperties } from 'react';
2
+ import { KeyFilterType } from 'primereact/keyfilter';
2
3
 
3
4
  /**
4
5
  * Define as tipagens `default` de todos os componentes do pacote
@@ -27,7 +28,12 @@ interface ApiComponentProps {
27
28
  }
28
29
 
29
30
  /**
30
- * Define as tipagens ´default´ de tidos os componente de entrada de dados do pacote
31
+ * Define o modo do componente de entrada de dados
32
+ */
33
+ type ApiFieldModeProps = "Controlled" | "HookForm";
34
+
35
+ /**
36
+ * Define os tipos `default` para componente de entrada de dados
31
37
  */
32
38
  interface ApiFieldComponentProps {
33
39
 
@@ -70,6 +76,16 @@ interface ApiFieldComponentProps {
70
76
  * Desabilita a entrada de dados no campo
71
77
  */
72
78
  disabled?: boolean
79
+
80
+ /**
81
+ * Define o modo do componente de entrada de dados
82
+ */
83
+ mode?: ApiFieldModeProps
84
+
85
+ /**
86
+ * Define a opção de filtro de dados do componente
87
+ */
88
+ keyfilter?: KeyFilterType;
73
89
  }
74
90
 
75
91
  interface AutocompleteDataProps {
@@ -1 +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"}
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 { 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: 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"}
@@ -1,2 +1,2 @@
1
- "use strict";var e=require("react"),t=require("primereact/utils"),i=require("@tiptap/extension-link"),a=require("@tiptap/extension-image"),r=require("@tiptap/starter-kit"),l=require("@tiptap/extension-color"),n=require("@tiptap/extension-underline"),c=require("@tiptap/extension-highlight"),s=require("@tiptap/extension-text-style"),o=require("@tiptap/react");const m=({children:i,...a})=>{const r={size:`box-size-${a.size??"100"}`,direction:`box-direction-${a.direction??"row"}`,justify:void 0===a.justify?"":Array.isArray(a.justify)?a.justify?.join(" "):a.justify,align:void 0===a.align?"":Array.isArray(a.align)?a.align?.join(" "):a.align},l={className:t.classNames(["box",a.className??"",r.size,r.direction,r.justify,r.align]),style:a.css,id:a.id};return e.createElement("div",{...l},i)},d=({editor:t,active:i})=>i&&e.createElement(e.Fragment,null,e.createElement("a",{className:"editor-menu-item"+(t.isActive("heading",{level:1})?" active":""),href:"#",style:{fontSize:".975em"},onClick:e=>{e.preventDefault(),t.chain().focus().toggleHeading({level:1}).run()}},e.createElement("i",{className:"bi bi-type-h1"})),e.createElement("a",{className:"editor-menu-item"+(t.isActive("heading",{level:2})?" active":""),href:"#",style:{fontSize:".975em"},onClick:e=>{e.preventDefault(),t.chain().focus().toggleHeading({level:2}).run()}},e.createElement("i",{className:"bi bi-type-h2"})),e.createElement("a",{className:"editor-menu-item"+(t.isActive("heading",{level:3})?" active":""),href:"#",style:{fontSize:".975em"},onClick:e=>{e.preventDefault(),t.chain().focus().toggleHeading({level:3}).run()}},e.createElement("i",{className:"bi bi-type-h3"}))),u=({editor:t,active:i})=>{const[a,r]=e.useState(!1),[l,n]=e.useState("");return e.useEffect((()=>{n("")}),[a]),i&&e.createElement(e.Fragment,null,e.createElement("a",{className:"editor-menu-item"+(t.isActive("link")?" active":""),href:"#",onClick:e=>{e.preventDefault(),t.isActive("link")?t.chain().focus().unsetLink().run():r(!a)}},e.createElement("i",{className:"bi bi-link"})),a&&e.createElement("div",{className:"editor-link"},e.createElement("input",{className:"form-control form-control-sm",placeholder:"https://example.com.br",style:{fontSize:".8em",flex:1},type:"text",value:l,onChange:e=>n(e.target.value)}),e.createElement("a",{className:"text-primary ms-2",href:"#",style:{fontSize:".8em"},onClick:e=>{e.preventDefault(),""===l?t.chain().focus().extendMarkRange("link").unsetLink().run():t.chain().focus().extendMarkRange("link").setLink({href:l}).run(),r(!1)}},e.createElement("i",{className:"bi bi-save me-1"}),"Save")))},v=({editor:t,active:i})=>i&&e.createElement("a",{className:"editor-menu-item"+(t.isActive("bold")?" active":""),href:"#",onClick:e=>{e.preventDefault(),t.chain().focus().toggleBold().run()}},e.createElement("i",{className:"bi bi-type-bold"})),g=({editor:t,active:i})=>i&&e.createElement("a",{className:"editor-menu-item"+(t.isActive("code")?" active":""),href:"#",style:{fontSize:".975em"},onClick:e=>{e.preventDefault(),t.chain().focus().toggleCode().run()}},e.createElement("i",{className:"bi bi-code-slash"})),f=({editor:t,active:i})=>i&&e.createElement("input",{style:{width:"22px",height:"20px",borderRadius:"5px",margin:"auto 2.5px",border:"2px solid var(--editor-border-color)"},type:"color",value:t.getAttributes("textStyle").color??"#000000",onChange:e=>t.chain().focus().setColor(e.target.value).run()}),p=({editor:t,active:i})=>{const[a,r]=e.useState(null),l=e=>{const i=(e.clipboardData||e.originalEvent.clipboardData).items;for(const e of i)if(0===e.type.indexOf("image")){const i=e.getAsFile(),a=new FileReader;a.onload=e=>{t.chain().focus().setImage({src:e?.target?.result}).run()},a.readAsDataURL(i)}};return e.useEffect((()=>(null!==t.view.dom.parentNode&&i&&t.view.dom.parentNode.addEventListener("paste",l),()=>{t.view.dom.parentNode?.removeEventListener("paste",l)})),[]),e.useEffect((()=>{if(void 0!==a?.name){const e=new FileReader;e.readAsDataURL(a),e.onload=()=>{t.chain().focus().setImage({src:e.result}).run()}}}),[a]),i&&e.createElement("div",{className:"editor-image"},e.createElement("input",{accept:"image/png, image/jpeg",name:"editor-image",type:"file",onChange:e=>r(e.target.files?.[0])}),e.createElement("a",{className:"editor-menu-item"+(t.isActive("link")?" active":""),href:"#",style:{fontSize:".975em"},onClick:e=>{e.preventDefault()}},e.createElement("i",{className:"bi bi-image"})))},h=({editor:t,active:i})=>i&&e.createElement("a",{className:"editor-menu-item"+(t.isActive("italic")?" active":""),href:"#",onClick:e=>{e.preventDefault(),t.chain().focus().toggleItalic().run()}},e.createElement("i",{className:"bi bi-type-italic"})),E=({editor:t,active:i})=>i&&e.createElement("a",{className:"editor-menu-item"+(t.isActive("strike")?" active":""),href:"#",onClick:e=>{e.preventDefault(),t.chain().focus().toggleStrike().run()}},e.createElement("i",{className:"bi bi-type-strikethrough"})),b=({editor:t,active:i})=>i&&e.createElement("a",{className:"editor-menu-item"+(t.isActive("orderedList")?" active":""),href:"#",onClick:e=>{e.preventDefault(),t.chain().focus().toggleOrderedList().run()}},e.createElement("i",{className:"bi bi-list-ol"})),N=({editor:t,active:i})=>i&&e.createElement("a",{className:"editor-menu-item"+(t.isActive("underline")?" active":""),href:"#",onClick:e=>{e.preventDefault(),t.chain().focus().toggleUnderline().run()}},e.createElement("i",{className:"bi bi-type-underline"})),k=({editor:t,active:i})=>i&&e.createElement("a",{className:"editor-menu-item"+(t.isActive("highlight")?" active":""),href:"#",style:{fontSize:".975em"},onClick:e=>{e.preventDefault(),t.chain().focus().toggleHighlight().run()}},e.createElement("i",{className:"bi bi-highlighter"})),y=({editor:t,active:i})=>i&&e.createElement("a",{className:"editor-menu-item"+(t.isActive("bulletList")?" active":""),href:"#",onClick:e=>{e.preventDefault(),t.chain().focus().toggleBulletList().run()}},e.createElement("i",{className:"bi bi-list-task"})),x=({editor:t,options:i})=>e.createElement("div",{className:"editor-menu"},e.createElement("div",{className:"editor-menu-group"},e.createElement(d,{active:i.text,editor:t}),e.createElement(v,{active:i.bold,editor:t}),e.createElement(h,{active:i.italic,editor:t}),e.createElement(f,{active:i.color,editor:t}),e.createElement(E,{active:i.strike,editor:t}),e.createElement(N,{active:i.underline,editor:t}),e.createElement(g,{active:i.code,editor:t}),e.createElement(k,{active:i.highlight,editor:t})),e.createElement("div",{className:"editor-menu-group"},e.createElement(y,{active:i.bulletlist,editor:t}),e.createElement(b,{active:i.orderlist,editor:t}),e.createElement(u,{active:i.link,editor:t}),e.createElement(p,{active:i.image,editor:t}))),A=({iconPrefix:t="bi bi-",...i})=>i.label&&e.createElement("p",{className:"form-label"},i.icon&&e.createElement("i",{className:t+i.icon+" me-1"}),i.label,i.required&&e.createElement("span",{className:"text-danger"},"*")),C={text:!0,bold:!0,italic:!0,color:!0,strike:!1,underline:!1,code:!1,highlight:!1,bulletlist:!1,orderlist:!1,link:!1,image:!1},D={text:!0,bold:!0,italic:!0,color:!0,strike:!0,underline:!0,code:!0,highlight:!0,bulletlist:!0,orderlist:!0,link:!0,image:!0};exports.Editor=({options:t="basic",iconPrefix:d="bi bi-",...u})=>{const[v,g]=e.useState(!1),f=o.useEditor({extensions:[r,n,c,l.Color,s,i.configure({validate:e=>/^https?:\/\//.test(e),HTMLAttributes:{rel:""}}),a.configure({allowBase64:!0})],editable:!u.disabled,content:u.value??"",onFocus:()=>g(!0),onBlur:()=>g(!1),onUpdate:({editor:e})=>{u.onChange(e.getHTML())}});return f?(e.useEffect((()=>{f&&!v&&f?.commands.setContent(u.value)}),[u.value]),e.createElement(m,{className:u.className,css:u.css,size:u.size??"100"},e.createElement(A,{...u}),e.createElement("div",{className:"editor-container"},!u.disabled&&e.createElement(x,{editor:f,options:"basic"===t?C:"full"===t?D:t}),e.createElement(o.EditorContent,{className:"editor",disabled:u.disabled,editor:f,id:u.id,name:u.name,style:{minHeight:(u.height??100)+"px"}})),e.createElement("div",{"data-name":u.name,id:"j_feedback"}))):(console.error("Não foi possível realizar o carregamento do editor de texto."),null)};
1
+ "use strict";var e=require("react"),t=require("primereact/utils"),i=require("@tiptap/extension-link"),a=require("@tiptap/extension-image"),r=require("@tiptap/starter-kit"),l=require("@tiptap/extension-color"),n=require("@tiptap/extension-underline"),c=require("@tiptap/extension-highlight"),s=require("@tiptap/extension-text-style"),o=require("@tiptap/react");const m=({children:i,...a})=>{const r={size:`box-size-${a.size??"100"}`,direction:`box-direction-${a.direction??"row"}`,justify:void 0===a.justify?"":Array.isArray(a.justify)?a.justify?.join(" "):a.justify,align:void 0===a.align?"":Array.isArray(a.align)?a.align?.join(" "):a.align},l={className:t.classNames(["box",a.className??"",r.size,r.direction,r.justify,r.align]),style:a.css,id:a.id};return e.createElement("div",{...l},i)},d=({editor:t,active:i})=>i&&e.createElement(e.Fragment,null,e.createElement("a",{className:"editor-menu-item"+(t.isActive("heading",{level:1})?" active":""),href:"#",style:{fontSize:".975em"},onClick:e=>{e.preventDefault(),t.chain().focus().toggleHeading({level:1}).run()}},e.createElement("i",{className:"bi bi-type-h1"})),e.createElement("a",{className:"editor-menu-item"+(t.isActive("heading",{level:2})?" active":""),href:"#",style:{fontSize:".975em"},onClick:e=>{e.preventDefault(),t.chain().focus().toggleHeading({level:2}).run()}},e.createElement("i",{className:"bi bi-type-h2"})),e.createElement("a",{className:"editor-menu-item"+(t.isActive("heading",{level:3})?" active":""),href:"#",style:{fontSize:".975em"},onClick:e=>{e.preventDefault(),t.chain().focus().toggleHeading({level:3}).run()}},e.createElement("i",{className:"bi bi-type-h3"}))),u=({editor:t,active:i})=>{const[a,r]=e.useState(!1),[l,n]=e.useState("");return e.useEffect((()=>{n("")}),[a]),i&&e.createElement(e.Fragment,null,e.createElement("a",{className:"editor-menu-item"+(t.isActive("link")?" active":""),href:"#",onClick:e=>{e.preventDefault(),t.isActive("link")?t.chain().focus().unsetLink().run():r(!a)}},e.createElement("i",{className:"bi bi-link"})),a&&e.createElement("div",{className:"editor-link"},e.createElement("input",{className:"form-control form-control-sm",placeholder:"https://example.com.br",style:{fontSize:".8em",flex:1},type:"text",value:l,onChange:e=>n(e.target.value)}),e.createElement("a",{className:"text-primary ms-2",href:"#",style:{fontSize:".8em"},onClick:e=>{e.preventDefault(),""===l?t.chain().focus().extendMarkRange("link").unsetLink().run():t.chain().focus().extendMarkRange("link").setLink({href:l}).run(),r(!1)}},e.createElement("i",{className:"bi bi-save me-1"}),"Save")))},v=({editor:t,active:i})=>i&&e.createElement("a",{className:"editor-menu-item"+(t.isActive("bold")?" active":""),href:"#",onClick:e=>{e.preventDefault(),t.chain().focus().toggleBold().run()}},e.createElement("i",{className:"bi bi-type-bold"})),g=({editor:t,active:i})=>i&&e.createElement("a",{className:"editor-menu-item"+(t.isActive("code")?" active":""),href:"#",style:{fontSize:".975em"},onClick:e=>{e.preventDefault(),t.chain().focus().toggleCode().run()}},e.createElement("i",{className:"bi bi-code-slash"})),f=({editor:t,active:i})=>i&&e.createElement("input",{style:{width:"22px",height:"20px",borderRadius:"5px",margin:"auto 2.5px",border:"2px solid var(--editor-border-color)"},type:"color",value:t.getAttributes("textStyle").color??"#000000",onChange:e=>t.chain().focus().setColor(e.target.value).run()}),p=({editor:t,active:i})=>{const[a,r]=e.useState(null),l=e=>{const i=(e.clipboardData||e.originalEvent.clipboardData).items;for(const e of i)if(0===e.type.indexOf("image")){const i=e.getAsFile(),a=new FileReader;a.onload=e=>{t.chain().focus().setImage({src:e?.target?.result}).run()},a.readAsDataURL(i)}};return e.useEffect((()=>(null!==t.view.dom.parentNode&&i&&t.view.dom.parentNode.addEventListener("paste",l),()=>{t.view.dom.parentNode?.removeEventListener("paste",l)})),[]),e.useEffect((()=>{if(void 0!==a?.name){const e=new FileReader;e.readAsDataURL(a),e.onload=()=>{t.chain().focus().setImage({src:e.result}).run()}}}),[a]),i&&e.createElement("div",{className:"editor-image"},e.createElement("input",{accept:"image/png, image/jpeg",name:"editor-image",type:"file",onChange:e=>r(e.target.files?.[0])}),e.createElement("a",{className:"editor-menu-item"+(t.isActive("link")?" active":""),href:"#",style:{fontSize:".975em"},onClick:e=>{e.preventDefault()}},e.createElement("i",{className:"bi bi-image"})))},h=({editor:t,active:i})=>i&&e.createElement("a",{className:"editor-menu-item"+(t.isActive("italic")?" active":""),href:"#",onClick:e=>{e.preventDefault(),t.chain().focus().toggleItalic().run()}},e.createElement("i",{className:"bi bi-type-italic"})),E=({editor:t,active:i})=>i&&e.createElement("a",{className:"editor-menu-item"+(t.isActive("strike")?" active":""),href:"#",onClick:e=>{e.preventDefault(),t.chain().focus().toggleStrike().run()}},e.createElement("i",{className:"bi bi-type-strikethrough"})),b=({editor:t,active:i})=>i&&e.createElement("a",{className:"editor-menu-item"+(t.isActive("orderedList")?" active":""),href:"#",onClick:e=>{e.preventDefault(),t.chain().focus().toggleOrderedList().run()}},e.createElement("i",{className:"bi bi-list-ol"})),N=({editor:t,active:i})=>i&&e.createElement("a",{className:"editor-menu-item"+(t.isActive("underline")?" active":""),href:"#",onClick:e=>{e.preventDefault(),t.chain().focus().toggleUnderline().run()}},e.createElement("i",{className:"bi bi-type-underline"})),k=({editor:t,active:i})=>i&&e.createElement("a",{className:"editor-menu-item"+(t.isActive("highlight")?" active":""),href:"#",style:{fontSize:".975em"},onClick:e=>{e.preventDefault(),t.chain().focus().toggleHighlight().run()}},e.createElement("i",{className:"bi bi-highlighter"})),y=({editor:t,active:i})=>i&&e.createElement("a",{className:"editor-menu-item"+(t.isActive("bulletList")?" active":""),href:"#",onClick:e=>{e.preventDefault(),t.chain().focus().toggleBulletList().run()}},e.createElement("i",{className:"bi bi-list-task"})),x=({editor:t,options:i})=>e.createElement("div",{className:"editor-menu"},e.createElement("div",{className:"editor-menu-group"},e.createElement(d,{active:i.text,editor:t}),e.createElement(v,{active:i.bold,editor:t}),e.createElement(h,{active:i.italic,editor:t}),e.createElement(f,{active:i.color,editor:t}),e.createElement(E,{active:i.strike,editor:t}),e.createElement(N,{active:i.underline,editor:t}),e.createElement(g,{active:i.code,editor:t}),e.createElement(k,{active:i.highlight,editor:t})),e.createElement("div",{className:"editor-menu-group"},e.createElement(y,{active:i.bulletlist,editor:t}),e.createElement(b,{active:i.orderlist,editor:t}),e.createElement(u,{active:i.link,editor:t}),e.createElement(p,{active:i.image,editor:t}))),C=({iconPrefix:t="bi bi-",...i})=>i.label&&e.createElement("p",{className:"form-label"},i.icon&&e.createElement("i",{className:t+i.icon+" me-1"}),i.label,i.required&&e.createElement("span",{className:"text-danger"},"*")),A=({errors:t,name:i,...a})=>a.mode&&"Controlled"!==a.mode?e.createElement("div",{className:t[i??""]?"invalid-feedback is-invalid":"","data-name":i??"",id:"j_feedback",style:{display:t[i??""]?"block":"none"}},t[i??""]?t[i??""].message:""):e.createElement("div",{"data-name":i,id:"j_feedback"}),D={text:!0,bold:!0,italic:!0,color:!0,strike:!1,underline:!1,code:!1,highlight:!1,bulletlist:!1,orderlist:!1,link:!1,image:!1},z={text:!0,bold:!0,italic:!0,color:!0,strike:!0,underline:!0,code:!0,highlight:!0,bulletlist:!0,orderlist:!0,link:!0,image:!0};exports.Editor=({options:t="basic",iconPrefix:d="bi bi-",...u})=>{const[v,g]=e.useState(!1),f=o.useEditor({extensions:[r,n,c,l.Color,s,i.configure({validate:e=>/^https?:\/\//.test(e),HTMLAttributes:{rel:""}}),a.configure({allowBase64:!0})],editable:!u.disabled,content:u.value??"",onFocus:()=>g(!0),onBlur:()=>g(!1),onUpdate:({editor:e})=>{u.onChange(e.getHTML())}});return f?(e.useEffect((()=>{f&&!v&&f?.commands.setContent(u.value)}),[u.value]),e.createElement(m,{className:u.className,css:u.css,size:u.size??"100"},e.createElement(C,{...u}),e.createElement("div",{className:"editor-container"},!u.disabled&&e.createElement(x,{editor:f,options:"basic"===t?D:"full"===t?z:t}),e.createElement(o.EditorContent,{className:"editor",disabled:u.disabled,editor:f,id:u.id,name:u.name,style:{minHeight:(u.height??100)+"px"}})),e.createElement(A,{...u}))):(console.error("Não foi possível realizar o carregamento do editor de texto."),null)};
2
2
  //# sourceMappingURL=index.cjs.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs.js","sources":["../../src/box/box.tsx","../../src/editor/core/text.tsx","../../src/editor/core/link.tsx","../../src/editor/core/bold.tsx","../../src/editor/core/code.tsx","../../src/editor/core/color.tsx","../../src/editor/core/image.tsx","../../src/editor/core/italic.tsx","../../src/editor/core/strike.tsx","../../src/editor/core/orderlist.tsx","../../src/editor/core/underline.tsx","../../src/editor/core/highlight.tsx","../../src/editor/core/bulletlist.tsx","../../src/editor/core/index.tsx","../../src/api/input.tsx","../../src/editor/const.ts","../../src/editor/editor.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 { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Text`\r\n * Extensão para formatar o texto com tamanho específico\r\n */\r\nexport const Text = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n\r\n return active && (\r\n <>\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"heading\", { level: 1 }) ? \" active\" : \"\")}\r\n href=\"#\"\r\n style={{ fontSize: \".975em\" }}\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleHeading({ level: 1 }).run();\r\n }}><i className=\"bi bi-type-h1\"/></a>\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"heading\", { level: 2 }) ? \" active\" : \"\")}\r\n href=\"#\"\r\n style={{ fontSize: \".975em\" }}\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleHeading({ level: 2 }).run();\r\n }}><i className=\"bi bi-type-h2\"/></a>\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"heading\", { level: 3 }) ? \" active\" : \"\")}\r\n href=\"#\"\r\n style={{ fontSize: \".975em\" }}\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleHeading({ level: 3 }).run();\r\n }}><i className=\"bi bi-type-h3\"/></a>\r\n </>\r\n );\r\n};","import { EditorCoreProps } from \"../types\";\r\nimport React, { useEffect, useState } from \"react\";\r\n\r\n/**\r\n * Core - `Link`\r\n * Extensão para formatar adicionar link no documento\r\n */\r\nexport const Link = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n const [open, setOpen] = useState<boolean>(false);\r\n const [link, setLink] = useState<string>(\"\");\r\n\r\n useEffect(() => {\r\n setLink(\"\");\r\n }, [open]);\r\n\r\n function handleLink() {\r\n if (link === \"\") {\r\n editor.chain().focus().extendMarkRange(\"link\").unsetLink().run();\r\n } else {\r\n editor.chain().focus().extendMarkRange(\"link\").setLink({ href: link }).run();\r\n }\r\n setOpen(false);\r\n }\r\n\r\n return active && (\r\n <>\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"link\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n onClick={event => {\r\n event.preventDefault();\r\n if (!editor.isActive(\"link\")) {\r\n setOpen(!open);\r\n } else {\r\n editor.chain().focus().unsetLink().run();\r\n }\r\n }}><i className=\"bi bi-link\"/></a>\r\n {open && <div className=\"editor-link\">\r\n <input className=\"form-control form-control-sm\"\r\n placeholder=\"https://example.com.br\"\r\n style={{ fontSize: \".8em\", flex: 1 }}\r\n type=\"text\"\r\n value={link}\r\n onChange={event => setLink(event.target.value)}/>\r\n <a className=\"text-primary ms-2\"\r\n href=\"#\"\r\n style={{ fontSize: \".8em\" }}\r\n onClick={event => {\r\n event.preventDefault();\r\n handleLink();\r\n }}><i className=\"bi bi-save me-1\"/>Save</a>\r\n </div>}\r\n </>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Bold`\r\n * Extensão para renderizar texto em negrito\r\n */\r\nexport const Bold = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"bold\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleBold().run();\r\n }}><i className=\"bi bi-type-bold\"/></a>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Code`\r\n * Extensão para renderizar texto em formato de código\r\n */\r\nexport const Code = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"code\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n style={{ fontSize: \".975em\" }}\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleCode().run();\r\n }}><i className=\"bi bi-code-slash\"/></a>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Color`\r\n * Extensão para formatar o texto com cor especifica\r\n */\r\nexport const Color = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <input\r\n style={{\r\n width: \"22px\",\r\n height: \"20px\",\r\n borderRadius: \"5px\",\r\n margin: \"auto 2.5px\",\r\n border: \"2px solid var(--editor-border-color)\",\r\n }}\r\n type=\"color\"\r\n value={editor.getAttributes(\"textStyle\").color ?? \"#000000\"}\r\n onChange={event => editor.chain().focus().setColor(event.target.value).run()}/>\r\n );\r\n};","import { EditorCoreProps } from \"../types\";\r\nimport React, { useEffect, useState } from \"react\";\r\n\r\n/**\r\n * Core - `Image`\r\n * Extensão para adicionar imagem no documento\r\n */\r\nexport const Image = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n const [file, setFile] = useState<any>(null);\r\n\r\n const handlePaste = (event: any) => {\r\n const items = (event.clipboardData || event.originalEvent.clipboardData).items;\r\n for (const item of items) {\r\n if (item.type.indexOf(\"image\") === 0) {\r\n const file = item.getAsFile();\r\n const reader = new FileReader();\r\n reader.onload = (event) => {\r\n editor.chain().focus().setImage({ src: event?.target?.result as string }).run();\r\n };\r\n reader.readAsDataURL(file);\r\n }\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n if (editor.view.dom.parentNode !== null && active) {\r\n editor.view.dom.parentNode.addEventListener(\"paste\", handlePaste);\r\n }\r\n return () => {\r\n editor.view.dom.parentNode?.removeEventListener(\"paste\", handlePaste);\r\n };\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (file?.name !== undefined) {\r\n const reader = new FileReader();\r\n reader.readAsDataURL(file);\r\n reader.onload = () => {\r\n editor.chain().focus().setImage({ src: reader.result as string }).run();\r\n };\r\n }\r\n }, [file]);\r\n\r\n return active && (\r\n <div className=\"editor-image\">\r\n <input accept=\"image/png, image/jpeg\"\r\n name=\"editor-image\"\r\n type=\"file\"\r\n onChange={event => setFile(event.target.files?.[0])}/>\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"link\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n style={{ fontSize: \".975em\" }}\r\n onClick={event => {\r\n event.preventDefault();\r\n }}><i className=\"bi bi-image\"/></a>\r\n </div>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Italic`\r\n * Extensão para renderizar texto em itálico\r\n */\r\nexport const Italic = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"italic\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleItalic().run();\r\n }}><i className=\"bi bi-type-italic\"/></a>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Strike`\r\n * Extensão para renderizar texto em strike text\r\n */\r\nexport const Strike = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"strike\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleStrike().run();\r\n }}><i className=\"bi bi-type-strikethrough\"/></a>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Orderlist`\r\n * Extensão para renderizar texto em lista ordenada\r\n */\r\nexport const Orderlist = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"orderedList\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleOrderedList().run();\r\n }}><i className=\"bi bi-list-ol\"/></a>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Underline`\r\n * Extensão para renderizar texto em underline text\r\n */\r\nexport const Underline = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"underline\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleUnderline().run();\r\n }}><i className=\"bi bi-type-underline\"/></a>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Highlight`\r\n * Extensão para marcar texto no formato de marca texto\r\n */\r\nexport const Highlight = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"highlight\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n style={{ fontSize: \".975em\" }}\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleHighlight().run();\r\n }}><i className=\"bi bi-highlighter\"/></a>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Bulletlist`\r\n * Extensão para renderizar texto em lista\r\n */\r\nexport const Bulletlist = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"bulletList\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleBulletList().run();\r\n }}><i className=\"bi bi-list-task\"/></a>\r\n );\r\n};","import React from \"react\";\r\nimport { Text } from \"./text\";\r\nimport { Link } from \"./link\";\r\nimport { Bold } from \"./bold\";\r\nimport { Code } from \"./code\";\r\nimport { Color } from \"./color\";\r\nimport { Image } from \"./image\";\r\nimport { Italic } from \"./italic\";\r\nimport { Strike } from \"./strike\";\r\nimport { Orderlist } from \"./orderlist\";\r\nimport { Underline } from \"./underline\";\r\nimport { Highlight } from \"./highlight\";\r\nimport { Bulletlist } from \"./bulletlist\";\r\nimport { EditorCoreProps, EditorOptionsProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Menu`\r\n * Componente que renderiza todas as opções de menu do componente\r\n */\r\nexport const EditorMenu = ({ editor, options }: EditorCoreProps & { options: EditorOptionsProps }) => {\r\n /*\r\n |------------------------------------------\r\n | render() - Renderização do componente\r\n |------------------------------------------\r\n */\r\n return (\r\n <div className=\"editor-menu\">\r\n <div className=\"editor-menu-group\">\r\n <Text active={options.text}\r\n editor={editor}/>\r\n <Bold active={options.bold}\r\n editor={editor}/>\r\n <Italic active={options.italic}\r\n editor={editor}/>\r\n <Color active={options.color}\r\n editor={editor}/>\r\n <Strike active={options.strike}\r\n editor={editor}/>\r\n <Underline active={options.underline}\r\n editor={editor}/>\r\n <Code active={options.code}\r\n editor={editor}/>\r\n <Highlight active={options.highlight}\r\n editor={editor}/>\r\n </div>\r\n <div className=\"editor-menu-group\">\r\n <Bulletlist active={options.bulletlist}\r\n editor={editor}/>\r\n <Orderlist active={options.orderlist}\r\n editor={editor}/>\r\n <Link active={options.link}\r\n editor={editor}/>\r\n <Image active={options.image}\r\n editor={editor}/>\r\n </div>\r\n </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 { EditorOptionsProps } from \"./types\";\r\n\r\nexport const editorBasic: EditorOptionsProps = {\r\n text: true,\r\n bold: true,\r\n italic: true,\r\n color: true,\r\n strike: false,\r\n underline: false,\r\n code: false,\r\n highlight: false,\r\n bulletlist: false,\r\n orderlist: false,\r\n link: false,\r\n image: false\r\n};\r\n\r\nexport const editorFull: EditorOptionsProps = {\r\n text: true,\r\n bold: true,\r\n italic: true,\r\n color: true,\r\n strike: true,\r\n underline: true,\r\n code: true,\r\n highlight: true,\r\n bulletlist: true,\r\n orderlist: true,\r\n link: true,\r\n image: true\r\n};","import { Box } from \"../box\";\r\nimport { EditorMenu } from \"./core\";\r\nimport { InputLabel } from \"../api\";\r\nimport { EditorProps } from \"./types\";\r\nimport Link from \"@tiptap/extension-link\";\r\nimport Image from \"@tiptap/extension-image\";\r\nimport StarterKit from \"@tiptap/starter-kit\";\r\nimport { Color } from \"@tiptap/extension-color\";\r\nimport { editorBasic, editorFull } from \"./const\";\r\nimport React, { useEffect, useState } from \"react\";\r\nimport Underline from \"@tiptap/extension-underline\";\r\nimport Highlight from \"@tiptap/extension-highlight\";\r\nimport TextStyle from \"@tiptap/extension-text-style\";\r\nimport { EditorContent as EditorTipTap, useEditor } from \"@tiptap/react\";\r\n\r\n/**\r\n * Componente - `Editor`\r\n *\r\n * Um componente versátil que pode ser utilizado para criar container de edição de texto.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const Editor = ({ options = \"basic\", iconPrefix = \"bi bi-\", ...props }: EditorProps) => {\r\n const [edition, setEdition] = useState(false);\r\n const editor = useEditor({\r\n extensions: [\r\n StarterKit,\r\n Underline,\r\n Highlight,\r\n Color,\r\n TextStyle,\r\n Link.configure({\r\n validate: (href) => /^https?:\\/\\//.test(href),\r\n HTMLAttributes: {\r\n rel: \"\"\r\n }\r\n }),\r\n Image.configure({\r\n allowBase64: true\r\n })\r\n ],\r\n editable: !props.disabled,\r\n content: props.value ?? \"\",\r\n onFocus: () => setEdition(true),\r\n onBlur: () => setEdition(false),\r\n onUpdate: ({ editor }) => {\r\n props.onChange(editor.getHTML());\r\n }\r\n });\r\n\r\n if (!editor) {\r\n console.error(\"Não foi possível realizar o carregamento do editor de texto.\");\r\n return null;\r\n }\r\n\r\n useEffect(() => {\r\n if (editor && !edition) {\r\n editor?.commands.setContent(props.value);\r\n }\r\n }, [props.value]);\r\n\r\n /*\r\n |------------------------------------------\r\n | render() - Renderização do componente\r\n |------------------------------------------\r\n */\r\n return (\r\n <Box className={props.className}\r\n css={props.css}\r\n size={props.size ?? \"100\"}>\r\n <InputLabel {...props}/>\r\n <div className=\"editor-container\">\r\n {!props.disabled\r\n && <EditorMenu editor={editor}\r\n options={options === \"basic\" ? editorBasic : options === \"full\" ? editorFull : options}/>}\r\n <EditorTipTap className=\"editor\"\r\n disabled={props.disabled}\r\n editor={editor}\r\n id={props.id}\r\n name={props.name}\r\n style={{ minHeight: (props.height ?? 100) + \"px\" }}/>\r\n </div>\r\n <div data-name={props.name}\r\n id=\"j_feedback\"/>\r\n </Box>\r\n );\r\n};\r\n\r\nexport default Editor;"],"names":["Box","children","props","css","size","direction","justify","undefined","Array","isArray","join","align","attr","className","classNames","style","id","React","createElement","Text","editor","active","Fragment","isActive","level","href","fontSize","onClick","event","preventDefault","chain","focus","toggleHeading","run","Link","open","setOpen","useState","link","setLink","useEffect","unsetLink","placeholder","flex","type","value","onChange","target","extendMarkRange","Bold","toggleBold","Code","toggleCode","Color","width","height","borderRadius","margin","border","getAttributes","color","setColor","Image","file","setFile","handlePaste","items","clipboardData","originalEvent","item","indexOf","getAsFile","reader","FileReader","onload","setImage","src","result","readAsDataURL","view","dom","parentNode","addEventListener","removeEventListener","name","accept","files","Italic","toggleItalic","Strike","toggleStrike","Orderlist","toggleOrderedList","Underline","toggleUnderline","Highlight","toggleHighlight","Bulletlist","toggleBulletList","EditorMenu","options","text","bold","italic","strike","underline","code","highlight","bulletlist","orderlist","image","InputLabel","iconPrefix","label","icon","required","editorBasic","editorFull","edition","setEdition","useEditor","extensions","StarterKit","TextStyle","configure","validate","test","HTMLAttributes","rel","allowBase64","editable","disabled","content","onFocus","onBlur","onUpdate","getHTML","commands","setContent","EditorTipTap","minHeight","console","error"],"mappings":"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"}
1
+ {"version":3,"file":"index.cjs.js","sources":["../../src/box/box.tsx","../../src/editor/core/text.tsx","../../src/editor/core/link.tsx","../../src/editor/core/bold.tsx","../../src/editor/core/code.tsx","../../src/editor/core/color.tsx","../../src/editor/core/image.tsx","../../src/editor/core/italic.tsx","../../src/editor/core/strike.tsx","../../src/editor/core/orderlist.tsx","../../src/editor/core/underline.tsx","../../src/editor/core/highlight.tsx","../../src/editor/core/bulletlist.tsx","../../src/editor/core/index.tsx","../../src/api/input.tsx","../../src/editor/const.ts","../../src/editor/editor.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 { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Text`\r\n * Extensão para formatar o texto com tamanho específico\r\n */\r\nexport const Text = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n\r\n return active && (\r\n <>\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"heading\", { level: 1 }) ? \" active\" : \"\")}\r\n href=\"#\"\r\n style={{ fontSize: \".975em\" }}\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleHeading({ level: 1 }).run();\r\n }}><i className=\"bi bi-type-h1\"/></a>\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"heading\", { level: 2 }) ? \" active\" : \"\")}\r\n href=\"#\"\r\n style={{ fontSize: \".975em\" }}\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleHeading({ level: 2 }).run();\r\n }}><i className=\"bi bi-type-h2\"/></a>\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"heading\", { level: 3 }) ? \" active\" : \"\")}\r\n href=\"#\"\r\n style={{ fontSize: \".975em\" }}\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleHeading({ level: 3 }).run();\r\n }}><i className=\"bi bi-type-h3\"/></a>\r\n </>\r\n );\r\n};","import { EditorCoreProps } from \"../types\";\r\nimport React, { useEffect, useState } from \"react\";\r\n\r\n/**\r\n * Core - `Link`\r\n * Extensão para formatar adicionar link no documento\r\n */\r\nexport const Link = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n const [open, setOpen] = useState<boolean>(false);\r\n const [link, setLink] = useState<string>(\"\");\r\n\r\n useEffect(() => {\r\n setLink(\"\");\r\n }, [open]);\r\n\r\n function handleLink() {\r\n if (link === \"\") {\r\n editor.chain().focus().extendMarkRange(\"link\").unsetLink().run();\r\n } else {\r\n editor.chain().focus().extendMarkRange(\"link\").setLink({ href: link }).run();\r\n }\r\n setOpen(false);\r\n }\r\n\r\n return active && (\r\n <>\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"link\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n onClick={event => {\r\n event.preventDefault();\r\n if (!editor.isActive(\"link\")) {\r\n setOpen(!open);\r\n } else {\r\n editor.chain().focus().unsetLink().run();\r\n }\r\n }}><i className=\"bi bi-link\"/></a>\r\n {open && <div className=\"editor-link\">\r\n <input className=\"form-control form-control-sm\"\r\n placeholder=\"https://example.com.br\"\r\n style={{ fontSize: \".8em\", flex: 1 }}\r\n type=\"text\"\r\n value={link}\r\n onChange={event => setLink(event.target.value)}/>\r\n <a className=\"text-primary ms-2\"\r\n href=\"#\"\r\n style={{ fontSize: \".8em\" }}\r\n onClick={event => {\r\n event.preventDefault();\r\n handleLink();\r\n }}><i className=\"bi bi-save me-1\"/>Save</a>\r\n </div>}\r\n </>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Bold`\r\n * Extensão para renderizar texto em negrito\r\n */\r\nexport const Bold = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"bold\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleBold().run();\r\n }}><i className=\"bi bi-type-bold\"/></a>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Code`\r\n * Extensão para renderizar texto em formato de código\r\n */\r\nexport const Code = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"code\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n style={{ fontSize: \".975em\" }}\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleCode().run();\r\n }}><i className=\"bi bi-code-slash\"/></a>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Color`\r\n * Extensão para formatar o texto com cor especifica\r\n */\r\nexport const Color = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <input\r\n style={{\r\n width: \"22px\",\r\n height: \"20px\",\r\n borderRadius: \"5px\",\r\n margin: \"auto 2.5px\",\r\n border: \"2px solid var(--editor-border-color)\",\r\n }}\r\n type=\"color\"\r\n value={editor.getAttributes(\"textStyle\").color ?? \"#000000\"}\r\n onChange={event => editor.chain().focus().setColor(event.target.value).run()}/>\r\n );\r\n};","import { EditorCoreProps } from \"../types\";\r\nimport React, { useEffect, useState } from \"react\";\r\n\r\n/**\r\n * Core - `Image`\r\n * Extensão para adicionar imagem no documento\r\n */\r\nexport const Image = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n const [file, setFile] = useState<any>(null);\r\n\r\n const handlePaste = (event: any) => {\r\n const items = (event.clipboardData || event.originalEvent.clipboardData).items;\r\n for (const item of items) {\r\n if (item.type.indexOf(\"image\") === 0) {\r\n const file = item.getAsFile();\r\n const reader = new FileReader();\r\n reader.onload = (event) => {\r\n editor.chain().focus().setImage({ src: event?.target?.result as string }).run();\r\n };\r\n reader.readAsDataURL(file);\r\n }\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n if (editor.view.dom.parentNode !== null && active) {\r\n editor.view.dom.parentNode.addEventListener(\"paste\", handlePaste);\r\n }\r\n return () => {\r\n editor.view.dom.parentNode?.removeEventListener(\"paste\", handlePaste);\r\n };\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (file?.name !== undefined) {\r\n const reader = new FileReader();\r\n reader.readAsDataURL(file);\r\n reader.onload = () => {\r\n editor.chain().focus().setImage({ src: reader.result as string }).run();\r\n };\r\n }\r\n }, [file]);\r\n\r\n return active && (\r\n <div className=\"editor-image\">\r\n <input accept=\"image/png, image/jpeg\"\r\n name=\"editor-image\"\r\n type=\"file\"\r\n onChange={event => setFile(event.target.files?.[0])}/>\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"link\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n style={{ fontSize: \".975em\" }}\r\n onClick={event => {\r\n event.preventDefault();\r\n }}><i className=\"bi bi-image\"/></a>\r\n </div>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Italic`\r\n * Extensão para renderizar texto em itálico\r\n */\r\nexport const Italic = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"italic\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleItalic().run();\r\n }}><i className=\"bi bi-type-italic\"/></a>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Strike`\r\n * Extensão para renderizar texto em strike text\r\n */\r\nexport const Strike = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"strike\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleStrike().run();\r\n }}><i className=\"bi bi-type-strikethrough\"/></a>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Orderlist`\r\n * Extensão para renderizar texto em lista ordenada\r\n */\r\nexport const Orderlist = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"orderedList\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleOrderedList().run();\r\n }}><i className=\"bi bi-list-ol\"/></a>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Underline`\r\n * Extensão para renderizar texto em underline text\r\n */\r\nexport const Underline = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"underline\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleUnderline().run();\r\n }}><i className=\"bi bi-type-underline\"/></a>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Highlight`\r\n * Extensão para marcar texto no formato de marca texto\r\n */\r\nexport const Highlight = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"highlight\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n style={{ fontSize: \".975em\" }}\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleHighlight().run();\r\n }}><i className=\"bi bi-highlighter\"/></a>\r\n );\r\n};","import React from \"react\";\r\nimport { EditorCoreProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Bulletlist`\r\n * Extensão para renderizar texto em lista\r\n */\r\nexport const Bulletlist = ({ editor, active }: EditorCoreProps & { active: boolean }) => {\r\n return active && (\r\n <a className={\"editor-menu-item\" + (editor.isActive(\"bulletList\") ? \" active\" : \"\")}\r\n href=\"#\"\r\n onClick={event => {\r\n event.preventDefault();\r\n editor.chain().focus().toggleBulletList().run();\r\n }}><i className=\"bi bi-list-task\"/></a>\r\n );\r\n};","import React from \"react\";\r\nimport { Text } from \"./text\";\r\nimport { Link } from \"./link\";\r\nimport { Bold } from \"./bold\";\r\nimport { Code } from \"./code\";\r\nimport { Color } from \"./color\";\r\nimport { Image } from \"./image\";\r\nimport { Italic } from \"./italic\";\r\nimport { Strike } from \"./strike\";\r\nimport { Orderlist } from \"./orderlist\";\r\nimport { Underline } from \"./underline\";\r\nimport { Highlight } from \"./highlight\";\r\nimport { Bulletlist } from \"./bulletlist\";\r\nimport { EditorCoreProps, EditorOptionsProps } from \"../types\";\r\n\r\n/**\r\n * Core - `Menu`\r\n * Componente que renderiza todas as opções de menu do componente\r\n */\r\nexport const EditorMenu = ({ editor, options }: EditorCoreProps & { options: EditorOptionsProps }) => {\r\n /*\r\n |------------------------------------------\r\n | render() - Renderização do componente\r\n |------------------------------------------\r\n */\r\n return (\r\n <div className=\"editor-menu\">\r\n <div className=\"editor-menu-group\">\r\n <Text active={options.text}\r\n editor={editor}/>\r\n <Bold active={options.bold}\r\n editor={editor}/>\r\n <Italic active={options.italic}\r\n editor={editor}/>\r\n <Color active={options.color}\r\n editor={editor}/>\r\n <Strike active={options.strike}\r\n editor={editor}/>\r\n <Underline active={options.underline}\r\n editor={editor}/>\r\n <Code active={options.code}\r\n editor={editor}/>\r\n <Highlight active={options.highlight}\r\n editor={editor}/>\r\n </div>\r\n <div className=\"editor-menu-group\">\r\n <Bulletlist active={options.bulletlist}\r\n editor={editor}/>\r\n <Orderlist active={options.orderlist}\r\n editor={editor}/>\r\n <Link active={options.link}\r\n editor={editor}/>\r\n <Image active={options.image}\r\n editor={editor}/>\r\n </div>\r\n </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 { EditorOptionsProps } from \"./types\";\r\n\r\nexport const editorBasic: EditorOptionsProps = {\r\n text: true,\r\n bold: true,\r\n italic: true,\r\n color: true,\r\n strike: false,\r\n underline: false,\r\n code: false,\r\n highlight: false,\r\n bulletlist: false,\r\n orderlist: false,\r\n link: false,\r\n image: false\r\n};\r\n\r\nexport const editorFull: EditorOptionsProps = {\r\n text: true,\r\n bold: true,\r\n italic: true,\r\n color: true,\r\n strike: true,\r\n underline: true,\r\n code: true,\r\n highlight: true,\r\n bulletlist: true,\r\n orderlist: true,\r\n link: true,\r\n image: true\r\n};","import { Box } from \"../box\";\r\nimport { EditorMenu } from \"./core\";\r\nimport { InputFeedback, InputLabel } from \"../api\";\r\nimport { EditorProps } from \"./types\";\r\nimport Link from \"@tiptap/extension-link\";\r\nimport Image from \"@tiptap/extension-image\";\r\nimport StarterKit from \"@tiptap/starter-kit\";\r\nimport { Color } from \"@tiptap/extension-color\";\r\nimport { editorBasic, editorFull } from \"./const\";\r\nimport React, { useEffect, useState } from \"react\";\r\nimport Underline from \"@tiptap/extension-underline\";\r\nimport Highlight from \"@tiptap/extension-highlight\";\r\nimport TextStyle from \"@tiptap/extension-text-style\";\r\nimport { EditorContent as EditorTipTap, useEditor } from \"@tiptap/react\";\r\n\r\n/**\r\n * Componente - `Editor`\r\n *\r\n * Um componente versátil que pode ser utilizado para criar container de edição de texto.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const Editor = ({ options = \"basic\", iconPrefix = \"bi bi-\", ...props }: EditorProps) => {\r\n const [edition, setEdition] = useState(false);\r\n const editor = useEditor({\r\n extensions: [\r\n StarterKit,\r\n Underline,\r\n Highlight,\r\n Color,\r\n TextStyle,\r\n Link.configure({\r\n validate: (href) => /^https?:\\/\\//.test(href),\r\n HTMLAttributes: {\r\n rel: \"\"\r\n }\r\n }),\r\n Image.configure({\r\n allowBase64: true\r\n })\r\n ],\r\n editable: !props.disabled,\r\n content: props.value ?? \"\",\r\n onFocus: () => setEdition(true),\r\n onBlur: () => setEdition(false),\r\n onUpdate: ({ editor }) => {\r\n props.onChange(editor.getHTML());\r\n }\r\n });\r\n\r\n if (!editor) {\r\n console.error(\"Não foi possível realizar o carregamento do editor de texto.\");\r\n return null;\r\n }\r\n\r\n useEffect(() => {\r\n if (editor && !edition) {\r\n editor?.commands.setContent(props.value);\r\n }\r\n }, [props.value]);\r\n\r\n /*\r\n |------------------------------------------\r\n | render() - Renderização do componente\r\n |------------------------------------------\r\n */\r\n return (\r\n <Box className={props.className}\r\n css={props.css}\r\n size={props.size ?? \"100\"}>\r\n <InputLabel {...props}/>\r\n <div className=\"editor-container\">\r\n {!props.disabled\r\n && <EditorMenu editor={editor}\r\n options={options === \"basic\" ? editorBasic : options === \"full\" ? editorFull : options}/>}\r\n <EditorTipTap className=\"editor\"\r\n disabled={props.disabled}\r\n editor={editor}\r\n id={props.id}\r\n name={props.name}\r\n style={{ minHeight: (props.height ?? 100) + \"px\" }}/>\r\n </div>\r\n <InputFeedback {...props}/>\r\n </Box>\r\n );\r\n};\r\n\r\nexport default Editor;"],"names":["Box","children","props","css","size","direction","justify","undefined","Array","isArray","join","align","attr","className","classNames","style","id","React","createElement","Text","editor","active","Fragment","isActive","level","href","fontSize","onClick","event","preventDefault","chain","focus","toggleHeading","run","Link","open","setOpen","useState","link","setLink","useEffect","unsetLink","placeholder","flex","type","value","onChange","target","extendMarkRange","Bold","toggleBold","Code","toggleCode","Color","width","height","borderRadius","margin","border","getAttributes","color","setColor","Image","file","setFile","handlePaste","items","clipboardData","originalEvent","item","indexOf","getAsFile","reader","FileReader","onload","setImage","src","result","readAsDataURL","view","dom","parentNode","addEventListener","removeEventListener","name","accept","files","Italic","toggleItalic","Strike","toggleStrike","Orderlist","toggleOrderedList","Underline","toggleUnderline","Highlight","toggleHighlight","Bulletlist","toggleBulletList","EditorMenu","options","text","bold","italic","strike","underline","code","highlight","bulletlist","orderlist","image","InputLabel","iconPrefix","label","icon","required","InputFeedback","errors","mode","display","message","editorBasic","editorFull","edition","setEdition","useEditor","extensions","StarterKit","TextStyle","configure","validate","test","HTMLAttributes","rel","allowBase64","editable","disabled","content","onFocus","onBlur","onUpdate","getHTML","commands","setContent","EditorTipTap","minHeight","console","error"],"mappings":"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"}
package/editor/index.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import React, { CSSProperties } from 'react';
2
+ import { KeyFilterType } from 'primereact/keyfilter';
2
3
 
3
4
  /**
4
5
  * Define as tipagens `default` de todos os componentes do pacote
@@ -27,7 +28,12 @@ interface ApiComponentProps {
27
28
  }
28
29
 
29
30
  /**
30
- * Define as tipagens ´default´ de tidos os componente de entrada de dados do pacote
31
+ * Define o modo do componente de entrada de dados
32
+ */
33
+ type ApiFieldModeProps = "Controlled" | "HookForm";
34
+
35
+ /**
36
+ * Define os tipos `default` para componente de entrada de dados
31
37
  */
32
38
  interface ApiFieldComponentProps {
33
39
 
@@ -70,6 +76,16 @@ interface ApiFieldComponentProps {
70
76
  * Desabilita a entrada de dados no campo
71
77
  */
72
78
  disabled?: boolean
79
+
80
+ /**
81
+ * Define o modo do componente de entrada de dados
82
+ */
83
+ mode?: ApiFieldModeProps
84
+
85
+ /**
86
+ * Define a opção de filtro de dados do componente
87
+ */
88
+ keyfilter?: KeyFilterType;
73
89
  }
74
90
 
75
91
  interface EditorProps extends ApiComponentProps, ApiFieldComponentProps {