@pismo/marola 1.0.0-beta.8 → 1.0.0

package/dist/components/Description/Description.js

@@ -0,0 +1,66 @@
+import '../../assets/Description.css';
+import { jsxs as u, jsx as t } from "react/jsx-runtime";
+import { c as g } from "../../clsx-DB4S2d7J.js";
+import { Skeleton as y } from "../Skeleton/Skeleton.js";
+import { Typography as _ } from "../Typography/Typography.js";
+const l = "_container_he0z3_78", a = {
+  "u-typography-h1": "_u-typography-h1_he0z3_1",
+  "u-typography-h2": "_u-typography-h2_he0z3_8",
+  "u-typography-h3": "_u-typography-h3_he0z3_15",
+  "u-typography-h4": "_u-typography-h4_he0z3_22",
+  "u-typography-h5": "_u-typography-h5_he0z3_29",
+  "u-typography-h6": "_u-typography-h6_he0z3_36",
+  "u-typography-base": "_u-typography-base_he0z3_43",
+  "u-typography-base--xxl": "_u-typography-base--xxl_he0z3_49",
+  "u-typography-base--xl": "_u-typography-base--xl_he0z3_53",
+  "u-typography-base--lg": "_u-typography-base--lg_he0z3_57",
+  "u-typography-base--sm": "_u-typography-base--sm_he0z3_61",
+  "u-typography-base--bold": "_u-typography-base--bold_he0z3_65",
+  "u-typography-base--strikethrough": "_u-typography-base--strikethrough_he0z3_68",
+  "u-typography-base--underlined": "_u-typography-base--underlined_he0z3_71",
+  "u-typography-base--strikethrough-underlined": "_u-typography-base--strikethrough-underlined_he0z3_74",
+  container: l,
+  "container--text": "_container--text_he0z3_82",
+  "container--inline": "_container--inline_he0z3_85"
+}, m = ({
+  label: s,
+  value: n,
+  isLoading: r,
+  color: h = "var(--gray-95)",
+  "data-testid": e = "Description",
+  inline: p,
+  labelVariant: i = "base",
+  valueVariant: o
+}) => /* @__PURE__ */ u(
+  "div",
+  {
+    className: g([a.container, { [a["container--inline"]]: p }]),
+    "data-testid": `${e}-container`,
+    children: [
+      /* @__PURE__ */ t(
+        _,
+        {
+          color: h,
+          className: a["container--text"],
+          variant: i,
+          "data-testid": `${e}-label`,
+          children: r ? /* @__PURE__ */ t(y, { style: { width: 70, marginBottom: 2 }, "data-testid": `${e}-skeletonLabel` }) : s
+        }
+      ),
+      /* @__PURE__ */ t(
+        _,
+        {
+          className: a["container--text"],
+          bold: !0,
+          color: h,
+          variant: o || (p ? "base" : "base-lg"),
+          "data-testid": `${e}-value`,
+          children: r ? /* @__PURE__ */ t(y, { style: { width: 100 }, "data-testid": `${e}-skeletonValue` }) : n || "-"
+        }
+      )
+    ]
+  }
+);
+export {
+  m as Description
+};

package/dist/components/Description/Description.stories.d.ts

@@ -0,0 +1,22 @@
+import { StoryObj } from '@storybook/react';
+
+declare const meta: {
+    title: string;
+    component: ({ label, value, isLoading, color, "data-testid": dataTestId, inline, labelVariant, valueVariant, }: import('./Description').DescriptionProps) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    parameters: {
+        layout: string;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Simple: Story;
+export declare const WithColor: Story;
+export declare const InLine: Story;
+export declare const InLineWithColor: Story;
+export declare const Loading: Story;
+export declare const LoadingInline: Story;
+export declare const InLineWithButton: Story;
+export declare const WithButton: Story;
+export declare const WithSmallSize: Story;
+export declare const WithLargeSize: Story;

package/dist/components/Description/Description.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/Dialog/Actions.js

@@ -1,5 +1,5 @@
 import { jsx as o } from "react/jsx-runtime";
-import { s as t } from "../../Dialog.module-DFEmFdYT.js";
+import { s as t } from "../../Dialog.module-W7UCXlf3.js";
 const i = ({ children: s }) => /* @__PURE__ */ o("div", { className: t.dialog__actions, children: s });
 export {
   i as default

package/dist/components/Dialog/Backdrop.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
-declare const Backdrop: import('react').ForwardRefExoticComponent<{
-    open?: boolean | undefined;
+import { ModalBackdropSlotProps } from '@mui/base';
+
+declare const Backdrop: import('react').ForwardRefExoticComponent<ModalBackdropSlotProps & {
     className: string;
 } & import('react').RefAttributes<HTMLDivElement>>;
 export default Backdrop;

package/dist/components/Dialog/Backdrop.js

@@ -1,10 +1,11 @@
 import { jsx as a } from "react/jsx-runtime";
-import { forwardRef as t } from "react";
-import { s as e } from "../../Dialog.module-DFEmFdYT.js";
-const i = t((o, r) => {
-  const { open: m, className: p, ...s } = o;
-  return /* @__PURE__ */ a("div", { className: e.dialog__backdrop, ref: r, ...s });
-});
+import { forwardRef as s } from "react";
+import { c as t } from "../../clsx-DB4S2d7J.js";
+import { s as m } from "../../Dialog.module-W7UCXlf3.js";
+const l = s(
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  ({ ownerState: e, ...r }, o) => /* @__PURE__ */ a("div", { ...r, className: t(m.dialog__backdrop, r.className), ref: o })
+);
 export {
-  i as default
+  l as default
 };

package/dist/components/Dialog/CloseIconButton.d.ts

@@ -1,6 +1,5 @@
 export interface CloseIconButtonProps {
     handleOnClose: () => void;
-    className: string;
 }
-declare const CloseIconButton: ({ handleOnClose, className }: CloseIconButtonProps) => import("react/jsx-runtime").JSX.Element;
+declare const CloseIconButton: ({ handleOnClose }: CloseIconButtonProps) => import("react/jsx-runtime").JSX.Element;
 export default CloseIconButton;

package/dist/components/Dialog/CloseIconButton.js

@@ -1,20 +1,17 @@
-import { jsx as s } from "react/jsx-runtime";
-import { Icon as r } from "../Icon/Icon.js";
-import { s as t } from "../../Dialog.module-DFEmFdYT.js";
-import { B as a } from "../../Button-DiLqcAJG.js";
-const d = ({ handleOnClose: i, className: o }) => {
-  const l = o != null ? t["dialog__close-icon "] + o : t["dialog__close-icon"];
-  return /* @__PURE__ */ s(
-    a,
-    {
-      className: l,
-      "aria-description": "Close dialog",
-      onClick: i,
-      "data-testid": "dialog-close-button",
-      children: /* @__PURE__ */ s(r, { icon: "circle-xmark", size: 32, color: "var(--gray-75)" })
-    }
-  );
-};
+import { jsx as o } from "react/jsx-runtime";
+import { Icon as i } from "../Icon/Icon.js";
+import { s as r } from "../../Dialog.module-W7UCXlf3.js";
+import { B as s } from "../../Button-BAljjMv3.js";
+const n = ({ handleOnClose: t }) => /* @__PURE__ */ o(
+  s,
+  {
+    className: r["dialog__close-icon"],
+    "aria-description": "Close dialog",
+    onClick: t,
+    "data-testid": "dialog-close-button",
+    children: /* @__PURE__ */ o(i, { icon: "circle-xmark", size: 24, color: "#3F3D4B73" })
+  }
+);
 export {
-  d as default
+  n as default
 };

package/dist/components/Dialog/Dialog.d.ts

@@ -1,22 +1,28 @@
-import { default as DialogTitle } from './DialogTitle';
-import { default as Content } from './Content';
-import { default as Actions } from './Actions';
+import { default as DialogTitle, DialogTitleProps } from './DialogTitle';
+import { default as Content, DialogContentProps } from './Content';
+import { default as Actions, DialogActionProps } from './Actions';
+import { Icon } from '../Icon/Icon';
 import { ModalProps } from '@mui/base';
-import { JSXElementConstructor, ReactElement, ReactNode } from 'react';
+import { ComponentProps, JSXElementConstructor, ReactElement, ReactNode } from 'react';
 
 export type CloseReason = 'backdropClick' | 'escapeKeyDown' | 'closeButtonClick';
-export interface DialogProps extends ModalProps {
+export type DialogProps = Omit<ModalProps, 'onClose'> & {
     /** main content */
     children: ReactElement<unknown, string | JSXElementConstructor<unknown>>;
     /** display title label */
     dialogTitle: ReactNode;
     /** display subtitle */
     dialogSubtitle?: ReactNode;
-    /** if true, show skeleton */
-    isLoading?: boolean;
+    /** icon to show in the left side of the title */
+    icon?: ComponentProps<typeof Icon>;
     /** callback for when close is clicked */
-    onClose?: () => void;
-}
-declare const Dialog: ({ children, dialogTitle, dialogSubtitle, isLoading, onClose, ...props }: DialogProps) => import("react/jsx-runtime").JSX.Element;
+    onClose?: (reason?: CloseReason) => void;
+};
+declare const Dialog: {
+    ({ children, dialogTitle, dialogSubtitle, icon, onClose, ...props }: DialogProps): import("react/jsx-runtime").JSX.Element;
+    Title: import('react').FunctionComponent<DialogTitleProps>;
+    Content: import('react').FunctionComponent<DialogContentProps>;
+    Actions: import('react').FunctionComponent<DialogActionProps>;
+};
 export { Dialog, DialogTitle, Content, Actions };
 export default Dialog;