@wellingtonhlc/shared-ui 0.26.3 → 0.26.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,14 +1,16 @@
1
1
  import { type ReactNode } from 'react';
2
2
  export type EmptyStateVariant = 'default' | 'compact';
3
+ export type EmptyStateLayout = 'fill' | 'content';
3
4
  export interface EmptyStateProps {
4
5
  title?: string;
5
6
  description?: string;
6
7
  icon?: ReactNode;
7
8
  showIcon?: boolean;
8
9
  variant?: EmptyStateVariant;
10
+ layout?: EmptyStateLayout;
9
11
  withMargin?: boolean;
10
12
  className?: string;
11
13
  children?: ReactNode;
12
14
  }
13
- export declare function EmptyState({ title, description, icon, showIcon, variant, withMargin, className, children, }: EmptyStateProps): import("react").JSX.Element;
15
+ export declare function EmptyState({ title, description, icon, showIcon, variant, layout, withMargin, className, children, }: EmptyStateProps): import("react").JSX.Element;
14
16
  //# sourceMappingURL=EmptyState.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../src/components/EmptyState.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAIrE,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,SAAS,CAAC;AAEtD,MAAM,WAAW,eAAe;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,UAAU,CAAC,EACzB,KAAwB,EACxB,WAAW,EACX,IAA2B,EAC3B,QAAe,EACf,OAAmB,EACnB,UAAkB,EAClB,SAAS,EACT,QAAQ,GACT,EAAE,eAAe,+BA6BjB"}
1
+ {"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../src/components/EmptyState.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAIrE,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,SAAS,CAAC;AACtD,MAAM,MAAM,gBAAgB,GAAG,MAAM,GAAG,SAAS,CAAC;AAElD,MAAM,WAAW,eAAe;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,UAAU,CAAC,EACzB,KAAwB,EACxB,WAAW,EACX,IAA2B,EAC3B,QAAe,EACf,OAAmB,EACnB,MAAe,EACf,UAAkB,EAClB,SAAS,EACT,QAAQ,GACT,EAAE,eAAe,+BAiCjB"}
@@ -1,14 +1,18 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { cloneElement, isValidElement } from 'react';
3
3
  import { cn } from '../utils/cn';
4
- export function EmptyState({ title = 'Nada por aqui.', description, icon = _jsx(DefaultEmptyIcon, {}), showIcon = true, variant = 'default', withMargin = false, className, children, }) {
4
+ export function EmptyState({ title = 'Nada por aqui.', description, icon = _jsx(DefaultEmptyIcon, {}), showIcon = true, variant = 'default', layout = 'fill', withMargin = false, className, children, }) {
5
5
  const isCompact = variant === 'compact';
6
6
  const styledIcon = isValidElement(icon)
7
7
  ? cloneElement(icon, {
8
8
  className: cn('h-10 w-10 text-foreground-muted', icon.props.className),
9
9
  })
10
10
  : icon;
11
- return (_jsx("div", { className: cn('flex min-h-0 w-full items-center justify-center rounded-md border border-dashed border-[color-mix(in_srgb,var(--foreground-muted)_24%,transparent)] bg-surface text-center text-foreground-muted', isCompact ? 'px-4 py-6' : 'h-full flex-1 px-5 py-10', withMargin && 'm-2 !w-auto', className), children: _jsxs("div", { className: cn('mx-auto grid justify-items-center', isCompact ? 'max-w-xs gap-1.5' : 'max-w-sm gap-2'), children: [showIcon && styledIcon ? (_jsx("div", { className: "text-foreground-muted mb-1 flex h-11 w-11 items-center justify-center", children: styledIcon })) : null, _jsx("strong", { className: "text-foreground text-sm font-semibold", children: title }), description ? _jsx("p", { className: "text-foreground-muted text-xs leading-5", children: description }) : null, children ? _jsx("div", { className: cn('mt-2 flex flex-wrap items-center justify-center gap-2', isCompact ? 'text-xs' : 'text-sm'), children: children }) : null] }) }));
11
+ return (_jsx("div", { className: cn('flex min-h-0 w-full items-center justify-center rounded-md border border-dashed border-[color-mix(in_srgb,var(--foreground-muted)_24%,transparent)] bg-surface text-center text-foreground-muted', layout === 'content'
12
+ ? 'h-auto w-fit flex-none px-5 py-10'
13
+ : isCompact
14
+ ? 'px-4 py-6'
15
+ : 'h-full flex-1 px-5 py-10', withMargin && 'm-3 !w-[calc(100%_-_1.5rem)] !h-[calc(100%_-_1.5rem)]', className), children: _jsxs("div", { className: cn('mx-auto grid justify-items-center', isCompact ? 'max-w-xs gap-1.5' : 'max-w-sm gap-2'), children: [showIcon && styledIcon ? (_jsx("div", { className: "text-foreground-muted mb-1 flex h-11 w-11 items-center justify-center", children: styledIcon })) : null, _jsx("strong", { className: "text-foreground text-sm font-semibold", children: title }), description ? _jsx("p", { className: "text-foreground-muted text-xs leading-5", children: description }) : null, children ? _jsx("div", { className: cn('mt-2 flex flex-wrap items-center justify-center gap-2', isCompact ? 'text-xs' : 'text-sm'), children: children }) : null] }) }));
12
16
  }
13
17
  function DefaultEmptyIcon() {
14
18
  return (_jsx("svg", { "aria-hidden": "true", className: "h-10 w-10", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: "1.8", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M3.75 8.75 6.2 5.4A2 2 0 0 1 7.82 4.6h8.36a2 2 0 0 1 1.62.8l2.45 3.35M3.75 8.75v6.9A3.75 3.75 0 0 0 7.5 19.4h9a3.75 3.75 0 0 0 3.75-3.75v-6.9M3.75 8.75h4.92a1.5 1.5 0 0 1 1.34.83l.28.56a1.5 1.5 0 0 0 1.34.83h.74a1.5 1.5 0 0 0 1.34-.83l.28-.56a1.5 1.5 0 0 1 1.34-.83h4.92" }) }));
package/dist/styles.css CHANGED
@@ -980,8 +980,8 @@ h2.react-datepicker__current-month {
980
980
  max-width: 96rem;
981
981
  }
982
982
  }
983
- .m-2 {
984
- margin: calc(var(--spacing) * 2);
983
+ .m-3 {
984
+ margin: calc(var(--spacing) * 3);
985
985
  }
986
986
  .mx-1 {
987
987
  margin-inline: calc(var(--spacing) * 1);
@@ -1142,6 +1142,9 @@ h2.react-datepicker__current-month {
1142
1142
  .\!h-14 {
1143
1143
  height: calc(var(--spacing) * 14) !important;
1144
1144
  }
1145
+ .\!h-\[calc\(100\%_-_1\.5rem\)\] {
1146
+ height: calc(100% - 1.5rem) !important;
1147
+ }
1145
1148
  .h-1\.5 {
1146
1149
  height: calc(var(--spacing) * 1.5);
1147
1150
  }
@@ -1214,6 +1217,9 @@ h2.react-datepicker__current-month {
1214
1217
  .h-\[calc\(100\%-1rem\)\] {
1215
1218
  height: calc(100% - 1rem);
1216
1219
  }
1220
+ .h-auto {
1221
+ height: auto;
1222
+ }
1217
1223
  .h-fit {
1218
1224
  height: fit-content;
1219
1225
  }
@@ -1307,8 +1313,8 @@ h2.react-datepicker__current-month {
1307
1313
  .min-h-\[14rem\] {
1308
1314
  min-height: 14rem;
1309
1315
  }
1310
- .\!w-auto {
1311
- width: auto !important;
1316
+ .\!w-\[calc\(100\%_-_1\.5rem\)\] {
1317
+ width: calc(100% - 1.5rem) !important;
1312
1318
  }
1313
1319
  .w-0 {
1314
1320
  width: calc(var(--spacing) * 0);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wellingtonhlc/shared-ui",
3
- "version": "0.26.3",
3
+ "version": "0.26.4",
4
4
  "private": false,
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",