@orangesix/react 1.0.9 → 1.0.10

package/api/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";
+"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"},"*"));
 //# sourceMappingURL=index.cjs.js.map

package/api/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
+{"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"}

package/api/index.d.ts

@@ -1,10 +1,91 @@
-import { CSSProperties } from 'react';
+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
      */
@@ -19,8 +100,65 @@ interface ApiComponentProps {
      * Define as propriedades css do component `style`
      */
     css?: CSSProperties
+}
+
+/**
+ * Define as tipagens ´default´ de tidos os componente de entrada de dados do pacote
+ */
+interface ApiFieldComponentProps {
+
+    /**
+     * Define o id do campo
+     */
+    id?: string
+
+    /**
+     * Define o nome do campo
+     */
+    name?: string
+
+    /**
+     * Define o rótulo do campo
+     */
+    label?: string
+
+    /**
+     * Define o espaço reservador do campo
+     */
+    placeholder?: string
+
+    /**
+     * Define o icone do campo
+     */
+    icon?: string
+
+    /**
+     * Define o prefixo dos icones do pacote
+     */
+    iconPrefix?: "bi bi-" | "pi pi-"
+
+    /**
+     * Define se campo é obrigatório
+     */
+    required?: boolean
+
+    /**
+     * Desabilita a entrada de dados no campo
+     */
+    disabled?: boolean
 }
 
+/**
+ * API - `InputLabel`
+ *
+ * Um componente utilizado como label em todos os componente de campo do pacote.
+ * Permite personalizar o estilo e o conteúdo através de propriedades.
+ */
+declare const InputLabel: ({ iconPrefix, ...props }: ApiFieldComponentProps) => "" | React.JSX.Element | undefined;
+
+type IAlignItemsProps = AlignItemsProps;
 type IAPIComponentProps = ApiComponentProps;
+type IJustifyContentProps = JustifyContentProps;
+type IApiFieldComponentProps = ApiFieldComponentProps;
 
-export type { IAPIComponentProps };
+export { type IAPIComponentProps, type IAlignItemsProps, type IApiFieldComponentProps, type IJustifyContentProps, InputLabel };

package/api/index.esm.js

@@ -1,2 +1,2 @@
-
+import e from"react";const a=({iconPrefix:a="bi bi-",...l})=>l.label&&e.createElement("p",{className:"form-label"},l.icon&&e.createElement("i",{className:a+l.icon+" me-1"}),l.label,l.required&&e.createElement("span",{className:"text-danger"},"*"));export{a as InputLabel};
 //# sourceMappingURL=index.esm.js.map

package/api/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
+{"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"}

package/api/theme.css

@@ -1,378 +1 @@
-@charset "UTF-8";
-:root {
-  --box-size-5: 5%;
-  --box-size-10: 10%;
-  --box-size-12-5: 12.5%;
-  --box-size-15: 15%;
-  --box-size-17-5: 17.5%;
-  --box-size-20: 20%;
-  --box-size-22-5: 25.5%;
-  --box-size-25: 25%;
-  --box-size-30: 30%;
-  --box-size-33: 33.3333%;
-  --box-size-35: 35%;
-  --box-size-40: 40%;
-  --box-size-45: 45%;
-  --box-size-50: 50%;
-  --box-size-55: 55%;
-  --box-size-60: 60%;
-  --box-size-65: 65%;
-  --box-size-70: 70%;
-  --box-size-75: 75%;
-  --box-size-80: 80%;
-  --box-size-85: 85%;
-  --box-size-90: 90%;
-  --box-size-95: 95%;
-  --box-size-100: 100%; }
-
-.box {
-  display: flex;
-  flex-wrap: wrap;
-  position: relative; }
-  .box.box-size-5 {
-    width: calc(var(--box-size-5, 5%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-5 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-10 {
-    width: calc(var(--box-size-10, 10%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-10 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-12-5 {
-    width: calc(var(--box-size-12-5, 12.5%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-12-5 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-15 {
-    width: calc(var(--box-size-15, 15%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-15 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-17-5 {
-    width: calc(var(--box-size-17-5, 17.5%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-17-5 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-20 {
-    width: calc(var(--box-size-20, 20%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-20 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-22-5 {
-    width: calc(var(--box-size-22-5, 25.5%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-22-5 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-25 {
-    width: calc(var(--box-size-25, 25%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-25 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-30 {
-    width: calc(var(--box-size-30, 30%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-30 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-33 {
-    width: calc(var(--box-size-33, 33%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-33 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-35 {
-    width: calc(var(--box-size-35, 35%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-35 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-40 {
-    width: calc(var(--box-size-40, 40%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-40 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-45 {
-    width: calc(var(--box-size-45, 45%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-45 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-50 {
-    width: calc(var(--box-size-50, 50%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-50 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-55 {
-    width: calc(var(--box-size-55, 55%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-55 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-60 {
-    width: calc(var(--box-size-60, 60%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-60 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-65 {
-    width: calc(var(--box-size-65, 65%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-65 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-70 {
-    width: calc(var(--box-size-70, 70%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-70 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-75 {
-    width: calc(var(--box-size-75, 75%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-75 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-80 {
-    width: calc(var(--box-size-80, 80%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-80 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-85 {
-    width: calc(var(--box-size-85, 85%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-85 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-90 {
-    width: calc(var(--box-size-90, 90%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-90 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-95 {
-    width: calc(var(--box-size-95, 95%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-95 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-size-100 {
-    width: calc(var(--box-size-100, 100%) - 0.5rem);
-    margin: calc(0.5rem / 2) calc(0.5rem / 2);
-    padding: 0.5rem; }
-    @media (max-width: 576px) {
-      .box.box-size-100 {
-        width: calc(100% - 0.5rem); } }
-  .box.box-direction-row {
-    flex-direction: row; }
-  .box.box-direction-column {
-    flex-direction: column; }
-
-:root {
-  --table-frozen: #fff;
-  --table-sort-size: 12px;
-  --table-sort-active: #0D6EFD;
-  --table-checkbox-size: 17px;
-  --table-scrollbar: #e1e1e1;
-  --table-select: var(--bs-light, #e1e1e1);
-  --table-header: var(--bs-light, #f5f5f5);
-  --table-footer: var(--bs-light, #f5f5f5);
-  --table-paginator-color: var(--bs-secondary-300, #b9b9b9);
-  --table-paginator-active: var(--bs-primary, #0D6EFD); }
-
-.table-responsive {
-  width: 100%; }
-
-.table {
-  width: 100%;
-  margin-bottom: 0; }
-  .table-footer, .table-header {
-    width: 100%;
-    display: flex;
-    padding: 0;
-    margin: 0;
-    background: var(--table-header, #F5F5F5);
-    border-bottom: 1px solid #dee2e6; }
-  .table-footer {
-    border-top: 1px solid #dee2e6;
-    background: var(--table-footer, #F5F5F5); }
-  .table-sort {
-    cursor: pointer;
-    color: var(--bs-secondary, #5555); }
-    .table-sort svg {
-      width: var(--table-sort-size, 12px);
-      height: var(--table-sort-size, 12px); }
-  .table-sort-active span[data-pc-section='sort'] svg {
-    color: var(--bs-primary, #0D6EFD); }
-  .table-resizable {
-    text-overflow: ellipsis; }
-
-/**
- * Personalização do style do PrimeReact
- */
-.p-datatable .p-datatable-wrapper::-webkit-scrollbar {
-  height: 8px; }
-
-.p-datatable .p-datatable-wrapper::-webkit-scrollbar-thumb {
-  background: var(--table-scrollbar, #e1e1e1);
-  border-radius: 10px; }
-
-.p-datatable .p-datatable-tbody .p-highlight {
-  background: var(--table-select, #e1e1e1); }
-  .p-datatable .p-datatable-tbody .p-highlight td {
-    font-weight: bolder; }
-  .p-datatable .p-datatable-tbody .p-highlight td.p-frozen-column {
-    background: var(--table-select, #e1e1e1); }
-
-.p-datatable .p-datatable-tbody .p-row-toggler {
-  width: 14px;
-  height: 14px;
-  margin-left: 5px; }
-
-.p-datatable .p-frozen-column {
-  position: sticky; }
-
-.p-datatable .p-frozen-column[data-pc-section="bodycell"] {
-  background: var(--table-frozen, #fff); }
-
-.p-datatable .p-checkbox-box {
-  width: var(--table-checkbox-size, 17px);
-  height: var(--table-checkbox-size, 17px); }
-
-.p-datatable .p-checkbox.p-highlight .p-checkbox-box {
-  background: var(--bs-primary, #0D6EFD);
-  border-color: var(--bs-primary, #0D6EFD); }
-
-.p-datatable .p-checkbox:has(.p-checkbox-input:hover) .p-highlight .p-checkbox-box {
-  border-color: var(--bs-primary, #0D6EFD); }
-
-.p-datatable .p-paginator .p-paginator-first,
-.p-datatable .p-paginator .p-paginator-page,
-.p-datatable .p-paginator .p-paginator-last {
-  font-size: .9em;
-  min-width: 28px;
-  height: 28px;
-  color: var(--table-paginator-color, #b9b9b9); }
-
-.p-datatable .p-paginator .p-paginator-page.p-highlight {
-  color: #fff;
-  border: none;
-  background: var(--table-paginator-active, #0D6EFD); }
-
-:root {
-  --editor-font-size: 1em;
-  --editor-border-radius: 3px;
-  --editor-background: transparent;
-  --editor-border-color: var(--bs-gray-500, #adb5bd);
-  --editor-menu-font-size: 1.2em;
-  --editor-active-menu-color: var(--bs-primary, #0D6EFD); }
-
-.editor-container {
-  position: relative;
-  width: 100%;
-  display: flex;
-  flex-wrap: wrap;
-  border-radius: var(--editor-border-radius);
-  border: 1px solid var(--editor-border-color);
-  /**
-   * Personalização do style do Tiptap
-   */ }
-  .editor-container .editor {
-    width: 100%;
-    font-size: var(--editor-font-size);
-    background: var(--editor-background); }
-  .editor-container .editor-menu {
-    overflow-x: auto;
-    display: flex;
-    width: 100%;
-    padding: 2.5px;
-    align-items: center;
-    border-bottom: 1px solid var(--editor-border-color); }
-    .editor-container .editor-menu-group {
-      display: flex;
-      margin: auto 10px; }
-    .editor-container .editor-menu-item {
-      margin: auto 5px;
-      font-size: var(--editor-menu-font-size); }
-    .editor-container .editor-menu-item.active {
-      color: var(--editor-active-menu-color); }
-  .editor-container .editor-menu::-webkit-scrollbar {
-    height: 2px;
-    width: 0;
-    background: transparent; }
-  .editor-container .editor-menu::-webkit-scrollbar-thumb {
-    border-radius: 5px;
-    background: var(--editor-border-color);
-    border: none; }
-  .editor-container .editor-link {
-    display: flex;
-    min-width: 300px;
-    z-index: 5000;
-    align-items: center;
-    top: 45px;
-    left: 10px;
-    border: 1px solid #f1f1f1;
-    border-radius: 3px;
-    padding: 10px;
-    background: #fff;
-    position: absolute; }
-  .editor-container .editor-image {
-    margin-top: 3px;
-    position: relative; }
-    .editor-container .editor-image input {
-      position: absolute;
-      top: 0;
-      left: 0;
-      right: 0;
-      bottom: 0;
-      opacity: 0; }
-  .editor-container .tiptap {
-    flex: 1;
-    padding: 10px; }
-    .editor-container .tiptap a {
-      color: var(--bs-primary);
-      text-decoration: underline solid var(--bs-primary); }
-    .editor-container .tiptap code {
-      background: #f0f0f0;
-      border-bottom: 3px;
-      padding: 2px 4px;
-      font-size: 85%; }
-    .editor-container .tiptap img {
-      max-width: 100%; }
-  .editor-container .tiptap.ProseMirror-focused {
-    border-radius: var(--editor-border-radius, 3px);
-    outline: none !important; }
+:root{--box-size-5: 5%;--box-size-10: 10%;--box-size-12-5: 12.5%;--box-size-15: 15%;--box-size-17-5: 17.5%;--box-size-20: 20%;--box-size-22-5: 25.5%;--box-size-25: 25%;--box-size-30: 30%;--box-size-33: 33.3333%;--box-size-35: 35%;--box-size-40: 40%;--box-size-45: 45%;--box-size-50: 50%;--box-size-55: 55%;--box-size-60: 60%;--box-size-65: 65%;--box-size-70: 70%;--box-size-75: 75%;--box-size-80: 80%;--box-size-85: 85%;--box-size-90: 90%;--box-size-95: 95%;--box-size-100: 100%}.box{display:flex;flex-wrap:wrap;position:relative}.box.box-size-5{width:calc(var(--box-size-5, 5%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-5{width:calc(100% - .5rem)}}.box.box-size-10{width:calc(var(--box-size-10, 10%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-10{width:calc(100% - .5rem)}}.box.box-size-12-5{width:calc(var(--box-size-12-5, 12.5%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-12-5{width:calc(100% - .5rem)}}.box.box-size-15{width:calc(var(--box-size-15, 15%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-15{width:calc(100% - .5rem)}}.box.box-size-17-5{width:calc(var(--box-size-17-5, 17.5%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-17-5{width:calc(100% - .5rem)}}.box.box-size-20{width:calc(var(--box-size-20, 20%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-20{width:calc(100% - .5rem)}}.box.box-size-22-5{width:calc(var(--box-size-22-5, 25.5%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-22-5{width:calc(100% - .5rem)}}.box.box-size-25{width:calc(var(--box-size-25, 25%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-25{width:calc(100% - .5rem)}}.box.box-size-30{width:calc(var(--box-size-30, 30%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-30{width:calc(100% - .5rem)}}.box.box-size-33{width:calc(var(--box-size-33, 33%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-33{width:calc(100% - .5rem)}}.box.box-size-35{width:calc(var(--box-size-35, 35%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-35{width:calc(100% - .5rem)}}.box.box-size-40{width:calc(var(--box-size-40, 40%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-40{width:calc(100% - .5rem)}}.box.box-size-45{width:calc(var(--box-size-45, 45%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-45{width:calc(100% - .5rem)}}.box.box-size-50{width:calc(var(--box-size-50, 50%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-50{width:calc(100% - .5rem)}}.box.box-size-55{width:calc(var(--box-size-55, 55%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-55{width:calc(100% - .5rem)}}.box.box-size-60{width:calc(var(--box-size-60, 60%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-60{width:calc(100% - .5rem)}}.box.box-size-65{width:calc(var(--box-size-65, 65%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-65{width:calc(100% - .5rem)}}.box.box-size-70{width:calc(var(--box-size-70, 70%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-70{width:calc(100% - .5rem)}}.box.box-size-75{width:calc(var(--box-size-75, 75%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-75{width:calc(100% - .5rem)}}.box.box-size-80{width:calc(var(--box-size-80, 80%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-80{width:calc(100% - .5rem)}}.box.box-size-85{width:calc(var(--box-size-85, 85%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-85{width:calc(100% - .5rem)}}.box.box-size-90{width:calc(var(--box-size-90, 90%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-90{width:calc(100% - .5rem)}}.box.box-size-95{width:calc(var(--box-size-95, 95%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-95{width:calc(100% - .5rem)}}.box.box-size-100{width:calc(var(--box-size-100, 100%) - .5rem);margin:calc(.5rem / 2) calc(.5rem / 2);padding:.5rem}@media (max-width: 576px){.box.box-size-100{width:calc(100% - .5rem)}}.box.box-direction-row{flex-direction:row}.box.box-direction-column{flex-direction:column}:root{--table-frozen: #fff;--table-sort-size: 12px;--table-sort-active: #0D6EFD;--table-checkbox-size: 17px;--table-scrollbar: #e1e1e1;--table-select: var(--bs-light, #e1e1e1);--table-header: var(--bs-light, #f5f5f5);--table-footer: var(--bs-light, #f5f5f5);--table-paginator-color: var(--bs-secondary-300, #b9b9b9);--table-paginator-active: var(--bs-primary, #0D6EFD)}.table-responsive{width:100%}.table{width:100%;margin-bottom:0}.table-footer,.table-header{width:100%;display:flex;padding:0;margin:0;background:var(--table-header, #f5f5f5);border-bottom:1px solid #dee2e6}.table-footer{border-top:1px solid #dee2e6;background:var(--table-footer, #f5f5f5)}.table-sort{cursor:pointer;color:var(--bs-secondary, rgba(85,85,85,0.333333))}.table-sort svg{width:var(--table-sort-size, 12px);height:var(--table-sort-size, 12px)}.table-sort-active span[data-pc-section='sort'] svg{color:var(--bs-primary, #0D6EFD)}.table-resizable{text-overflow:ellipsis}.p-datatable .p-datatable-wrapper::-webkit-scrollbar{height:8px}.p-datatable .p-datatable-wrapper::-webkit-scrollbar-thumb{background:var(--table-scrollbar, #e1e1e1);border-radius:10px}.p-datatable .p-datatable-tbody .p-highlight{background:var(--table-select, #e1e1e1)}.p-datatable .p-datatable-tbody .p-highlight td{font-weight:bolder}.p-datatable .p-datatable-tbody .p-highlight td.p-frozen-column{background:var(--table-select, #e1e1e1)}.p-datatable .p-datatable-tbody .p-row-toggler{width:14px;height:14px;margin-left:5px}.p-datatable .p-frozen-column{position:sticky}.p-datatable .p-frozen-column[data-pc-section="bodycell"]{background:var(--table-frozen, #fff)}.p-datatable .p-checkbox-box{width:var(--table-checkbox-size, 17px);height:var(--table-checkbox-size, 17px)}.p-datatable .p-checkbox.p-highlight .p-checkbox-box{background:var(--bs-primary, #0D6EFD);border-color:var(--bs-primary, #0D6EFD)}.p-datatable .p-checkbox:has(.p-checkbox-input:hover) .p-highlight .p-checkbox-box{border-color:var(--bs-primary, #0D6EFD)}.p-datatable .p-paginator .p-paginator-first,.p-datatable .p-paginator .p-paginator-page,.p-datatable .p-paginator .p-paginator-last{font-size:.9em;min-width:28px;height:28px;color:var(--table-paginator-color, #b9b9b9)}.p-datatable .p-paginator .p-paginator-page.p-highlight{color:#fff;border:none;background:var(--table-paginator-active, #0D6EFD)}:root{--editor-font-size: 1em;--editor-border-radius: 3px;--editor-background: transparent;--editor-border-color: var(--bs-gray-500, #adb5bd);--editor-menu-font-size: 1.2em;--editor-active-menu-color: var(--bs-primary, #0D6EFD)}.editor-container{position:relative;width:100%;display:flex;flex-wrap:wrap;border-radius:var(--editor-border-radius);border:1px solid var(--editor-border-color)}.editor-container .editor{width:100%;font-size:var(--editor-font-size);background:var(--editor-background)}.editor-container .editor-menu{overflow-x:auto;display:flex;width:100%;padding:2.5px;align-items:center;border-bottom:1px solid var(--editor-border-color)}.editor-container .editor-menu-group{display:flex;margin:auto 10px}.editor-container .editor-menu-item{margin:auto 5px;font-size:var(--editor-menu-font-size)}.editor-container .editor-menu-item.active{color:var(--editor-active-menu-color)}.editor-container .editor-menu::-webkit-scrollbar{height:2px;width:0;background:transparent}.editor-container .editor-menu::-webkit-scrollbar-thumb{border-radius:5px;background:var(--editor-border-color);border:none}.editor-container .editor-link{display:flex;min-width:300px;z-index:5000;align-items:center;top:45px;left:10px;border:1px solid #f1f1f1;border-radius:3px;padding:10px;background:#fff;position:absolute}.editor-container .editor-image{margin-top:3px;position:relative}.editor-container .editor-image input{position:absolute;top:0;left:0;right:0;bottom:0;opacity:0}.editor-container .tiptap{flex:1;padding:10px}.editor-container .tiptap a{color:var(--bs-primary);text-decoration:underline solid var(--bs-primary)}.editor-container .tiptap code{background:#f0f0f0;border-bottom:3px;padding:2px 4px;font-size:85%}.editor-container .tiptap img{max-width:100%}.editor-container .tiptap.ProseMirror-focused{border-radius:var(--editor-border-radius, 3px);outline:none !important}:root{--table-pivot-toolbar-font-size: .9em;--table-pivot-border-radius: 5px;--table-pivot-border-color: var(--bs-gray-300, #e5e5e5);--table-pivot-background: var(--bs-white, #fff);--table-pivot-background-toolbar: transparent;--table-pivot-background-header: #f2f2f2;--table-pivot-background-filter: #e0e0e0;--table-pivot-modal-padding: 1rem;--table-pivot-modal-btn-font-size: .9em;--table-pivot-modal-btn-padding: .375rem .5rem}.pivot-table{position:relative;border:1px dashed var(--table-pivot-border-color);border-radius:var(--table-pivot-border-radius)}.pivot-table #wdr-toolbar-wrapper #wdr-toolbar{background:var(--table-pivot-background-toolbar) !important}.pivot-table #wdr-toolbar-wrapper #wdr-toolbar span{font-size:var(--table-pivot-toolbar-font-size) !important;font-family:var(--bs-body-font-family),serif !important}.pivot-table #wdr-pivot-view .wdr-grid-layout div.wdr-header{background:var(--table-pivot-background-header) !important}.pivot-table #wdr-pivot-view .wdr-grid-layout #wdr-cols-filter{background:var(--table-pivot-background-filter)}.pivot-table #wdr-pivot-view .wdr-ui div{font-family:var(--bs-body-font-family),serif !important}.pivot-table #wdr-pivot-view .wdr-ui div.wdr-cell{background:var(--table-pivot-background);border-color:var(--table-pivot-border-color)}.pivot-table #wdr-pivot-view div.wdr-ui-window{padding:var(--table-pivot-modal-padding)}.pivot-table #wdr-pivot-view div.wdr-ui-window .wdr-popup-subtitle,.pivot-table #wdr-pivot-view div.wdr-ui-window .wdr-popup-title{margin:0;padding:0}.pivot-table #wdr-pivot-view div.wdr-ui-window .wdr-popup-title{font-size:20px}.pivot-table #wdr-pivot-view div.wdr-ui-window .wdr-ui-btn{height:auto;margin:0 .25rem;padding:var(--table-pivot-modal-btn-padding);font-size:var(--table-pivot-modal-btn-font-size)}.pivot-table #wdr-pivot-view div.wdr-ui-window .wdr-selected span,.pivot-table #wdr-pivot-view div.wdr-ui-window .wdr-unchecked span,.pivot-table #wdr-pivot-view div.wdr-ui-window .wdr-checked span{font-family:var(--bs-body-font-family),serif !important}.pivot-table #wdr-pivot-view div.wdr-ui-window .wdr-ui-toggle-btn-dark{margin-bottom:15px !important}.pivot-table .wdr-ui{font-family:var(--bs-body-font-family),serif !important}.pivot-table .wdr-credits{display:none !important}:root{--input-filter-border-color: var(--gray-400, #ccc);--input-filter-border-radius: var(--input-border-radius, 5px)}.input-filter-container{border-radius:var(--input-filter-border-radius);border:1px dashed var(--input-filter-border-color)}.input-filter-content{width:100%;display:flex;align-items:flex-start;gap:.5rem}.input-filter-content .p-autocomplete-multiple{padding:0}.input-filter-content .p-autocomplete-multiple-container{width:100%;padding:.2rem .5rem}.input-filter-content .p-autocomplete-multiple-container .form-control{border:none;padding:.2rem}.input-filter-content .p-autocomplete-multiple-container .p-autocomplete-token{padding:.2rem .5rem;margin:0}.input-filter-content .p-autocomplete-multiple-container.p-focus{box-shadow:none;border-color:var(--input-filter-border-color)}.input-filter-select{width:40%;max-width:200px;min-width:130px}.input-filter-field{width:100% !important}.input-filter-field-date{flex:1}.input-filter-field-date.year{flex:2}.input-filter-autocomplete-panel .p-autocomplete-items{padding-left:0 !important}

package/box/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var i=require("react"),e=require("primereact/utils");exports.Box=({children:r,...s})=>{const t={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},a={className:e.classNames(["box",s.className??"",t.size,t.direction,t.justify,t.align]),style:s.css};return i.createElement("div",{...a},r)};
+"use strict";var i=require("react"),e=require("primereact/utils");exports.Box=({children:r,...s})=>{const t={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},a={className:e.classNames(["box",s.className??"",t.size,t.direction,t.justify,t.align]),style:s.css,id:s.id};return i.createElement("div",{...a},r)};
 //# sourceMappingURL=index.cjs.js.map

package/box/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../src/box/box.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    };\r\n\r\n    return (\r\n        <div {...attr as any}>{children}</div>\r\n    );\r\n};"],"names":["children","props","css","size","direction","justify","undefined","Array","isArray","join","align","attr","className","classNames","style","React","createElement"],"mappings":"8EAmBmB,EAAGA,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,KAGjB,OACIa,EAASC,cAAA,MAAA,IAAAL,GAAcX,EACzB"}
+{"version":3,"file":"index.cjs.js","sources":["../../src/box/box.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};"],"names":["children","props","css","size","direction","justify","undefined","Array","isArray","join","align","attr","className","classNames","style","id","React","createElement"],"mappings":"8EAmBmB,EAAGA,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,EACzB"}

package/box/index.d.ts

@@ -81,6 +81,11 @@ type JustifyContentProps =
  */
 interface ApiComponentProps {
 
+    /**
+     * Propriedade para identificar o id do elemento
+     */
+    id?: string
+
     /**
      * Adiciona no atributo `class` do componente o valor atribuido nessa propriedade
      */
@@ -142,6 +147,4 @@ interface BoxProps extends ApiComponentProps {
  */
 declare const Box: ({ children, ...props }: BoxProps) => React.JSX.Element;
 
-type IBoxProps = BoxProps;
-
-export { Box, type IBoxProps };
+export { Box };

package/box/index.esm.js

@@ -1,2 +1,2 @@
-import i from"react";import{classNames as r}from"primereact/utils";const s=({children:s,...t})=>{const e={size:`box-size-${t.size??"100"}`,direction:`box-direction-${t.direction??"row"}`,justify:void 0===t.justify?"":Array.isArray(t.justify)?t.justify?.join(" "):t.justify,align:void 0===t.align?"":Array.isArray(t.align)?t.align?.join(" "):t.align},o={className:r(["box",t.className??"",e.size,e.direction,e.justify,e.align]),style:t.css};return i.createElement("div",{...o},s)};export{s as Box};
+import i from"react";import{classNames as r}from"primereact/utils";const s=({children:s,...t})=>{const e={size:`box-size-${t.size??"100"}`,direction:`box-direction-${t.direction??"row"}`,justify:void 0===t.justify?"":Array.isArray(t.justify)?t.justify?.join(" "):t.justify,align:void 0===t.align?"":Array.isArray(t.align)?t.align?.join(" "):t.align},o={className:r(["box",t.className??"",e.size,e.direction,e.justify,e.align]),style:t.css,id:t.id};return i.createElement("div",{...o},s)};export{s as Box};
 //# sourceMappingURL=index.esm.js.map

package/box/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":["../../src/box/box.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    };\r\n\r\n    return (\r\n        <div {...attr as any}>{children}</div>\r\n    );\r\n};"],"names":["Box","children","props","css","size","direction","justify","undefined","Array","isArray","join","align","attr","className","classNames","style","React","createElement"],"mappings":"mEAmBO,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,KAGjB,OACIa,EAASC,cAAA,MAAA,IAAAL,GAAcX,EACzB"}
+{"version":3,"file":"index.esm.js","sources":["../../src/box/box.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};"],"names":["Box","children","props","css","size","direction","justify","undefined","Array","isArray","join","align","attr","className","classNames","style","id","React","createElement"],"mappings":"mEAmBO,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,EACzB"}