@orangesix/react 1.1.1 → 1.3.1

package/loading/index.cjs.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react"),i=require("primereact/utils");exports.Loading=({opacity:t="0.5",...a})=>{const s={justify:void 0===a.justify?"justify-content-center":Array.isArray(a.justify)?a.justify?.join(" "):a.justify,align:void 0===a.align?"align-items-center":Array.isArray(a.align)?a.align?.join(" "):a.align},r={className:i.classNames([s.align,s.justify,a.className,"box-loading",`text-${a.color??"white"}`]),style:{zIndex:a.zindex??1,background:"rgba(0,0,0, "+t+")",...a.css??{}}};return a.visible&&e.createElement("div",{...r},e.createElement("div",{className:`spinner-${a.type??"border"}`},e.createElement("span",{className:"visually-hidden"},"Loading...")),a.text??e.createElement("p",{className:"mt-1"},a.text))};
+//# sourceMappingURL=index.cjs.js.map

package/loading/index.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs.js","sources":["../../src/loading/loading.tsx"],"sourcesContent":["import { LoadingProps } from \"./types\";\r\nimport React, { HTMLAttributes } from \"react\";\r\nimport { classNames } from \"primereact/utils\";\r\n\r\n/**\r\n * Componente - `Loading`\r\n *\r\n * Um componente versátil que pode ser utilizado para exibir informação de carregando.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const Loading = ({ opacity = \"0.5\", ...props }: LoadingProps) => {\r\n    const css = {\r\n        justify: props.justify === undefined ? \"justify-content-center\" : Array.isArray(props.justify) ? props.justify?.join(\" \") : props.justify,\r\n        align: props.align === undefined ? \"align-items-center\" : Array.isArray(props.align) ? props.align?.join(\" \") : props.align,\r\n    };\r\n    const attr: HTMLAttributes<\"div\"> = {\r\n        className: classNames([\r\n            css.align,\r\n            css.justify,\r\n            props.className,\r\n            \"box-loading\",\r\n            `text-${props.color ?? \"white\"}`,\r\n        ]),\r\n        style: {\r\n            zIndex: props.zindex ?? 1,\r\n            background: \"rgba(0,0,0, \" + opacity + \")\", ...props.css ?? {}\r\n        }\r\n    };\r\n\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return props.visible && (\r\n        <div {...attr as any}>\r\n            <div className={`spinner-${props.type ?? \"border\"}`}>\r\n                <span className=\"visually-hidden\">Loading...</span>\r\n            </div>\r\n            {props.text ?? <p className=\"mt-1\">{props.text}</p>}\r\n        </div>\r\n    );\r\n};"],"names":["opacity","props","css","justify","undefined","Array","isArray","join","align","attr","className","classNames","color","style","zIndex","zindex","background","visible","React","createElement","type","text"],"mappings":"kFAUuB,EAAGA,UAAU,SAAUC,MAC1C,MAAMC,EAAM,CACRC,aAA2BC,IAAlBH,EAAME,QAAwB,yBAA2BE,MAAMC,QAAQL,EAAME,SAAWF,EAAME,SAASI,KAAK,KAAON,EAAME,QAClIK,WAAuBJ,IAAhBH,EAAMO,MAAsB,qBAAuBH,MAAMC,QAAQL,EAAMO,OAASP,EAAMO,OAAOD,KAAK,KAAON,EAAMO,OAEpHC,EAA8B,CAChCC,UAAWC,EAAAA,WAAW,CAClBT,EAAIM,MACJN,EAAIC,QACJF,EAAMS,UACN,cACA,QAAQT,EAAMW,OAAS,YAE3BC,MAAO,CACHC,OAAQb,EAAMc,QAAU,EACxBC,WAAY,eAAiBhB,EAAU,OAAQC,EAAMC,KAAO,CAAA,IASpE,OAAOD,EAAMgB,SACTC,0BAAST,GACLS,EAAKC,cAAA,MAAA,CAAAT,UAAW,WAAWT,EAAMmB,MAAQ,YACrCF,EAAAC,cAAA,OAAA,CAAMT,UAAU,mBAAiB,eAEpCT,EAAMoB,MAAQH,EAAAC,cAAA,IAAA,CAAGT,UAAU,QAAQT,EAAMoB,MAEjD"}

package/loading/index.d.ts

@@ -0,0 +1,172 @@
+import React, { CSSProperties } from 'react';
+
+/**
+ * Realiza o mapeamento dos valores da propriedades css `align-items`
+ */
+type AlignItemsProps =
+    | "align-items-start"
+    | "align-items-end"
+    | "align-items-center"
+    | "align-items-baseline"
+    | "align-items-stretch"
+    | "align-items-sm-start"
+    | "align-items-sm-end"
+    | "align-items-sm-center"
+    | "align-items-sm-baseline"
+    | "align-items-sm-stretch"
+    | "align-items-md-start"
+    | "align-items-md-end"
+    | "align-items-md-center"
+    | "align-items-md-baseline"
+    | "align-items-md-stretch"
+    | "align-items-lg-start"
+    | "align-items-lg-end"
+    | "align-items-lg-center"
+    | "align-items-lg-baseline"
+    | "align-items-lg-stretch"
+    | "align-items-xl-start"
+    | "align-items-xl-end"
+    | "align-items-xl-center"
+    | "align-items-xl-baseline"
+    | "align-items-xl-stretch"
+    | "align-items-xxl-start"
+    | "align-items-xxl-end"
+    | "align-items-xxl-center"
+    | "align-items-xxl-baseline"
+    | "align-items-xxl-stretch";
+
+/**
+ * Realiza o mapeamento dos valores da propriedades css `justify-content`
+ */
+type JustifyContentProps =
+    | "justify-content-start"
+    | "justify-content-end"
+    | "justify-content-center"
+    | "justify-content-between"
+    | "justify-content-around"
+    | "justify-content-evenly"
+    | "justify-content-sm-start"
+    | "justify-content-sm-end"
+    | "justify-content-sm-center"
+    | "justify-content-sm-between"
+    | "justify-content-sm-around"
+    | "justify-content-sm-evenly"
+    | "justify-content-md-start"
+    | "justify-content-md-end"
+    | "justify-content-md-center"
+    | "justify-content-md-between"
+    | "justify-content-md-around"
+    | "justify-content-md-evenly"
+    | "justify-content-lg-start"
+    | "justify-content-lg-end"
+    | "justify-content-lg-center"
+    | "justify-content-lg-between"
+    | "justify-content-lg-around"
+    | "justify-content-lg-evenly"
+    | "justify-content-xl-start"
+    | "justify-content-xl-end"
+    | "justify-content-xl-center"
+    | "justify-content-xl-between"
+    | "justify-content-xl-around"
+    | "justify-content-xl-evenly"
+    | "justify-content-xxl-start"
+    | "justify-content-xxl-end"
+    | "justify-content-xxl-center"
+    | "justify-content-xxl-between"
+    | "justify-content-xxl-around"
+    | "justify-content-xxl-evenly";
+
+/**
+ * Define as tipagens `default` de todos os componentes do pacote
+ */
+interface ApiComponentProps {
+
+    /**
+     * Propriedade para identificar o id do elemento
+     */
+    id?: string
+
+    /**
+     * Adiciona no atributo `class` do componente o valor atribuido nessa propriedade
+     */
+    className?: string
+
+    /**
+     * Define o tamanho da box do componente de acordo com o valores abaixo
+     */
+    size?: "5" | "10" | "12-5" | "15" | "17-5" | "20" | "22-5" | "25" | "30" | "33" | "35" | "40" | "45" | "50" | "55" | "60" | "65" | "70" | "75" | "80" | "85" | "90" | "95" | "100"
+
+    /**
+     * Define as propriedades css do component `style`
+     */
+    css?: CSSProperties
+}
+
+/**
+ * Define as cores padrão as UI de componentes
+ */
+type ApiColorProps =
+    "primary" |
+    "secondary" |
+    "success" |
+    "danger" |
+    "light" |
+    "warning" |
+    "gray" |
+    "info" |
+    "dark" |
+    "white";
+
+interface LoadingProps extends Omit<ApiComponentProps, "size" | "id"> {
+    /**
+     * Define se o loading vai se exibido
+     */
+    visible: boolean
+
+    /**
+     * A propriedade `align` determina o alinhamento do conteúdo base na propriedade `direction`.
+     * Essa propriedade ajusta os estilos CSS `align-items`, permitindo um controle preciso do layout.
+     */
+    align?: AlignItemsProps | AlignItemsProps[]
+
+    /**
+     * A propriedade `justify` determina o alinhamento do conteúdo base na propriedade `direction`.
+     * Essa propriedade ajusta os estilos CSS `justify-content`, permitindo um controle preciso do layout.
+     */
+    justify?: JustifyContentProps | JustifyContentProps[]
+
+    /**
+     * Define a opacidade do fundo da box de carregamento
+     */
+    opacity?: string
+
+    /**
+     * Define o tipo do loading
+     */
+    type?: "border" | "grow"
+
+    /**
+     * Define a mensagem do load
+     */
+    text?: string
+
+    /**
+     * Define as cores padrão do component
+     */
+    color?: ApiColorProps
+
+    /**
+     * Personaliza a propriedade zindex do componente de loading
+     */
+    zindex?: number
+}
+
+/**
+ * Componente - `Loading`
+ *
+ * Um componente versátil que pode ser utilizado para exibir informação de carregando.
+ * Permite personalizar o estilo e o conteúdo através de propriedades.
+ */
+declare const Loading: ({ opacity, ...props }: LoadingProps) => false | React.JSX.Element;
+
+export { Loading };

package/loading/index.esm.js

@@ -0,0 +1,2 @@
+import e from"react";import{classNames as t}from"primereact/utils";const i=({opacity:i="0.5",...a})=>{const r={justify:void 0===a.justify?"justify-content-center":Array.isArray(a.justify)?a.justify?.join(" "):a.justify,align:void 0===a.align?"align-items-center":Array.isArray(a.align)?a.align?.join(" "):a.align},s={className:t([r.align,r.justify,a.className,"box-loading",`text-${a.color??"white"}`]),style:{zIndex:a.zindex??1,background:"rgba(0,0,0, "+i+")",...a.css??{}}};return a.visible&&e.createElement("div",{...s},e.createElement("div",{className:`spinner-${a.type??"border"}`},e.createElement("span",{className:"visually-hidden"},"Loading...")),a.text??e.createElement("p",{className:"mt-1"},a.text))};export{i as Loading};
+//# sourceMappingURL=index.esm.js.map

package/loading/index.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":["../../src/loading/loading.tsx"],"sourcesContent":["import { LoadingProps } from \"./types\";\r\nimport React, { HTMLAttributes } from \"react\";\r\nimport { classNames } from \"primereact/utils\";\r\n\r\n/**\r\n * Componente - `Loading`\r\n *\r\n * Um componente versátil que pode ser utilizado para exibir informação de carregando.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const Loading = ({ opacity = \"0.5\", ...props }: LoadingProps) => {\r\n    const css = {\r\n        justify: props.justify === undefined ? \"justify-content-center\" : Array.isArray(props.justify) ? props.justify?.join(\" \") : props.justify,\r\n        align: props.align === undefined ? \"align-items-center\" : Array.isArray(props.align) ? props.align?.join(\" \") : props.align,\r\n    };\r\n    const attr: HTMLAttributes<\"div\"> = {\r\n        className: classNames([\r\n            css.align,\r\n            css.justify,\r\n            props.className,\r\n            \"box-loading\",\r\n            `text-${props.color ?? \"white\"}`,\r\n        ]),\r\n        style: {\r\n            zIndex: props.zindex ?? 1,\r\n            background: \"rgba(0,0,0, \" + opacity + \")\", ...props.css ?? {}\r\n        }\r\n    };\r\n\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return props.visible && (\r\n        <div {...attr as any}>\r\n            <div className={`spinner-${props.type ?? \"border\"}`}>\r\n                <span className=\"visually-hidden\">Loading...</span>\r\n            </div>\r\n            {props.text ?? <p className=\"mt-1\">{props.text}</p>}\r\n        </div>\r\n    );\r\n};"],"names":["Loading","opacity","props","css","justify","undefined","Array","isArray","join","align","attr","className","classNames","color","style","zIndex","zindex","background","visible","React","createElement","type","text"],"mappings":"mEAUO,MAAMA,EAAU,EAAGC,UAAU,SAAUC,MAC1C,MAAMC,EAAM,CACRC,aAA2BC,IAAlBH,EAAME,QAAwB,yBAA2BE,MAAMC,QAAQL,EAAME,SAAWF,EAAME,SAASI,KAAK,KAAON,EAAME,QAClIK,WAAuBJ,IAAhBH,EAAMO,MAAsB,qBAAuBH,MAAMC,QAAQL,EAAMO,OAASP,EAAMO,OAAOD,KAAK,KAAON,EAAMO,OAEpHC,EAA8B,CAChCC,UAAWC,EAAW,CAClBT,EAAIM,MACJN,EAAIC,QACJF,EAAMS,UACN,cACA,QAAQT,EAAMW,OAAS,YAE3BC,MAAO,CACHC,OAAQb,EAAMc,QAAU,EACxBC,WAAY,eAAiBhB,EAAU,OAAQC,EAAMC,KAAO,CAAA,IASpE,OAAOD,EAAMgB,SACTC,0BAAST,GACLS,EAAKC,cAAA,MAAA,CAAAT,UAAW,WAAWT,EAAMmB,MAAQ,YACrCF,EAAAC,cAAA,OAAA,CAAMT,UAAU,mBAAiB,eAEpCT,EAAMoB,MAAQH,EAAAC,cAAA,IAAA,CAAGT,UAAU,QAAQT,EAAMoB,MAEjD"}

package/loading/package.json

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

package/message/index.cjs.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react"),i=require("primereact/utils"),a=require("primereact/dialog"),s=require("primereact/button");const n=({children:a,...s})=>{const n={size:`box-size-${s.size??"100"}`,direction:`box-direction-${s.direction??"row"}`,justify:void 0===s.justify?"":Array.isArray(s.justify)?s.justify?.join(" "):s.justify,align:void 0===s.align?"":Array.isArray(s.align)?s.align?.join(" "):s.align},o={className:i.classNames(["box",s.className??"",n.size,n.direction,n.justify,n.align]),style:s.css,id:s.id};return e.createElement("div",{...o},a)};function o(i){const a=void 0!==i.icon?e.createElement("h5",{className:"fw-semibold"},e.createElement("i",{className:"me-1 "+(i.iconPrefix??"bi bi-")+i.icon}),i.header):i.header;return{appendTo:"self",visible:i.visible,onHide(){i.onVisible(!i.visible)},modal:void 0===i.background||i.background,dismissableMask:void 0===i.backdrop||!i.backdrop,maximizable:i.maximizable,draggable:i.draggable,closable:void 0===i.closable||i.closable,baseZIndex:i.zIndex??1e3,position:i.position,header:a,footer:i.footer,showHeader:!(!1===i.header)}}function l(i){let s=i.sizes?"small"===i.sizes?"300px":"medium"===i.sizes?"500px":"large"===i.sizes?"800px":"80%":void 0;const[n,l]=e.useState(i.maximized??!1);return e.createElement(a.Dialog,{style:n?{}:{width:s},...o(i),breakpoints:{"768px":"80%","576px":"90%"},className:i.className,maximized:n,onMaximize:()=>l(!n)},i.children)}const r=({...i})=>e.createElement(s.Button,{badge:i.badge,badgeClassName:i.badgeClassName,className:i.className,disabled:i.disabled,icon:void 0!==i.icon?`${i.iconPrefix??"bi bi-"}${i.icon??""} ${i.label?"me-1":""}`:void 0,iconPos:i.iconPos,id:i.id,label:i.label,link:i.isLink,loading:i.isLoading,pt:{loadingIcon:{className:"me-1"}},ref:i.ref,severity:i.color,size:i.size,style:i.css,type:i.type,onClick:i.onClick});function c({confirm:i=!0,cancel:a=!0,...s}){return e.createElement(l,{className:"message",header:s.title??"Confirmação",icon:s.modalIcon??"cone-striped",iconPrefix:s.modalIconPrefix??"bi bi-",sizes:"medium",visible:s.visible,onVisible:s.onVisible},e.createElement(n,{direction:"column",size:"100"},e.createElement("div",{dangerouslySetInnerHTML:{__html:s.message??""}}),e.createElement(n,{className:"gap-2",justify:"justify-content-"+(s.modalOptionsPosition??"end"),size:"100"},i&&e.createElement(r,{color:"success",icon:"check2-circle",isLoading:s.isLoading??!1,label:s.confirmLabel??"Confirmar",onClick:()=>{s.onConfirm&&s.onConfirm()}}),a&&e.createElement(r,{color:"danger",icon:"slash-circle",label:s.cancelarLabel??"Cancelar",onClick:()=>{s.onCancel?s.onCancel():s.onVisible(!1)}}))))}function t(i){return e.createElement(e.Fragment,null,i.type&&"modal"!==i.type?null:e.createElement(c,{...i}))}t.displayName="Message",exports.Message=t;
+//# sourceMappingURL=index.cjs.js.map

package/message/index.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs.js","sources":["../../src/box/box.tsx","../../src/modal/core/core.tsx","../../src/modal/modal.tsx","../../src/button/button.tsx","../../src/message/core/modal.tsx","../../src/message/message.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 { ModalProps } from \"../types\";\r\nimport { DialogProps } from \"primereact/dialog\";\r\n\r\n/**\r\n * `Core`\r\n * Define as propriedades base para funcionamento da Modal\r\n */\r\nexport function modalCore(\r\n    props: ModalProps\r\n): DialogProps {\r\n    const title = props.icon !== undefined\r\n        ? <h5 className=\"fw-semibold\">\r\n            <i className={\"me-1 \" + (props.iconPrefix ?? \"bi bi-\") + props.icon}/>{props.header}</h5>\r\n        : props.header;\r\n\r\n    return {\r\n        appendTo: \"self\",\r\n        visible: props.visible,\r\n        onHide() {\r\n            props.onVisible(!props.visible);\r\n        },\r\n        modal: props.background === undefined || props.background,\r\n        dismissableMask: props.backdrop === undefined || !props.backdrop,\r\n\r\n        maximizable: props.maximizable,\r\n        draggable: props.draggable,\r\n        closable: props.closable === undefined || props.closable,\r\n        baseZIndex: props.zIndex ?? 1000,\r\n\r\n        position: props.position,\r\n        header: title,\r\n        footer: props.footer,\r\n        showHeader: !(props.header === false),\r\n    };\r\n}","import React, { useState } from \"react\";\r\nimport { ModalProps } from \"./types\";\r\nimport { modalCore } from \"./core/core\";\r\nimport { Dialog } from \"primereact/dialog\";\r\n\r\n/**\r\n * Componente - `Modal`\r\n *\r\n * Um componente versátil que é utilizado exibir dados em forma de janela suspensa.\r\n */\r\nexport function Modal(props: ModalProps) {\r\n    let sizes = !props.sizes ? undefined\r\n        : props.sizes === \"small\" ? \"300px\"\r\n            : props.sizes === \"medium\" ? \"500px\"\r\n                : props.sizes === \"large\" ? \"800px\" : \"80%\";\r\n    const [maximized, setMaximized] = useState(props.maximized ?? false);\r\n\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return (\r\n        <Dialog style={!maximized ? { width: sizes } : {}}\r\n                {...modalCore(props)}\r\n                breakpoints={{\r\n                    \"768px\": \"80%\",\r\n                    \"576px\": \"90%\",\r\n                }}\r\n                className={props.className}\r\n                maximized={maximized}\r\n                onMaximize={() => setMaximized(!maximized)}>\r\n            {props.children}\r\n        </Dialog>\r\n    );\r\n}","import React from \"react\";\r\nimport { ButtonProps } from \"./types\";\r\nimport { Button as ButtonPrimeReact } from \"primereact/button\";\r\n\r\n/**\r\n * Componente - `Button`\r\n *\r\n * Um componente versátil que pode ser utilizado para realizar ações por exemplo em formulários de dados.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const Button = ({ ...props }: ButtonProps) => {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return (\r\n        <ButtonPrimeReact badge={props.badge}\r\n                          badgeClassName={props.badgeClassName}\r\n                          className={props.className}\r\n                          disabled={props.disabled}\r\n                          icon={props.icon !== undefined ? `${props.iconPrefix ?? \"bi bi-\"}${props.icon ?? \"\"} ${props.label ? \"me-1\" : \"\"}` : undefined}\r\n                          iconPos={props.iconPos}\r\n                          id={props.id}\r\n                          label={props.label}\r\n                          link={props.isLink}\r\n                          loading={props.isLoading}\r\n                          pt={{ loadingIcon: { className: \"me-1\" } }}\r\n                          ref={props.ref}\r\n                          severity={props.color}\r\n                          size={props.size}\r\n                          style={props.css}\r\n                          type={props.type}\r\n                          onClick={props.onClick}/>\r\n    );\r\n};","import React from \"react\";\r\nimport { Box } from \"../../box\";\r\nimport { Modal } from \"../../modal\";\r\nimport { Button } from \"../../button\";\r\nimport { MessageProps } from \"../types\";\r\nimport { JustifyContentProps } from \"../../api/types\";\r\n\r\n/**\r\n * Core - `ModalMessage`\r\n * Define o componente do tipo modal\r\n */\r\nexport function ModalMessage({ confirm = true, cancel = true, ...props }: MessageProps<\"modal\">) {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return (\r\n        <Modal className=\"message\"\r\n               header={props.title ?? \"Confirmação\"}\r\n               icon={props.modalIcon ?? \"cone-striped\"}\r\n               iconPrefix={props.modalIconPrefix ?? \"bi bi-\"}\r\n               sizes=\"medium\"\r\n               visible={props.visible}\r\n               onVisible={props.onVisible}>\r\n            <Box direction=\"column\"\r\n                 size=\"100\">\r\n                <div dangerouslySetInnerHTML={{ __html: props.message ?? \"\" }}/>\r\n                <Box className=\"gap-2\"\r\n                     justify={\"justify-content-\" + (props.modalOptionsPosition ?? \"end\") as JustifyContentProps}\r\n                     size=\"100\">\r\n                    {confirm && <Button color=\"success\"\r\n                                        icon=\"check2-circle\"\r\n                                        isLoading={props.isLoading ?? false}\r\n                                        label={props.confirmLabel ?? \"Confirmar\"}\r\n                                        onClick={() => {\r\n                                            if (props.onConfirm) {\r\n                                                props.onConfirm();\r\n                                            }\r\n                                        }}/>}\r\n                    {cancel && <Button color=\"danger\"\r\n                                       icon=\"slash-circle\"\r\n                                       label={props.cancelarLabel ?? \"Cancelar\"}\r\n                                       onClick={() => {\r\n                                           if (props.onCancel) {\r\n                                               props.onCancel();\r\n                                           } else {\r\n                                               props.onVisible(false);\r\n                                           }\r\n                                       }}/>}\r\n                </Box>\r\n            </Box>\r\n        </Modal>\r\n    );\r\n}","import React from \"react\";\r\nimport { ModalMessage } from \"./core/modal\";\r\nimport { MessageModeProps, MessageProps } from \"./types\";\r\n\r\n/**\r\n * Componente - `Message`\r\n *\r\n * Um componente versátil que é utilizado emitir messagens no sistema.\r\n */\r\nexport function Message<T extends MessageModeProps = \"modal\">(props: MessageProps<T> & { type?: T }) {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return (\r\n        <>\r\n            {!props.type || props.type === \"modal\"\r\n                ? <ModalMessage {...props}/>\r\n                : null}\r\n        </>\r\n    );\r\n}\r\n\r\nMessage.displayName = \"Message\";"],"names":["Box","children","props","css","size","direction","justify","undefined","Array","isArray","join","align","attr","className","classNames","style","id","React","createElement","modalCore","title","icon","iconPrefix","header","appendTo","visible","onHide","onVisible","modal","background","dismissableMask","backdrop","maximizable","draggable","closable","baseZIndex","zIndex","position","footer","showHeader","Modal","sizes","maximized","setMaximized","useState","Dialog","width","breakpoints","onMaximize","Button","ButtonPrimeReact","badge","badgeClassName","disabled","label","iconPos","link","isLink","loading","isLoading","pt","loadingIcon","ref","severity","color","type","onClick","ModalMessage","confirm","cancel","modalIcon","modalIconPrefix","dangerouslySetInnerHTML","__html","message","modalOptionsPosition","confirmLabel","onConfirm","cancelarLabel","onCancel","Message","Fragment","displayName"],"mappings":"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"}

package/message/index.d.ts

@@ -0,0 +1,108 @@
+import React from 'react';
+
+/**
+ * Define o tipo de message
+ */
+type MessageModeProps = "modal";
+
+/**
+ * Define as propriedades padrão do component
+ */
+interface MessageBaseProps {
+
+    /**
+     * Determina se messagem está visivel
+     */
+    visible: boolean
+
+    /**
+     * Define o conteúdo da message
+     */
+    message: string
+
+    /**
+     * Define se componente está no estado de carregando
+     */
+    isLoading?: boolean
+
+    /**
+     * Define o titulo da message
+     */
+    title?: string
+
+    /**
+     * Define se vai ter a opção de confirmação
+     */
+    confirm?: boolean
+
+    /**
+     * Define se vai ter a opção de cancelar
+     */
+    cancel?: boolean
+
+    /**
+     * Define o label do botão de confirmação
+     */
+    confirmLabel?: string
+
+    /**
+     * Define o label do botão de cancelar
+     */
+    cancelarLabel?: string
+
+    /**
+     * Define o metodo de confirmação
+     */
+    onConfirm?: () => void
+
+    /**
+     * Define o metodo no cancelamento
+     */
+    onCancel?: () => void
+
+    /**
+     * Metodo responsável por atualizar state do message
+     */
+    onVisible(value: boolean): void;
+}
+
+/**
+ * Define as propriedades do component do tipo MODAL
+ */
+interface MessageModalProps {
+    /**
+     * Define o icone do campo
+     */
+    modalIcon?: string
+
+    /**
+     * Define o prefixo dos icones do pacote
+     */
+    modalIconPrefix?: "bi bi-" | "pi pi-"
+
+    /**
+     * Define o posicionamento das opções da message
+     */
+    modalOptionsPosition?: "center" | "start" | "end"
+}
+
+/**
+ * Define a propriedade para ser exportada
+ */
+type MessageProps<T extends MessageModeProps> = T extends "modal"
+    ? MessageBaseProps & MessageModalProps
+    : MessageBaseProps;
+
+/**
+ * Componente - `Message`
+ *
+ * Um componente versátil que é utilizado emitir messagens no sistema.
+ */
+declare function Message<T extends MessageModeProps = "modal">(props: MessageProps<T> & {
+    type?: T;
+}): React.JSX.Element;
+declare namespace Message {
+    var displayName: string;
+}
+
+export { Message };

package/message/index.esm.js

@@ -0,0 +1,2 @@
+import e,{useState as i}from"react";import{classNames as a}from"primereact/utils";import{Dialog as o}from"primereact/dialog";import{Button as n}from"primereact/button";const s=({children:i,...o})=>{const n={size:`box-size-${o.size??"100"}`,direction:`box-direction-${o.direction??"row"}`,justify:void 0===o.justify?"":Array.isArray(o.justify)?o.justify?.join(" "):o.justify,align:void 0===o.align?"":Array.isArray(o.align)?o.align?.join(" "):o.align},s={className:a(["box",o.className??"",n.size,n.direction,n.justify,n.align]),style:o.css,id:o.id};return e.createElement("div",{...s},i)};function l(i){const a=void 0!==i.icon?e.createElement("h5",{className:"fw-semibold"},e.createElement("i",{className:"me-1 "+(i.iconPrefix??"bi bi-")+i.icon}),i.header):i.header;return{appendTo:"self",visible:i.visible,onHide(){i.onVisible(!i.visible)},modal:void 0===i.background||i.background,dismissableMask:void 0===i.backdrop||!i.backdrop,maximizable:i.maximizable,draggable:i.draggable,closable:void 0===i.closable||i.closable,baseZIndex:i.zIndex??1e3,position:i.position,header:a,footer:i.footer,showHeader:!(!1===i.header)}}function r(a){let n=a.sizes?"small"===a.sizes?"300px":"medium"===a.sizes?"500px":"large"===a.sizes?"800px":"80%":void 0;const[s,r]=i(a.maximized??!1);return e.createElement(o,{style:s?{}:{width:n},...l(a),breakpoints:{"768px":"80%","576px":"90%"},className:a.className,maximized:s,onMaximize:()=>r(!s)},a.children)}const c=({...i})=>e.createElement(n,{badge:i.badge,badgeClassName:i.badgeClassName,className:i.className,disabled:i.disabled,icon:void 0!==i.icon?`${i.iconPrefix??"bi bi-"}${i.icon??""} ${i.label?"me-1":""}`:void 0,iconPos:i.iconPos,id:i.id,label:i.label,link:i.isLink,loading:i.isLoading,pt:{loadingIcon:{className:"me-1"}},ref:i.ref,severity:i.color,size:i.size,style:i.css,type:i.type,onClick:i.onClick});function t({confirm:i=!0,cancel:a=!0,...o}){return e.createElement(r,{className:"message",header:o.title??"Confirmação",icon:o.modalIcon??"cone-striped",iconPrefix:o.modalIconPrefix??"bi bi-",sizes:"medium",visible:o.visible,onVisible:o.onVisible},e.createElement(s,{direction:"column",size:"100"},e.createElement("div",{dangerouslySetInnerHTML:{__html:o.message??""}}),e.createElement(s,{className:"gap-2",justify:"justify-content-"+(o.modalOptionsPosition??"end"),size:"100"},i&&e.createElement(c,{color:"success",icon:"check2-circle",isLoading:o.isLoading??!1,label:o.confirmLabel??"Confirmar",onClick:()=>{o.onConfirm&&o.onConfirm()}}),a&&e.createElement(c,{color:"danger",icon:"slash-circle",label:o.cancelarLabel??"Cancelar",onClick:()=>{o.onCancel?o.onCancel():o.onVisible(!1)}}))))}function m(i){return e.createElement(e.Fragment,null,i.type&&"modal"!==i.type?null:e.createElement(t,{...i}))}m.displayName="Message";export{m as Message};
+//# sourceMappingURL=index.esm.js.map

package/message/index.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":["../../src/box/box.tsx","../../src/modal/core/core.tsx","../../src/modal/modal.tsx","../../src/button/button.tsx","../../src/message/core/modal.tsx","../../src/message/message.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 { ModalProps } from \"../types\";\r\nimport { DialogProps } from \"primereact/dialog\";\r\n\r\n/**\r\n * `Core`\r\n * Define as propriedades base para funcionamento da Modal\r\n */\r\nexport function modalCore(\r\n    props: ModalProps\r\n): DialogProps {\r\n    const title = props.icon !== undefined\r\n        ? <h5 className=\"fw-semibold\">\r\n            <i className={\"me-1 \" + (props.iconPrefix ?? \"bi bi-\") + props.icon}/>{props.header}</h5>\r\n        : props.header;\r\n\r\n    return {\r\n        appendTo: \"self\",\r\n        visible: props.visible,\r\n        onHide() {\r\n            props.onVisible(!props.visible);\r\n        },\r\n        modal: props.background === undefined || props.background,\r\n        dismissableMask: props.backdrop === undefined || !props.backdrop,\r\n\r\n        maximizable: props.maximizable,\r\n        draggable: props.draggable,\r\n        closable: props.closable === undefined || props.closable,\r\n        baseZIndex: props.zIndex ?? 1000,\r\n\r\n        position: props.position,\r\n        header: title,\r\n        footer: props.footer,\r\n        showHeader: !(props.header === false),\r\n    };\r\n}","import React, { useState } from \"react\";\r\nimport { ModalProps } from \"./types\";\r\nimport { modalCore } from \"./core/core\";\r\nimport { Dialog } from \"primereact/dialog\";\r\n\r\n/**\r\n * Componente - `Modal`\r\n *\r\n * Um componente versátil que é utilizado exibir dados em forma de janela suspensa.\r\n */\r\nexport function Modal(props: ModalProps) {\r\n    let sizes = !props.sizes ? undefined\r\n        : props.sizes === \"small\" ? \"300px\"\r\n            : props.sizes === \"medium\" ? \"500px\"\r\n                : props.sizes === \"large\" ? \"800px\" : \"80%\";\r\n    const [maximized, setMaximized] = useState(props.maximized ?? false);\r\n\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return (\r\n        <Dialog style={!maximized ? { width: sizes } : {}}\r\n                {...modalCore(props)}\r\n                breakpoints={{\r\n                    \"768px\": \"80%\",\r\n                    \"576px\": \"90%\",\r\n                }}\r\n                className={props.className}\r\n                maximized={maximized}\r\n                onMaximize={() => setMaximized(!maximized)}>\r\n            {props.children}\r\n        </Dialog>\r\n    );\r\n}","import React from \"react\";\r\nimport { ButtonProps } from \"./types\";\r\nimport { Button as ButtonPrimeReact } from \"primereact/button\";\r\n\r\n/**\r\n * Componente - `Button`\r\n *\r\n * Um componente versátil que pode ser utilizado para realizar ações por exemplo em formulários de dados.\r\n * Permite personalizar o estilo e o conteúdo através de propriedades.\r\n */\r\nexport const Button = ({ ...props }: ButtonProps) => {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return (\r\n        <ButtonPrimeReact badge={props.badge}\r\n                          badgeClassName={props.badgeClassName}\r\n                          className={props.className}\r\n                          disabled={props.disabled}\r\n                          icon={props.icon !== undefined ? `${props.iconPrefix ?? \"bi bi-\"}${props.icon ?? \"\"} ${props.label ? \"me-1\" : \"\"}` : undefined}\r\n                          iconPos={props.iconPos}\r\n                          id={props.id}\r\n                          label={props.label}\r\n                          link={props.isLink}\r\n                          loading={props.isLoading}\r\n                          pt={{ loadingIcon: { className: \"me-1\" } }}\r\n                          ref={props.ref}\r\n                          severity={props.color}\r\n                          size={props.size}\r\n                          style={props.css}\r\n                          type={props.type}\r\n                          onClick={props.onClick}/>\r\n    );\r\n};","import React from \"react\";\r\nimport { Box } from \"../../box\";\r\nimport { Modal } from \"../../modal\";\r\nimport { Button } from \"../../button\";\r\nimport { MessageProps } from \"../types\";\r\nimport { JustifyContentProps } from \"../../api/types\";\r\n\r\n/**\r\n * Core - `ModalMessage`\r\n * Define o componente do tipo modal\r\n */\r\nexport function ModalMessage({ confirm = true, cancel = true, ...props }: MessageProps<\"modal\">) {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return (\r\n        <Modal className=\"message\"\r\n               header={props.title ?? \"Confirmação\"}\r\n               icon={props.modalIcon ?? \"cone-striped\"}\r\n               iconPrefix={props.modalIconPrefix ?? \"bi bi-\"}\r\n               sizes=\"medium\"\r\n               visible={props.visible}\r\n               onVisible={props.onVisible}>\r\n            <Box direction=\"column\"\r\n                 size=\"100\">\r\n                <div dangerouslySetInnerHTML={{ __html: props.message ?? \"\" }}/>\r\n                <Box className=\"gap-2\"\r\n                     justify={\"justify-content-\" + (props.modalOptionsPosition ?? \"end\") as JustifyContentProps}\r\n                     size=\"100\">\r\n                    {confirm && <Button color=\"success\"\r\n                                        icon=\"check2-circle\"\r\n                                        isLoading={props.isLoading ?? false}\r\n                                        label={props.confirmLabel ?? \"Confirmar\"}\r\n                                        onClick={() => {\r\n                                            if (props.onConfirm) {\r\n                                                props.onConfirm();\r\n                                            }\r\n                                        }}/>}\r\n                    {cancel && <Button color=\"danger\"\r\n                                       icon=\"slash-circle\"\r\n                                       label={props.cancelarLabel ?? \"Cancelar\"}\r\n                                       onClick={() => {\r\n                                           if (props.onCancel) {\r\n                                               props.onCancel();\r\n                                           } else {\r\n                                               props.onVisible(false);\r\n                                           }\r\n                                       }}/>}\r\n                </Box>\r\n            </Box>\r\n        </Modal>\r\n    );\r\n}","import React from \"react\";\r\nimport { ModalMessage } from \"./core/modal\";\r\nimport { MessageModeProps, MessageProps } from \"./types\";\r\n\r\n/**\r\n * Componente - `Message`\r\n *\r\n * Um componente versátil que é utilizado emitir messagens no sistema.\r\n */\r\nexport function Message<T extends MessageModeProps = \"modal\">(props: MessageProps<T> & { type?: T }) {\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return (\r\n        <>\r\n            {!props.type || props.type === \"modal\"\r\n                ? <ModalMessage {...props}/>\r\n                : null}\r\n        </>\r\n    );\r\n}\r\n\r\nMessage.displayName = \"Message\";"],"names":["Box","children","props","css","size","direction","justify","undefined","Array","isArray","join","align","attr","className","classNames","style","id","React","createElement","modalCore","title","icon","iconPrefix","header","appendTo","visible","onHide","onVisible","modal","background","dismissableMask","backdrop","maximizable","draggable","closable","baseZIndex","zIndex","position","footer","showHeader","Modal","sizes","maximized","setMaximized","useState","Dialog","width","breakpoints","onMaximize","Button","ButtonPrimeReact","badge","badgeClassName","disabled","label","iconPos","link","isLink","loading","isLoading","pt","loadingIcon","ref","severity","color","type","onClick","ModalMessage","confirm","cancel","modalIcon","modalIconPrefix","dangerouslySetInnerHTML","__html","message","modalOptionsPosition","confirmLabel","onConfirm","cancelarLabel","onCancel","Message","Fragment","displayName"],"mappings":"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"}

package/message/package.json

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

package/modal/index.cjs.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react"),i=require("primereact/dialog");function a(i){const a=void 0!==i.icon?e.createElement("h5",{className:"fw-semibold"},e.createElement("i",{className:"me-1 "+(i.iconPrefix??"bi bi-")+i.icon}),i.header):i.header;return{appendTo:"self",visible:i.visible,onHide(){i.onVisible(!i.visible)},modal:void 0===i.background||i.background,dismissableMask:void 0===i.backdrop||!i.backdrop,maximizable:i.maximizable,draggable:i.draggable,closable:void 0===i.closable||i.closable,baseZIndex:i.zIndex??1e3,position:i.position,header:a,footer:i.footer,showHeader:!(!1===i.header)}}exports.Modal=function(s){let o=s.sizes?"small"===s.sizes?"300px":"medium"===s.sizes?"500px":"large"===s.sizes?"800px":"80%":void 0;const[l,r]=e.useState(s.maximized??!1);return e.createElement(i.Dialog,{style:l?{}:{width:o},...a(s),breakpoints:{"768px":"80%","576px":"90%"},className:s.className,maximized:l,onMaximize:()=>r(!l)},s.children)};
+//# sourceMappingURL=index.cjs.js.map

package/modal/index.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs.js","sources":["../../src/modal/core/core.tsx","../../src/modal/modal.tsx"],"sourcesContent":["import React from \"react\";\r\nimport { ModalProps } from \"../types\";\r\nimport { DialogProps } from \"primereact/dialog\";\r\n\r\n/**\r\n * `Core`\r\n * Define as propriedades base para funcionamento da Modal\r\n */\r\nexport function modalCore(\r\n    props: ModalProps\r\n): DialogProps {\r\n    const title = props.icon !== undefined\r\n        ? <h5 className=\"fw-semibold\">\r\n            <i className={\"me-1 \" + (props.iconPrefix ?? \"bi bi-\") + props.icon}/>{props.header}</h5>\r\n        : props.header;\r\n\r\n    return {\r\n        appendTo: \"self\",\r\n        visible: props.visible,\r\n        onHide() {\r\n            props.onVisible(!props.visible);\r\n        },\r\n        modal: props.background === undefined || props.background,\r\n        dismissableMask: props.backdrop === undefined || !props.backdrop,\r\n\r\n        maximizable: props.maximizable,\r\n        draggable: props.draggable,\r\n        closable: props.closable === undefined || props.closable,\r\n        baseZIndex: props.zIndex ?? 1000,\r\n\r\n        position: props.position,\r\n        header: title,\r\n        footer: props.footer,\r\n        showHeader: !(props.header === false),\r\n    };\r\n}","import React, { useState } from \"react\";\r\nimport { ModalProps } from \"./types\";\r\nimport { modalCore } from \"./core/core\";\r\nimport { Dialog } from \"primereact/dialog\";\r\n\r\n/**\r\n * Componente - `Modal`\r\n *\r\n * Um componente versátil que é utilizado exibir dados em forma de janela suspensa.\r\n */\r\nexport function Modal(props: ModalProps) {\r\n    let sizes = !props.sizes ? undefined\r\n        : props.sizes === \"small\" ? \"300px\"\r\n            : props.sizes === \"medium\" ? \"500px\"\r\n                : props.sizes === \"large\" ? \"800px\" : \"80%\";\r\n    const [maximized, setMaximized] = useState(props.maximized ?? false);\r\n\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return (\r\n        <Dialog style={!maximized ? { width: sizes } : {}}\r\n                {...modalCore(props)}\r\n                breakpoints={{\r\n                    \"768px\": \"80%\",\r\n                    \"576px\": \"90%\",\r\n                }}\r\n                className={props.className}\r\n                maximized={maximized}\r\n                onMaximize={() => setMaximized(!maximized)}>\r\n            {props.children}\r\n        </Dialog>\r\n    );\r\n}"],"names":["modalCore","props","title","undefined","icon","React","createElement","className","iconPrefix","header","appendTo","visible","onHide","onVisible","modal","background","dismissableMask","backdrop","maximizable","draggable","closable","baseZIndex","zIndex","position","footer","showHeader","sizes","maximized","setMaximized","useState","Dialog","style","width","breakpoints","onMaximize","children"],"mappings":"mEAQM,SAAUA,EACZC,GAEA,MAAMC,OAAuBC,IAAfF,EAAMG,KACdC,EAAAC,cAAA,KAAA,CAAIC,UAAU,eACZF,EAAAC,cAAA,IAAA,CAAGC,UAAW,SAAWN,EAAMO,YAAc,UAAYP,EAAMG,OAAQH,EAAMQ,QAC/ER,EAAMQ,OAEZ,MAAO,CACHC,SAAU,OACVC,QAASV,EAAMU,QACf,MAAAC,GACIX,EAAMY,WAAWZ,EAAMU,QAC1B,EACDG,WAA4BX,IAArBF,EAAMc,YAA4Bd,EAAMc,WAC/CC,qBAAoCb,IAAnBF,EAAMgB,WAA2BhB,EAAMgB,SAExDC,YAAajB,EAAMiB,YACnBC,UAAWlB,EAAMkB,UACjBC,cAA6BjB,IAAnBF,EAAMmB,UAA0BnB,EAAMmB,SAChDC,WAAYpB,EAAMqB,QAAU,IAE5BC,SAAUtB,EAAMsB,SAChBd,OAAQP,EACRsB,OAAQvB,EAAMuB,OACdC,cAA+B,IAAjBxB,EAAMQ,QAE5B,eCzBM,SAAgBR,GAClB,IAAIyB,EAASzB,EAAMyB,MACG,UAAhBzB,EAAMyB,MAAoB,QACN,WAAhBzB,EAAMyB,MAAqB,QACP,UAAhBzB,EAAMyB,MAAoB,QAAU,WAHvBvB,EAI3B,MAAOwB,EAAWC,GAAgBC,EAAQA,SAAC5B,EAAM0B,YAAa,GAO9D,OACItB,EAACC,cAAAwB,EAAAA,OAAO,CAAAC,MAAQJ,EAA+B,CAAA,EAAnB,CAAEK,MAAON,MACzB1B,EAAUC,GACdgC,YAAa,CACT,QAAS,MACT,QAAS,OAEb1B,UAAWN,EAAMM,UACjBoB,UAAWA,EACXO,WAAY,IAAMN,GAAcD,IACnC1B,EAAMkC,SAGnB"}

package/modal/index.d.ts

@@ -0,0 +1,73 @@
+import React from 'react';
+import { DialogProps } from 'primereact/dialog';
+
+interface ModalProps extends Pick<DialogProps, "maximizable" | "maximized" | "draggable" | "closable" | "position"> {
+    /**
+     * Conteúdo que será exibido dentro da modal
+     */
+    children: React.ReactNode;
+
+    /**
+     * Define a classe de personalização da modal
+     */
+    className?: string
+
+    /**
+     * Define o state da modal aberta ou fechada
+     */
+    visible: boolean;
+
+    /**
+     * Define se vai ser exibido o fundo da modal
+     */
+    background?: boolean;
+
+    /**
+     * Define se a modal vai ser fechada clicando no fundo
+     */
+    backdrop?: boolean
+
+    /**
+     * Define o cabeçalho da modal
+     */
+    header?: React.ReactNode | string | false;
+
+    /**
+     * Define o rodapé da modal
+     */
+    footer?: React.ReactNode | string;
+
+    /**
+     * Define o tamanho da modal
+     */
+    sizes?: "small" | "medium" | "large" | "extra-large";
+
+    /**
+     * Define o icone do campo
+     */
+    icon?: string
+
+    /**
+     * Define o prefixo dos icones do pacote
+     */
+    iconPrefix?: "bi bi-" | "pi pi-"
+
+    /**
+     * Define a propriedade css `zindex` da modal
+     */
+    zIndex?: number;
+
+    /**
+     * Metodo responsável por atualizar state do modal
+     */
+    onVisible(value: boolean): void;
+}
+
+/**
+ * Componente - `Modal`
+ *
+ * Um componente versátil que é utilizado exibir dados em forma de janela suspensa.
+ */
+declare function Modal(props: ModalProps): React.JSX.Element;
+
+export { Modal };

package/modal/index.esm.js

@@ -0,0 +1,2 @@
+import e,{useState as i}from"react";import{Dialog as a}from"primereact/dialog";function o(i){const a=void 0!==i.icon?e.createElement("h5",{className:"fw-semibold"},e.createElement("i",{className:"me-1 "+(i.iconPrefix??"bi bi-")+i.icon}),i.header):i.header;return{appendTo:"self",visible:i.visible,onHide(){i.onVisible(!i.visible)},modal:void 0===i.background||i.background,dismissableMask:void 0===i.backdrop||!i.backdrop,maximizable:i.maximizable,draggable:i.draggable,closable:void 0===i.closable||i.closable,baseZIndex:i.zIndex??1e3,position:i.position,header:a,footer:i.footer,showHeader:!(!1===i.header)}}function s(s){let l=s.sizes?"small"===s.sizes?"300px":"medium"===s.sizes?"500px":"large"===s.sizes?"800px":"80%":void 0;const[r,d]=i(s.maximized??!1);return e.createElement(a,{style:r?{}:{width:l},...o(s),breakpoints:{"768px":"80%","576px":"90%"},className:s.className,maximized:r,onMaximize:()=>d(!r)},s.children)}export{s as Modal};
+//# sourceMappingURL=index.esm.js.map

package/modal/index.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":["../../src/modal/core/core.tsx","../../src/modal/modal.tsx"],"sourcesContent":["import React from \"react\";\r\nimport { ModalProps } from \"../types\";\r\nimport { DialogProps } from \"primereact/dialog\";\r\n\r\n/**\r\n * `Core`\r\n * Define as propriedades base para funcionamento da Modal\r\n */\r\nexport function modalCore(\r\n    props: ModalProps\r\n): DialogProps {\r\n    const title = props.icon !== undefined\r\n        ? <h5 className=\"fw-semibold\">\r\n            <i className={\"me-1 \" + (props.iconPrefix ?? \"bi bi-\") + props.icon}/>{props.header}</h5>\r\n        : props.header;\r\n\r\n    return {\r\n        appendTo: \"self\",\r\n        visible: props.visible,\r\n        onHide() {\r\n            props.onVisible(!props.visible);\r\n        },\r\n        modal: props.background === undefined || props.background,\r\n        dismissableMask: props.backdrop === undefined || !props.backdrop,\r\n\r\n        maximizable: props.maximizable,\r\n        draggable: props.draggable,\r\n        closable: props.closable === undefined || props.closable,\r\n        baseZIndex: props.zIndex ?? 1000,\r\n\r\n        position: props.position,\r\n        header: title,\r\n        footer: props.footer,\r\n        showHeader: !(props.header === false),\r\n    };\r\n}","import React, { useState } from \"react\";\r\nimport { ModalProps } from \"./types\";\r\nimport { modalCore } from \"./core/core\";\r\nimport { Dialog } from \"primereact/dialog\";\r\n\r\n/**\r\n * Componente - `Modal`\r\n *\r\n * Um componente versátil que é utilizado exibir dados em forma de janela suspensa.\r\n */\r\nexport function Modal(props: ModalProps) {\r\n    let sizes = !props.sizes ? undefined\r\n        : props.sizes === \"small\" ? \"300px\"\r\n            : props.sizes === \"medium\" ? \"500px\"\r\n                : props.sizes === \"large\" ? \"800px\" : \"80%\";\r\n    const [maximized, setMaximized] = useState(props.maximized ?? false);\r\n\r\n    /*\r\n    |------------------------------------------\r\n    | render() - Renderização do componente\r\n    |------------------------------------------\r\n    */\r\n    return (\r\n        <Dialog style={!maximized ? { width: sizes } : {}}\r\n                {...modalCore(props)}\r\n                breakpoints={{\r\n                    \"768px\": \"80%\",\r\n                    \"576px\": \"90%\",\r\n                }}\r\n                className={props.className}\r\n                maximized={maximized}\r\n                onMaximize={() => setMaximized(!maximized)}>\r\n            {props.children}\r\n        </Dialog>\r\n    );\r\n}"],"names":["modalCore","props","title","undefined","icon","React","createElement","className","iconPrefix","header","appendTo","visible","onHide","onVisible","modal","background","dismissableMask","backdrop","maximizable","draggable","closable","baseZIndex","zIndex","position","footer","showHeader","Modal","sizes","maximized","setMaximized","useState","Dialog","style","width","breakpoints","onMaximize","children"],"mappings":"+EAQM,SAAUA,EACZC,GAEA,MAAMC,OAAuBC,IAAfF,EAAMG,KACdC,EAAAC,cAAA,KAAA,CAAIC,UAAU,eACZF,EAAAC,cAAA,IAAA,CAAGC,UAAW,SAAWN,EAAMO,YAAc,UAAYP,EAAMG,OAAQH,EAAMQ,QAC/ER,EAAMQ,OAEZ,MAAO,CACHC,SAAU,OACVC,QAASV,EAAMU,QACf,MAAAC,GACIX,EAAMY,WAAWZ,EAAMU,QAC1B,EACDG,WAA4BX,IAArBF,EAAMc,YAA4Bd,EAAMc,WAC/CC,qBAAoCb,IAAnBF,EAAMgB,WAA2BhB,EAAMgB,SAExDC,YAAajB,EAAMiB,YACnBC,UAAWlB,EAAMkB,UACjBC,cAA6BjB,IAAnBF,EAAMmB,UAA0BnB,EAAMmB,SAChDC,WAAYpB,EAAMqB,QAAU,IAE5BC,SAAUtB,EAAMsB,SAChBd,OAAQP,EACRsB,OAAQvB,EAAMuB,OACdC,cAA+B,IAAjBxB,EAAMQ,QAE5B,CCzBM,SAAUiB,EAAMzB,GAClB,IAAI0B,EAAS1B,EAAM0B,MACG,UAAhB1B,EAAM0B,MAAoB,QACN,WAAhB1B,EAAM0B,MAAqB,QACP,UAAhB1B,EAAM0B,MAAoB,QAAU,WAHvBxB,EAI3B,MAAOyB,EAAWC,GAAgBC,EAAS7B,EAAM2B,YAAa,GAO9D,OACIvB,EAACC,cAAAyB,EAAO,CAAAC,MAAQJ,EAA+B,CAAA,EAAnB,CAAEK,MAAON,MACzB3B,EAAUC,GACdiC,YAAa,CACT,QAAS,MACT,QAAS,OAEb3B,UAAWN,EAAMM,UACjBqB,UAAWA,EACXO,WAAY,IAAMN,GAAcD,IACnC3B,EAAMmC,SAGnB"}

package/modal/package.json

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

package/package.json

@@ -1,9 +1,9 @@
 {
         "name": "@orangesix/react",
-        "version": "1.1.1",
+        "version": "1.3.1",
         "private": false,
         "author": "Luiz Fernando Bernardes de Paula",
-        "description": "Biblioteca de components React UI pronto para uso.",
+        "description": "Biblioteca de components React UI.",
         "repository": {
             "type": "git",
             "url": "https://github.com/Nandovga/orangesix-react.git"
@@ -13,25 +13,29 @@
             "url": "https://github.com/Nandovga/orangesix-react/issues"
         },
         "dependencies": {
-  "@tiptap/extension-color": "^2.11.5",
-  "@tiptap/extension-highlight": "^2.11.5",
-  "@tiptap/extension-image": "^2.11.5",
-  "@tiptap/extension-link": "^2.11.5",
-  "@tiptap/extension-text-style": "^2.11.5",
-  "@tiptap/extension-underline": "^2.11.5",
-  "@tiptap/pm": "^2.11.5",
-  "@tiptap/react": "^2.11.5",
-  "@tiptap/starter-kit": "^2.11.5",
-  "@webdatarocks/react-webdatarocks": "^1.4.15",
-  "axios": "^1.7.9",
-  "bootstrap": "^5.3.3",
-  "bootstrap-icons": "^1.11.3",
+  "@tiptap/extension-color": "^2.12.0",
+  "@tiptap/extension-highlight": "^2.12.0",
+  "@tiptap/extension-image": "^2.12.0",
+  "@tiptap/extension-link": "^2.12.0",
+  "@tiptap/extension-text-style": "^2.12.0",
+  "@tiptap/extension-underline": "^2.12.0",
+  "@tiptap/pm": "^2.12.0",
+  "@tiptap/react": "^2.12.0",
+  "@tiptap/starter-kit": "^2.12.0",
+  "@webdatarocks/react-webdatarocks": "^1.4.18",
+  "animate.css": "^4.1.1",
+  "axios": "^1.9.0",
+  "bootstrap": "^5.3.6",
+  "bootstrap-icons": "^1.12.1",
   "jquery": "^3.7.1",
   "node-snackbar": "^0.1.16",
   "primeicons": "^7.0.0",
-  "primereact": "^10.9.2",
-  "react": "^19.0.0",
-  "react-dom": "^19.0.0",
-  "sweetalert2": "^11.15.10"
+  "primereact": "^10.9.5",
+  "react": "^19.1.0",
+  "react-dom": "^19.1.0",
+  "react-hook-form": "^7.56.3",
+  "sweetalert2": "^11.21.0",
+  "sweetalert2-react-content": "^5.1.0",
+  "tippy.js": "^6.3.7"
 }
     }

package/picklist/index.cjs.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react"),t=require("primereact/utils"),a=require("primereact/checkbox"),i=require("primereact/picklist");const r=({children:a,...i})=>{const r={size:`box-size-${i.size??"100"}`,direction:`box-direction-${i.direction??"row"}`,justify:void 0===i.justify?"":Array.isArray(i.justify)?i.justify?.join(" "):i.justify,align:void 0===i.align?"":Array.isArray(i.align)?i.align?.join(" "):i.align},s={className:t.classNames(["box",i.className??"",r.size,r.direction,r.justify,r.align]),style:i.css,id:i.id};return e.createElement("div",{...s},a)};function s(t){return e.createElement("div",{className:"w-100 d-flex px-2 align-items-center"},e.createElement(a.Checkbox,{checked:t.selected??!1,className:"me-2",defaultChecked:t.selected}),e.createElement("p",{className:"m-0"},t.label))}function c(e){return{dataKey:e.dataKey??"id",showSourceControls:!1,showTargetControls:!1,sourceHeader:e.sourceHeader,targetHeader:e.targetHeader,itemTemplate:s,filter:e.filter??void 0,filterBy:e.filter?e.filterBy??"label":void 0,sourceFilterPlaceholder:"Pesquisa pelo nome",targetFilterPlaceholder:"Pesquisa pelo nome"}}exports.PickList=function(t){const[a,s]=e.useState([]),[l,o]=e.useState([]);return e.useEffect((()=>{s(t.data.filter((e=>void 0===e.active||!e.active))),o(t.data.filter((e=>e.active)))}),[t.data]),e.createElement(r,{className:t.className,css:t.css,size:t.size??"100"},e.createElement(i.PickList,{className:"w-100",source:a,target:l,onChange:e=>{let a=e.target.map((e=>(delete e.selected,{...e,active:!0}))),i=e.source.map((e=>(delete e.selected,{...e,active:!1})));o(a),s(i),t.onChange([...i,...a])},onSourceSelectionChange:e=>s(a.map((t=>({...t,selected:e.value?.some((e=>e.id===t.id))})))),onTargetSelectionChange:e=>o(l.map((t=>({...t,selected:e.value?.some((e=>e.id===t.id))})))),...c(t)}))};
+//# sourceMappingURL=index.cjs.js.map

package/picklist/index.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs.js","sources":["../../src/box/box.tsx","../../src/picklist/core/core.tsx","../../src/picklist/picklist.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 { Checkbox } from \"primereact/checkbox\";\r\nimport { PickListDataProps, PickListProps } from \"../types\";\r\nimport { PickListProps as PickListPrimeProps } from \"primereact/picklist\";\r\n\r\n/**\r\n * `Template`\r\n * Define o template padrão dos item do PickList\r\n */\r\nfunction pickListItemTemplate(\r\n    item: PickListDataProps & { selected?: boolean }\r\n) {\r\n    return (\r\n        <div className=\"w-100 d-flex px-2 align-items-center\">\r\n            <Checkbox checked={item.selected ?? false}\r\n                      className=\"me-2\"\r\n                      defaultChecked={item.selected}/>\r\n            <p className=\"m-0\">{item.label}</p>\r\n        </div>\r\n    );\r\n}\r\n\r\n/**\r\n * `Core`\r\n * Define as propriedades base para funcionamento do picklist\r\n */\r\nexport function pickListCore(\r\n    props: PickListProps\r\n): PickListPrimeProps {\r\n    return {\r\n        dataKey: props.dataKey ?? \"id\",\r\n        showSourceControls: false,\r\n        showTargetControls: false,\r\n        sourceHeader: props.sourceHeader,\r\n        targetHeader: props.targetHeader,\r\n        itemTemplate: pickListItemTemplate,\r\n\r\n        filter: props.filter ?? undefined,\r\n        filterBy: props.filter ? (props.filterBy ?? \"label\") : undefined,\r\n        sourceFilterPlaceholder: \"Pesquisa pelo nome\",\r\n        targetFilterPlaceholder: \"Pesquisa pelo nome\",\r\n    };\r\n}","import { Box } from \"../box\";\r\nimport { PickListProps } from \"./types\";\r\nimport { pickListCore } from \"./core/core\";\r\nimport React, { useState, useEffect } from \"react\";\r\nimport { PickList as PickListPrime } from \"primereact/picklist\";\r\n\r\n/**\r\n * Componente - `PickList`\r\n *\r\n * Um componente versátil que é utilizado para reordenar itens entre listas diferentes.\r\n */\r\nexport function PickList(props: PickListProps) {\r\n    const [source, setSource] = useState<any>([]);\r\n    const [target, setTarget] = useState<any>([]);\r\n\r\n    useEffect(() => {\r\n        setSource(props.data.filter(item => item.active === undefined || !item.active));\r\n        setTarget(props.data.filter(item => item.active));\r\n    }, [props.data]);\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            <PickListPrime className=\"w-100\"\r\n                           source={source}\r\n                           target={target}\r\n                           onChange={event => {\r\n                               let target = event.target.map((item: any) => {\r\n                                   delete item.selected;\r\n                                   return { ...item, active: true };\r\n                               });\r\n                               let source = event.source.map((item: any) => {\r\n                                   delete item.selected;\r\n                                   return { ...item, active: false };\r\n                               });\r\n                               setTarget(target);\r\n                               setSource(source);\r\n                               props.onChange([...source, ...target]);\r\n                           }}\r\n                           onSourceSelectionChange={event => setSource(source.map((item: any) => {\r\n                               return { ...item, selected: event.value?.some((obj: any) => obj.id === item.id) };\r\n                           }))}\r\n                           onTargetSelectionChange={event => setTarget(target.map((item: any) => {\r\n                               return { ...item, selected: event.value?.some((obj: any) => obj.id === item.id) };\r\n                           }))}\r\n                           {...pickListCore(props)}/>\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","pickListItemTemplate","item","Checkbox","checked","selected","defaultChecked","label","pickListCore","dataKey","showSourceControls","showTargetControls","sourceHeader","targetHeader","itemTemplate","filter","filterBy","sourceFilterPlaceholder","targetFilterPlaceholder","source","setSource","useState","target","setTarget","useEffect","data","active","PickListPrime","onChange","event","map","onSourceSelectionChange","value","some","obj","onTargetSelectionChange"],"mappings":"oIAmBO,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,EChC9C,SAASkB,EACLC,GAEA,OACIH,EAAAC,cAAA,MAAA,CAAKL,UAAU,wCACXI,EAAAC,cAACG,EAAAA,SAAS,CAAAC,QAASF,EAAKG,WAAY,EAC1BV,UAAU,OACVW,eAAgBJ,EAAKG,WAC/BN,EAAGC,cAAA,IAAA,CAAAL,UAAU,OAAOO,EAAKK,OAGrC,CAMM,SAAUC,EACZxB,GAEA,MAAO,CACHyB,QAASzB,EAAMyB,SAAW,KAC1BC,oBAAoB,EACpBC,oBAAoB,EACpBC,aAAc5B,EAAM4B,aACpBC,aAAc7B,EAAM6B,aACpBC,aAAcb,EAEdc,OAAQ/B,EAAM+B,aAAU1B,EACxB2B,SAAUhC,EAAM+B,OAAU/B,EAAMgC,UAAY,aAAW3B,EACvD4B,wBAAyB,qBACzBC,wBAAyB,qBAEjC,kBC/BM,SAAmBlC,GACrB,MAAOmC,EAAQC,GAAaC,EAAAA,SAAc,KACnCC,EAAQC,GAAaF,EAAAA,SAAc,IAY1C,OAVAG,EAAAA,WAAU,KACNJ,EAAUpC,EAAMyC,KAAKV,QAAOb,QAAwBb,IAAhBa,EAAKwB,SAAyBxB,EAAKwB,UACvEH,EAAUvC,EAAMyC,KAAKV,QAAOb,GAAQA,EAAKwB,SAAQ,GAClD,CAAC1C,EAAMyC,OAQN1B,gBAACjB,EAAG,CAACa,UAAWX,EAAMW,UACjBV,IAAKD,EAAMC,IACXC,KAAMF,EAAME,MAAQ,OACrBa,EAAAC,cAAC2B,WAAc,CAAAhC,UAAU,QACVwB,OAAQA,EACRG,OAAQA,EACRM,SAAUC,IACN,IAAIP,EAASO,EAAMP,OAAOQ,KAAK5B,WACpBA,EAAKG,SACL,IAAKH,EAAMwB,QAAQ,MAE1BP,EAASU,EAAMV,OAAOW,KAAK5B,WACpBA,EAAKG,SACL,IAAKH,EAAMwB,QAAQ,MAE9BH,EAAUD,GACVF,EAAUD,GACVnC,EAAM4C,SAAS,IAAIT,KAAWG,GAAQ,EAE1CS,wBAAyBF,GAAST,EAAUD,EAAOW,KAAK5B,IAC7C,IAAKA,EAAMG,SAAUwB,EAAMG,OAAOC,MAAMC,GAAaA,EAAIpC,KAAOI,EAAKJ,UAEhFqC,wBAAyBN,GAASN,EAAUD,EAAOQ,KAAK5B,IAC7C,IAAKA,EAAMG,SAAUwB,EAAMG,OAAOC,MAAMC,GAAaA,EAAIpC,KAAOI,EAAKJ,aAE5EU,EAAaxB,KAG5C"}