@grazziotin/react-components-next 0.1.0 → 1.0.0

package/dist/ui/index.js

@@ -0,0 +1,150 @@
+'use strict';
+
+var tailwindMerge = require('tailwind-merge');
+var clsx = require('clsx');
+var material = require('@mui/material');
+var core = require('@mantine/core');
+var jsxRuntime = require('react/jsx-runtime');
+var DialogMui = require('@mui/material/Dialog');
+var DialogTitle = require('@mui/material/DialogTitle');
+var DialogActions = require('@mui/material/DialogActions');
+var DialogContent = require('@mui/material/DialogContent');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var DialogMui__default = /*#__PURE__*/_interopDefault(DialogMui);
+var DialogTitle__default = /*#__PURE__*/_interopDefault(DialogTitle);
+var DialogActions__default = /*#__PURE__*/_interopDefault(DialogActions);
+var DialogContent__default = /*#__PURE__*/_interopDefault(DialogContent);
+
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+function cn(...values) {
+  return tailwindMerge.twMerge(clsx.clsx(values));
+}
+function Card({
+  margin,
+  onClick,
+  title,
+  toolTip,
+  className,
+  borderTitle,
+  children,
+  borderRadius,
+  width = "100%",
+  height = "auto",
+  titleWidth = "100%",
+  justifyContent = "space-between",
+  titleColor = "var(--color-primary)",
+  icon
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    material.Box,
+    {
+      onClick,
+      className: cn(className, "text-sm!"),
+      sx: __spreadValues({
+        width,
+        margin,
+        height,
+        borderRadius,
+        "@media (max-width: 768px)": { width: "100%" },
+        boxShadow: "0 0.15rem 0.5rem rgba(0, 0, 0, 0.16)"
+      }, onClick && { cursor: "pointer !important" }),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          material.Box,
+          {
+            sx: {
+              justifyContent,
+              height: "24px",
+              color: "white",
+              display: "flex",
+              width: titleWidth,
+              overflow: "hidden",
+              padding: "0px 15px",
+              alignItems: "center",
+              flexDirection: "row",
+              borderRadius: borderTitle,
+              backgroundColor: titleColor
+            },
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 flex-1 font-semibold! truncate!", children: /* @__PURE__ */ jsxRuntime.jsx(
+                core.Tooltip,
+                {
+                  withArrow: true,
+                  radius: "md",
+                  label: title,
+                  arrowSize: 6,
+                  position: "top",
+                  arrowOffset: 15,
+                  disabled: !toolTip,
+                  color: titleColor,
+                  classNames: { tooltip: "text-xs!" },
+                  offset: { mainAxis: 11, crossAxis: -21 },
+                  transitionProps: { transition: "fade", duration: 100 },
+                  children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block! truncate!", children: title })
+                }
+              ) }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { children: icon })
+            ]
+          }
+        ),
+        children
+      ]
+    }
+  );
+}
+var card_default = Card;
+
+// src/components/ui/dialog/utils/constants.ts
+var DIALOG_BACKDROP_STYLE = {
+  backdropFilter: "blur(4px)",
+  backgroundColor: "rgba(0, 0, 0, 0.5)"
+};
+function Dialog({
+  open,
+  title,
+  onClose,
+  actions,
+  children,
+  maxWidth,
+  blurBackdrop = false
+}) {
+  const backdropStyle = blurBackdrop ? DIALOG_BACKDROP_STYLE : {};
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    DialogMui__default.default,
+    {
+      fullWidth: true,
+      open,
+      onClose,
+      maxWidth,
+      slotProps: { backdrop: { sx: backdropStyle } },
+      children: [
+        title && /* @__PURE__ */ jsxRuntime.jsx(DialogTitle__default.default, { children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-semibold text-black-de", children: title }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(DialogContent__default.default, { className: "text-black", children }),
+        actions && /* @__PURE__ */ jsxRuntime.jsx(DialogActions__default.default, { children: actions })
+      ]
+    }
+  );
+}
+var dialog_default = Dialog;
+
+exports.Card = card_default;
+exports.Dialog = dialog_default;
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/ui/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/functions/cn/cn.ts","../../src/components/ui/card/index.tsx","../../src/components/ui/dialog/utils/constants.ts","../../src/components/ui/dialog/index.tsx"],"names":["twMerge","clsx","jsxs","Box","jsx","Tooltip","DialogMui","DialogTitle","DialogContent","DialogActions"],"mappings":"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","file":"index.js","sourcesContent":["import { twMerge } from \"tailwind-merge\";\r\nimport { clsx } from \"clsx\";\r\nimport type { ClassValue } from \"./utils/interfaces\";\r\n\r\nexport function cn(...values: ClassValue[]): string {\r\n  return twMerge(clsx(values));\r\n}\r\n","import { cn } from \"@/functions\";\r\nimport { Box } from \"@mui/material\";\r\nimport { Tooltip } from \"@mantine/core\";\r\nimport type { CardProps } from \"./utils/interface\";\r\n\r\n/**\r\n * Container de UI com cabeçalho colorido (título e ícone opcionais) e área de conteúdo.\r\n *\r\n * O card usa MUI `Box` para dimensões, sombra e responsividade; classes Tailwind\r\n * extras podem ser passadas em `className` e são mescladas com `cn`. O título é\r\n * sempre exibido e truncado quando necessário; o tooltip (Mantine) só aparece se\r\n * `toolTip` for `true`.\r\n *\r\n * @param props - Propriedades do componente. Detalhes em {@link CardProps}.\r\n * @param props.width - Largura do card. Padrão: `\"100%\"`.\r\n * @param props.height - Altura do card. Padrão: `\"auto\"`.\r\n * @param props.margin - Margem externa.\r\n * @param props.title - Texto do cabeçalho.\r\n * @param props.toolTip - Habilita tooltip no título.\r\n * @param props.className - `className` nativo do React no container.\r\n * @param props.titleWidth - Largura da barra do cabeçalho. Padrão: `\"100%\"`.\r\n * @param props.titleColor - Cor de fundo do cabeçalho. Padrão: `var(--color-primary)`.\r\n * @param props.borderTitle - `border-radius` só do cabeçalho.\r\n * @param props.onClick - Clique no card; adiciona `cursor: pointer !important`.\r\n * @param props.borderRadius - `border-radius` do container.\r\n * @param props.icon - Conteúdo à direita do título.\r\n * @param props.children - Corpo do card.\r\n * @param props.justifyContent - Alinhamento título/ícone. Padrão: `\"space-between\"`.\r\n *\r\n * @returns Elemento `Box` com cabeçalho e `children`.\r\n *\r\n * @example\r\n * ```tsx\r\n * <Card title=\"Resumo\" toolTip icon={<span>+</span>}>\r\n *   <p>Conteúdo interno</p>\r\n * </Card>\r\n * ```\r\n *\r\n * @example\r\n * ```tsx\r\n * <Card\r\n *   title=\"Clique aqui\"\r\n *   width=\"320px\"\r\n *   onClick={() => alert(\"Card clicado\")}\r\n * >\r\n *   Card interativo\r\n * </Card>\r\n * ```\r\n */\r\nfunction Card({\r\n  margin,\r\n  onClick,\r\n  title,\r\n  toolTip,\r\n  className,\r\n  borderTitle,\r\n  children,\r\n  borderRadius,\r\n  width = \"100%\",\r\n  height = \"auto\",\r\n  titleWidth = \"100%\",\r\n  justifyContent = \"space-between\",\r\n  titleColor = \"var(--color-primary)\",\r\n  icon,\r\n}: Readonly<CardProps>): React.ReactElement {\r\n  return (\r\n    <Box\r\n      onClick={onClick}\r\n      className={cn(className, \"text-sm!\")}\r\n      sx={{\r\n        width,\r\n        margin,\r\n        height,\r\n        borderRadius,\r\n        \"@media (max-width: 768px)\": { width: \"100%\" },\r\n        boxShadow: \"0 0.15rem 0.5rem rgba(0, 0, 0, 0.16)\",\r\n        ...(onClick && { cursor: \"pointer !important\" }),\r\n      }}\r\n    >\r\n      <Box\r\n        sx={{\r\n          justifyContent,\r\n          height: \"24px\",\r\n          color: \"white\",\r\n          display: \"flex\",\r\n          width: titleWidth,\r\n          overflow: \"hidden\",\r\n          padding: \"0px 15px\",\r\n          alignItems: \"center\",\r\n          flexDirection: \"row\",\r\n          borderRadius: borderTitle,\r\n          backgroundColor: titleColor,\r\n        }}\r\n      >\r\n        <span className=\"min-w-0 flex-1 font-semibold! truncate!\">\r\n          <Tooltip\r\n            withArrow\r\n            radius=\"md\"\r\n            label={title}\r\n            arrowSize={6}\r\n            position=\"top\"\r\n            arrowOffset={15}\r\n            disabled={!toolTip}\r\n            color={titleColor}\r\n            classNames={{ tooltip: \"text-xs!\" }}\r\n            offset={{ mainAxis: 11, crossAxis: -21 }}\r\n            transitionProps={{ transition: \"fade\", duration: 100 }}\r\n          >\r\n            <span className=\"block! truncate!\">{title}</span>\r\n          </Tooltip>\r\n        </span>\r\n        <div>{icon}</div>\r\n      </Box>\r\n      {children}\r\n    </Box>\r\n  );\r\n}\r\nexport default Card;\r\n","export const DIALOG_BACKDROP_STYLE = {\r\n  backdropFilter: \"blur(4px)\",\r\n  backgroundColor: \"rgba(0, 0, 0, 0.5)\",\r\n};\r\n\r\nconst dialogConstants = `\r\nModal de diálogo baseado no MUI \\`Dialog\\`, com título, conteúdo e ações opcionais.\r\nSuporta \\`maxWidth\\` e backdrop com blur via \\`blurBackdrop\\`.\r\n\r\n**Importação:**\r\n\\`\\`\\`tsx\r\nimport Dialog from \"@/components/ui/dialog\";\r\n// ou, no pacote publicado:\r\n// import { Dialog } from \"@grazziotin/react-components-next/ui\";\r\n\\`\\`\\`\r\n\r\n**Uso básico:**\r\n\\`\\`\\`tsx\r\nconst [open, setOpen] = useState(false);\r\n\r\n<Dialog\r\n  open={open}\r\n  title=\"Confirmar\"\r\n  onClose={() => setOpen(false)}\r\n  actions={<button type=\"button\">OK</button>}\r\n>\r\n  Conteúdo do diálogo\r\n</Dialog>\r\n\\`\\`\\`\r\n`;\r\n\r\nexport default dialogConstants;\r\n","import React from \"react\";\r\nimport DialogMui from \"@mui/material/Dialog\";\r\nimport type { DialogProps } from \"./utils/interface\";\r\nimport DialogTitle from \"@mui/material/DialogTitle\";\r\nimport DialogActions from \"@mui/material/DialogActions\";\r\nimport DialogContent from \"@mui/material/DialogContent\";\r\nimport { DIALOG_BACKDROP_STYLE } from \"./utils/constants\";\r\n\r\n/**\r\n * Modal de diálogo baseado no MUI `Dialog`, com título, conteúdo e ações opcionais.\r\n *\r\n * O componente usa `fullWidth` por padrão e permite limitar a largura via `maxWidth`.\r\n * Com `blurBackdrop`, o fundo recebe desfoque e overlay escuro semitransparente.\r\n *\r\n * @param props - Propriedades do componente. Detalhes em {@link DialogProps}.\r\n * @param props.open - Controla se o diálogo está visível.\r\n * @param props.title - Título exibido no topo; omitido se não informado.\r\n * @param props.onClose - Callback ao fechar (clique fora, ESC ou botão de fechar do MUI).\r\n * @param props.actions - Rodapé com botões ou ações customizadas.\r\n * @param props.children - Conteúdo principal do diálogo.\r\n * @param props.maxWidth - Largura máxima do MUI (`xs`, `sm`, `md`, `lg`, `xl` ou `false`).\r\n * @param props.blurBackdrop - Aplica blur e escurecimento no backdrop. Padrão: `false`.\r\n *\r\n * @returns Instância do `Dialog` do Material UI.\r\n *\r\n * @example\r\n * ```tsx\r\n * const [open, setOpen] = useState(false);\r\n *\r\n * <Dialog\r\n *   open={open}\r\n *   title=\"Confirmar exclusão\"\r\n *   onClose={() => setOpen(false)}\r\n *   actions={<Button onClick={() => setOpen(false)}>OK</Button>}\r\n * >\r\n *   Deseja realmente excluir este item?\r\n * </Dialog>\r\n * ```\r\n *\r\n * @example\r\n * ```tsx\r\n * <Dialog\r\n *   open={open}\r\n *   onClose={handleClose}\r\n *   maxWidth=\"sm\"\r\n *   blurBackdrop\r\n * >\r\n *   Conteúdo sem título.\r\n * </Dialog>\r\n * ```\r\n */\r\nfunction Dialog({\r\n  open,\r\n  title,\r\n  onClose,\r\n  actions,\r\n  children,\r\n  maxWidth,\r\n  blurBackdrop = false,\r\n}: Readonly<DialogProps>): React.ReactElement {\r\n  const backdropStyle = blurBackdrop ? DIALOG_BACKDROP_STYLE : {};\r\n\r\n  return (\r\n    <DialogMui\r\n      fullWidth\r\n      open={open}\r\n      onClose={onClose}\r\n      maxWidth={maxWidth}\r\n      slotProps={{ backdrop: { sx: backdropStyle } }}\r\n    >\r\n      {title && (\r\n        <DialogTitle>\r\n          <p className=\"text-sm font-semibold text-black-de\">{title}</p>\r\n        </DialogTitle>\r\n      )}\r\n      <DialogContent className=\"text-black\">{children}</DialogContent>\r\n      {actions && <DialogActions>{actions}</DialogActions>}\r\n    </DialogMui>\r\n  );\r\n}\r\n\r\nexport default Dialog;\r\n"]}

package/dist/ui/index.mjs

@@ -0,0 +1,4 @@
+export { card_default as Card, dialog_default as Dialog } from '../chunk-CNXFSE26.mjs';
+import '../chunk-NHHZBMJL.mjs';
+//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map

package/dist/ui/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.mjs"}

package/package.json

@@ -1,73 +1,102 @@
-{
-  "name": "@grazziotin/react-components-next",
-  "version": "0.1.0",
-  "description": "Biblioteca de componentes React reutilizáveis",
-  "private": false,
-  "main": "./dist/index.js",
-  "module": "./dist/index.mjs",
-  "types": "./dist/index.d.ts",
-  "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.js"
-    },
-    "./styles": "./dist/index.css"
-  },
-  "files": [
-    "dist"
-  ],
-  "scripts": {
-    "storybook": "storybook dev -p 6006",
-    "build-storybook": "storybook build",
-    "build:css": "tailwindcss -i ./src/styles/index.css -o ./dist/index.css --minify",
-    "build:lib": "tsup && npm run build:css",
-    "build:lib:watch": "tsup --watch",
-    "type-check": "tsc --noEmit",
-    "lint": "eslint src/",
-    "prepublishOnly": "npm run build:lib"
-  },
-  "keywords": [
-    "react",
-    "components",
-    "ui",
-    "typescript",
-    "tailwindcss"
-  ],
-  "author": "",
-  "license": "MIT",
-  "peerDependencies": {
-    "react": ">=18.0.0",
-    "react-dom": ">=18.0.0"
-  },
-  "dependencies": {
-    "next": "16.2.6",
-    "react": ">=18.0.0",
-    "react-dom": ">=18.0.0"
-  },
-  "devDependencies": {
-    "@chromatic-com/storybook": "^5.2.1",
-    "@storybook/addon-a11y": "^10.4.0",
-    "@storybook/addon-docs": "^10.4.0",
-    "@storybook/addon-mcp": "^0.6.0",
-    "@storybook/addon-vitest": "^10.4.0",
-    "@storybook/nextjs-vite": "^10.4.0",
-    "@tailwindcss/cli": "^4.3.0",
-    "@tailwindcss/postcss": "^4",
-    "@types/node": "^20",
-    "@types/react": "^19",
-    "@types/react-dom": "^19",
-    "@vitest/browser-playwright": "^4.1.7",
-    "@vitest/coverage-v8": "^4.1.7",
-    "eslint": "^9",
-    "eslint-config-next": "16.2.6",
-    "eslint-plugin-storybook": "^10.4.0",
-    "playwright": "^1.60.0",
-    "storybook": "^10.4.0",
-    "tailwindcss": "^4",
-    "tsup": "^8.5.1",
-    "typescript": "^5",
-    "vite": "^8.0.13",
-    "vitest": "^4.1.7"
-  }
-}
+{
+  "name": "@grazziotin/react-components-next",
+  "version": "1.0.0",
+  "description": "Biblioteca de componentes React reutilizáveis",
+  "private": false,
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    },
+    "./ui": {
+      "types": "./dist/ui/index.d.ts",
+      "import": "./dist/ui/index.mjs",
+      "require": "./dist/ui/index.js"
+    },
+    "./functions": {
+      "types": "./dist/functions/index.d.ts",
+      "import": "./dist/functions/index.mjs",
+      "require": "./dist/functions/index.js"
+    },
+    "./styles": "./dist/index.css"
+  },
+  "files": [
+    "dist"
+  ],
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "scripts": {
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build",
+    "build:css": "tailwindcss -i ./src/styles/index.css -o ./dist/index.css --minify",
+    "build:css:src": "tailwindcss -i ./src/styles/index.css -o ./src/styles/tailwind-output.css --minify",
+    "build:lib": "npm run build:css:src && tsup && npm run build:css",
+    "build:lib:watch": "tsup --watch",
+    "type-check": "tsc --noEmit",
+    "lint": "eslint src/",
+    "prepublishOnly": "npm run build:lib"
+  },
+  "keywords": [
+    "react",
+    "components",
+    "ui",
+    "typescript",
+    "tailwindcss"
+  ],
+  "author": "",
+  "license": "MIT",
+  "peerDependencies": {
+    "react": ">=18.0.0",
+    "react-dom": ">=18.0.0"
+  },
+  "dependencies": {
+    "@emotion/react": "^11.14.0",
+    "@emotion/styled": "^11.14.1",
+    "@mantine/core": "^9.2.1",
+    "@mantine/hooks": "^9.2.1",
+    "@mui/material": "^9.0.1",
+    "clsx": "^2.1.1",
+    "next": "^15.5.18",
+    "react": ">=18.0.0",
+    "react-dom": ">=18.0.0",
+    "tailwind-merge": "^3.6.0"
+  },
+  "overrides": {
+    "caniuse-lite": "1.0.30001792"
+  },
+  "devDependencies": {
+    "@chromatic-com/storybook": "^5.2.1",
+    "@storybook/addon-a11y": "^10.4.0",
+    "@storybook/addon-docs": "^10.4.0",
+    "@storybook/addon-mcp": "^0.6.0",
+    "@storybook/addon-vitest": "^10.4.0",
+    "@storybook/react-vite": "^10.4.0",
+    "@tailwindcss/cli": "^4.3.0",
+    "@tailwindcss/postcss": "^4",
+    "@types/node": "^20",
+    "@types/react": "^19",
+    "@types/react-dom": "^19",
+    "@vitest/browser-playwright": "^4.1.7",
+    "@vitest/coverage-v8": "^4.1.7",
+    "eslint": "^9",
+    "eslint-config-next": "^16.2.6",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-prettier": "^5.5.5",
+    "eslint-plugin-storybook": "^10.4.0",
+    "playwright": "^1.60.0",
+    "postcss-preset-mantine": "^1.18.0",
+    "postcss-simple-vars": "^7.0.1",
+    "prettier": "^3.8.3",
+    "storybook": "^10.4.0",
+    "tailwindcss": "^4",
+    "tsup": "^8.5.1",
+    "typescript": "^5",
+    "vite": "^8.0.13",
+    "vitest": "^4.1.7"
+  }
+}