@almadar/ui 5.3.1 → 5.4.0

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.
@@ -8467,7 +8467,7 @@ var init_Checkbox = __esm({
8467
8467
  Checkbox.displayName = "Checkbox";
8468
8468
  }
8469
8469
  });
8470
- var variantStyles4, paddingStyles2, shadowStyles2, Card, CardHeader, CardTitle, CardContent, CardBody, CardFooter;
8470
+ var variantStyles4, paddingStyles2, shadowStyles2, lookStyles, Card, CardHeader, CardTitle, CardContent, CardBody, CardFooter;
8471
8471
  var init_Card = __esm({
8472
8472
  "components/atoms/Card.tsx"() {
8473
8473
  init_cn();
@@ -8515,6 +8515,15 @@ var init_Card = __esm({
8515
8515
  md: "shadow",
8516
8516
  lg: "shadow-elevation-dialog"
8517
8517
  };
8518
+ lookStyles = {
8519
+ elevated: "",
8520
+ "flat-bordered": "shadow-none border-[length:var(--border-width)] border-border",
8521
+ "borderless-divider": "shadow-none border-0 border-b border-border rounded-none",
8522
+ ticket: "shadow-none border-dashed border-[length:var(--border-width)] border-border",
8523
+ invoice: "shadow-none border-[length:var(--border-width-thick)] border-border rounded-sm",
8524
+ chip: "shadow-none rounded-pill border-[length:var(--border-width)] border-border",
8525
+ "tile-image-first": "p-0 overflow-hidden"
8526
+ };
8518
8527
  Card = React98__namespace.default.forwardRef(
8519
8528
  ({
8520
8529
  className,
@@ -8523,6 +8532,7 @@ var init_Card = __esm({
8523
8532
  title,
8524
8533
  subtitle,
8525
8534
  shadow,
8535
+ look = "elevated",
8526
8536
  children,
8527
8537
  ...props
8528
8538
  }, ref) => {
@@ -8535,6 +8545,7 @@ var init_Card = __esm({
8535
8545
  "transition-all duration-[var(--transition-normal)]",
8536
8546
  variantStyles4[variant],
8537
8547
  paddingStyles2[padding],
8548
+ lookStyles[look],
8538
8549
  shadow && shadowStyles2[shadow],
8539
8550
  className
8540
8551
  ),
package/dist/avl/index.js CHANGED
@@ -8418,7 +8418,7 @@ var init_Checkbox = __esm({
8418
8418
  Checkbox.displayName = "Checkbox";
8419
8419
  }
8420
8420
  });
8421
- var variantStyles4, paddingStyles2, shadowStyles2, Card, CardHeader, CardTitle, CardContent, CardBody, CardFooter;
8421
+ var variantStyles4, paddingStyles2, shadowStyles2, lookStyles, Card, CardHeader, CardTitle, CardContent, CardBody, CardFooter;
8422
8422
  var init_Card = __esm({
8423
8423
  "components/atoms/Card.tsx"() {
8424
8424
  init_cn();
@@ -8466,6 +8466,15 @@ var init_Card = __esm({
8466
8466
  md: "shadow",
8467
8467
  lg: "shadow-elevation-dialog"
8468
8468
  };
8469
+ lookStyles = {
8470
+ elevated: "",
8471
+ "flat-bordered": "shadow-none border-[length:var(--border-width)] border-border",
8472
+ "borderless-divider": "shadow-none border-0 border-b border-border rounded-none",
8473
+ ticket: "shadow-none border-dashed border-[length:var(--border-width)] border-border",
8474
+ invoice: "shadow-none border-[length:var(--border-width-thick)] border-border rounded-sm",
8475
+ chip: "shadow-none rounded-pill border-[length:var(--border-width)] border-border",
8476
+ "tile-image-first": "p-0 overflow-hidden"
8477
+ };
8469
8478
  Card = React98__default.forwardRef(
8470
8479
  ({
8471
8480
  className,
@@ -8474,6 +8483,7 @@ var init_Card = __esm({
8474
8483
  title,
8475
8484
  subtitle,
8476
8485
  shadow,
8486
+ look = "elevated",
8477
8487
  children,
8478
8488
  ...props
8479
8489
  }, ref) => {
@@ -8486,6 +8496,7 @@ var init_Card = __esm({
8486
8496
  "transition-all duration-[var(--transition-normal)]",
8487
8497
  variantStyles4[variant],
8488
8498
  paddingStyles2[padding],
8499
+ lookStyles[look],
8489
8500
  shadow && shadowStyles2[shadow],
8490
8501
  className
8491
8502
  ),
@@ -1,5 +1,10 @@
1
1
  import React from "react";
2
2
  export type CardShadow = "none" | "sm" | "md" | "lg";
3
+ /**
4
+ * Layer 2 visual treatment for the card pattern — orthogonal to the semantic
5
+ * `variant` (which conveys role / state).
6
+ */
7
+ export type CardLook = "elevated" | "flat-bordered" | "borderless-divider" | "ticket" | "invoice" | "chip" | "tile-image-first";
3
8
  export interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
4
9
  variant?: "default" | "bordered" | "elevated" | "interactive";
5
10
  padding?: "none" | "sm" | "md" | "lg";
@@ -9,6 +14,8 @@ export interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
9
14
  subtitle?: string;
10
15
  /** Shadow size override */
11
16
  shadow?: CardShadow;
17
+ /** Layer 2 visual treatment — orthogonal to the semantic variant. */
18
+ look?: CardLook;
12
19
  /** Card content */
13
20
  children?: React.ReactNode;
14
21
  }
@@ -2332,7 +2332,7 @@ var init_Checkbox = __esm({
2332
2332
  exports.Checkbox.displayName = "Checkbox";
2333
2333
  }
2334
2334
  });
2335
- var variantStyles2, paddingStyles, shadowStyles; exports.Card = void 0; exports.CardHeader = void 0; exports.CardTitle = void 0; exports.CardContent = void 0; exports.CardBody = void 0; exports.CardFooter = void 0;
2335
+ var variantStyles2, paddingStyles, shadowStyles, lookStyles; exports.Card = void 0; exports.CardHeader = void 0; exports.CardTitle = void 0; exports.CardContent = void 0; exports.CardBody = void 0; exports.CardFooter = void 0;
2336
2336
  var init_Card = __esm({
2337
2337
  "components/atoms/Card.tsx"() {
2338
2338
  init_cn();
@@ -2380,6 +2380,15 @@ var init_Card = __esm({
2380
2380
  md: "shadow",
2381
2381
  lg: "shadow-elevation-dialog"
2382
2382
  };
2383
+ lookStyles = {
2384
+ elevated: "",
2385
+ "flat-bordered": "shadow-none border-[length:var(--border-width)] border-border",
2386
+ "borderless-divider": "shadow-none border-0 border-b border-border rounded-none",
2387
+ ticket: "shadow-none border-dashed border-[length:var(--border-width)] border-border",
2388
+ invoice: "shadow-none border-[length:var(--border-width-thick)] border-border rounded-sm",
2389
+ chip: "shadow-none rounded-pill border-[length:var(--border-width)] border-border",
2390
+ "tile-image-first": "p-0 overflow-hidden"
2391
+ };
2383
2392
  exports.Card = React80__namespace.default.forwardRef(
2384
2393
  ({
2385
2394
  className,
@@ -2388,6 +2397,7 @@ var init_Card = __esm({
2388
2397
  title,
2389
2398
  subtitle,
2390
2399
  shadow,
2400
+ look = "elevated",
2391
2401
  children,
2392
2402
  ...props
2393
2403
  }, ref) => {
@@ -2400,6 +2410,7 @@ var init_Card = __esm({
2400
2410
  "transition-all duration-[var(--transition-normal)]",
2401
2411
  variantStyles2[variant],
2402
2412
  paddingStyles[padding],
2413
+ lookStyles[look],
2403
2414
  shadow && shadowStyles[shadow],
2404
2415
  className
2405
2416
  ),
@@ -2283,7 +2283,7 @@ var init_Checkbox = __esm({
2283
2283
  Checkbox.displayName = "Checkbox";
2284
2284
  }
2285
2285
  });
2286
- var variantStyles2, paddingStyles, shadowStyles, Card, CardHeader, CardTitle, CardContent, CardBody, CardFooter;
2286
+ var variantStyles2, paddingStyles, shadowStyles, lookStyles, Card, CardHeader, CardTitle, CardContent, CardBody, CardFooter;
2287
2287
  var init_Card = __esm({
2288
2288
  "components/atoms/Card.tsx"() {
2289
2289
  init_cn();
@@ -2331,6 +2331,15 @@ var init_Card = __esm({
2331
2331
  md: "shadow",
2332
2332
  lg: "shadow-elevation-dialog"
2333
2333
  };
2334
+ lookStyles = {
2335
+ elevated: "",
2336
+ "flat-bordered": "shadow-none border-[length:var(--border-width)] border-border",
2337
+ "borderless-divider": "shadow-none border-0 border-b border-border rounded-none",
2338
+ ticket: "shadow-none border-dashed border-[length:var(--border-width)] border-border",
2339
+ invoice: "shadow-none border-[length:var(--border-width-thick)] border-border rounded-sm",
2340
+ chip: "shadow-none rounded-pill border-[length:var(--border-width)] border-border",
2341
+ "tile-image-first": "p-0 overflow-hidden"
2342
+ };
2334
2343
  Card = React80__default.forwardRef(
2335
2344
  ({
2336
2345
  className,
@@ -2339,6 +2348,7 @@ var init_Card = __esm({
2339
2348
  title,
2340
2349
  subtitle,
2341
2350
  shadow,
2351
+ look = "elevated",
2342
2352
  children,
2343
2353
  ...props
2344
2354
  }, ref) => {
@@ -2351,6 +2361,7 @@ var init_Card = __esm({
2351
2361
  "transition-all duration-[var(--transition-normal)]",
2352
2362
  variantStyles2[variant],
2353
2363
  paddingStyles[padding],
2364
+ lookStyles[look],
2354
2365
  shadow && shadowStyles[shadow],
2355
2366
  className
2356
2367
  ),
@@ -3930,6 +3930,15 @@ var shadowStyles2 = {
3930
3930
  md: "shadow",
3931
3931
  lg: "shadow-elevation-dialog"
3932
3932
  };
3933
+ var lookStyles = {
3934
+ elevated: "",
3935
+ "flat-bordered": "shadow-none border-[length:var(--border-width)] border-border",
3936
+ "borderless-divider": "shadow-none border-0 border-b border-border rounded-none",
3937
+ ticket: "shadow-none border-dashed border-[length:var(--border-width)] border-border",
3938
+ invoice: "shadow-none border-[length:var(--border-width-thick)] border-border rounded-sm",
3939
+ chip: "shadow-none rounded-pill border-[length:var(--border-width)] border-border",
3940
+ "tile-image-first": "p-0 overflow-hidden"
3941
+ };
3933
3942
  var Card = React7__default.default.forwardRef(
3934
3943
  ({
3935
3944
  className,
@@ -3938,6 +3947,7 @@ var Card = React7__default.default.forwardRef(
3938
3947
  title,
3939
3948
  subtitle,
3940
3949
  shadow,
3950
+ look = "elevated",
3941
3951
  children,
3942
3952
  ...props
3943
3953
  }, ref) => {
@@ -3950,6 +3960,7 @@ var Card = React7__default.default.forwardRef(
3950
3960
  "transition-all duration-[var(--transition-normal)]",
3951
3961
  variantStyles3[variant],
3952
3962
  paddingStyles2[padding],
3963
+ lookStyles[look],
3953
3964
  shadow && shadowStyles2[shadow],
3954
3965
  className
3955
3966
  ),
@@ -228,6 +228,11 @@ interface IconProps {
228
228
  declare const Icon: React.FC<IconProps>;
229
229
 
230
230
  type CardShadow = "none" | "sm" | "md" | "lg";
231
+ /**
232
+ * Layer 2 visual treatment for the card pattern — orthogonal to the semantic
233
+ * `variant` (which conveys role / state).
234
+ */
235
+ type CardLook = "elevated" | "flat-bordered" | "borderless-divider" | "ticket" | "invoice" | "chip" | "tile-image-first";
231
236
  interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
232
237
  variant?: "default" | "bordered" | "elevated" | "interactive";
233
238
  padding?: "none" | "sm" | "md" | "lg";
@@ -237,6 +242,8 @@ interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
237
242
  subtitle?: string;
238
243
  /** Shadow size override */
239
244
  shadow?: CardShadow;
245
+ /** Layer 2 visual treatment — orthogonal to the semantic variant. */
246
+ look?: CardLook;
240
247
  /** Card content */
241
248
  children?: React.ReactNode;
242
249
  }
@@ -3903,6 +3903,15 @@ var shadowStyles2 = {
3903
3903
  md: "shadow",
3904
3904
  lg: "shadow-elevation-dialog"
3905
3905
  };
3906
+ var lookStyles = {
3907
+ elevated: "",
3908
+ "flat-bordered": "shadow-none border-[length:var(--border-width)] border-border",
3909
+ "borderless-divider": "shadow-none border-0 border-b border-border rounded-none",
3910
+ ticket: "shadow-none border-dashed border-[length:var(--border-width)] border-border",
3911
+ invoice: "shadow-none border-[length:var(--border-width-thick)] border-border rounded-sm",
3912
+ chip: "shadow-none rounded-pill border-[length:var(--border-width)] border-border",
3913
+ "tile-image-first": "p-0 overflow-hidden"
3914
+ };
3906
3915
  var Card = React7.forwardRef(
3907
3916
  ({
3908
3917
  className,
@@ -3911,6 +3920,7 @@ var Card = React7.forwardRef(
3911
3920
  title,
3912
3921
  subtitle,
3913
3922
  shadow,
3923
+ look = "elevated",
3914
3924
  children,
3915
3925
  ...props
3916
3926
  }, ref) => {
@@ -3923,6 +3933,7 @@ var Card = React7.forwardRef(
3923
3933
  "transition-all duration-[var(--transition-normal)]",
3924
3934
  variantStyles3[variant],
3925
3935
  paddingStyles2[padding],
3936
+ lookStyles[look],
3926
3937
  shadow && shadowStyles2[shadow],
3927
3938
  className
3928
3939
  ),
@@ -4014,6 +4014,15 @@ var shadowStyles2 = {
4014
4014
  md: "shadow",
4015
4015
  lg: "shadow-elevation-dialog"
4016
4016
  };
4017
+ var lookStyles = {
4018
+ elevated: "",
4019
+ "flat-bordered": "shadow-none border-[length:var(--border-width)] border-border",
4020
+ "borderless-divider": "shadow-none border-0 border-b border-border rounded-none",
4021
+ ticket: "shadow-none border-dashed border-[length:var(--border-width)] border-border",
4022
+ invoice: "shadow-none border-[length:var(--border-width-thick)] border-border rounded-sm",
4023
+ chip: "shadow-none rounded-pill border-[length:var(--border-width)] border-border",
4024
+ "tile-image-first": "p-0 overflow-hidden"
4025
+ };
4017
4026
  var Card = React8__default.default.forwardRef(
4018
4027
  ({
4019
4028
  className,
@@ -4022,6 +4031,7 @@ var Card = React8__default.default.forwardRef(
4022
4031
  title,
4023
4032
  subtitle,
4024
4033
  shadow,
4034
+ look = "elevated",
4025
4035
  children,
4026
4036
  ...props
4027
4037
  }, ref) => {
@@ -4034,6 +4044,7 @@ var Card = React8__default.default.forwardRef(
4034
4044
  "transition-all duration-[var(--transition-normal)]",
4035
4045
  variantStyles4[variant],
4036
4046
  paddingStyles2[padding],
4047
+ lookStyles[look],
4037
4048
  shadow && shadowStyles2[shadow],
4038
4049
  className
4039
4050
  ),
@@ -250,6 +250,11 @@ interface IconProps {
250
250
  declare const Icon: React.FC<IconProps>;
251
251
 
252
252
  type CardShadow = "none" | "sm" | "md" | "lg";
253
+ /**
254
+ * Layer 2 visual treatment for the card pattern — orthogonal to the semantic
255
+ * `variant` (which conveys role / state).
256
+ */
257
+ type CardLook = "elevated" | "flat-bordered" | "borderless-divider" | "ticket" | "invoice" | "chip" | "tile-image-first";
253
258
  interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
254
259
  variant?: "default" | "bordered" | "elevated" | "interactive";
255
260
  padding?: "none" | "sm" | "md" | "lg";
@@ -259,6 +264,8 @@ interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
259
264
  subtitle?: string;
260
265
  /** Shadow size override */
261
266
  shadow?: CardShadow;
267
+ /** Layer 2 visual treatment — orthogonal to the semantic variant. */
268
+ look?: CardLook;
262
269
  /** Card content */
263
270
  children?: React.ReactNode;
264
271
  }
@@ -3987,6 +3987,15 @@ var shadowStyles2 = {
3987
3987
  md: "shadow",
3988
3988
  lg: "shadow-elevation-dialog"
3989
3989
  };
3990
+ var lookStyles = {
3991
+ elevated: "",
3992
+ "flat-bordered": "shadow-none border-[length:var(--border-width)] border-border",
3993
+ "borderless-divider": "shadow-none border-0 border-b border-border rounded-none",
3994
+ ticket: "shadow-none border-dashed border-[length:var(--border-width)] border-border",
3995
+ invoice: "shadow-none border-[length:var(--border-width-thick)] border-border rounded-sm",
3996
+ chip: "shadow-none rounded-pill border-[length:var(--border-width)] border-border",
3997
+ "tile-image-first": "p-0 overflow-hidden"
3998
+ };
3990
3999
  var Card = React8.forwardRef(
3991
4000
  ({
3992
4001
  className,
@@ -3995,6 +4004,7 @@ var Card = React8.forwardRef(
3995
4004
  title,
3996
4005
  subtitle,
3997
4006
  shadow,
4007
+ look = "elevated",
3998
4008
  children,
3999
4009
  ...props
4000
4010
  }, ref) => {
@@ -4007,6 +4017,7 @@ var Card = React8.forwardRef(
4007
4017
  "transition-all duration-[var(--transition-normal)]",
4008
4018
  variantStyles4[variant],
4009
4019
  paddingStyles2[padding],
4020
+ lookStyles[look],
4010
4021
  shadow && shadowStyles2[shadow],
4011
4022
  className
4012
4023
  ),
@@ -3652,7 +3652,7 @@ var init_Checkbox = __esm({
3652
3652
  Checkbox.displayName = "Checkbox";
3653
3653
  }
3654
3654
  });
3655
- var variantStyles4, paddingStyles2, shadowStyles2, Card, CardHeader, CardTitle, CardContent, CardBody, CardFooter;
3655
+ var variantStyles4, paddingStyles2, shadowStyles2, lookStyles, Card, CardHeader, CardTitle, CardContent, CardBody, CardFooter;
3656
3656
  var init_Card = __esm({
3657
3657
  "components/atoms/Card.tsx"() {
3658
3658
  init_cn();
@@ -3700,6 +3700,15 @@ var init_Card = __esm({
3700
3700
  md: "shadow",
3701
3701
  lg: "shadow-elevation-dialog"
3702
3702
  };
3703
+ lookStyles = {
3704
+ elevated: "",
3705
+ "flat-bordered": "shadow-none border-[length:var(--border-width)] border-border",
3706
+ "borderless-divider": "shadow-none border-0 border-b border-border rounded-none",
3707
+ ticket: "shadow-none border-dashed border-[length:var(--border-width)] border-border",
3708
+ invoice: "shadow-none border-[length:var(--border-width-thick)] border-border rounded-sm",
3709
+ chip: "shadow-none rounded-pill border-[length:var(--border-width)] border-border",
3710
+ "tile-image-first": "p-0 overflow-hidden"
3711
+ };
3703
3712
  Card = React86__namespace.default.forwardRef(
3704
3713
  ({
3705
3714
  className,
@@ -3708,6 +3717,7 @@ var init_Card = __esm({
3708
3717
  title,
3709
3718
  subtitle,
3710
3719
  shadow,
3720
+ look = "elevated",
3711
3721
  children,
3712
3722
  ...props
3713
3723
  }, ref) => {
@@ -3720,6 +3730,7 @@ var init_Card = __esm({
3720
3730
  "transition-all duration-[var(--transition-normal)]",
3721
3731
  variantStyles4[variant],
3722
3732
  paddingStyles2[padding],
3733
+ lookStyles[look],
3723
3734
  shadow && shadowStyles2[shadow],
3724
3735
  className
3725
3736
  ),
@@ -3603,7 +3603,7 @@ var init_Checkbox = __esm({
3603
3603
  Checkbox.displayName = "Checkbox";
3604
3604
  }
3605
3605
  });
3606
- var variantStyles4, paddingStyles2, shadowStyles2, Card, CardHeader, CardTitle, CardContent, CardBody, CardFooter;
3606
+ var variantStyles4, paddingStyles2, shadowStyles2, lookStyles, Card, CardHeader, CardTitle, CardContent, CardBody, CardFooter;
3607
3607
  var init_Card = __esm({
3608
3608
  "components/atoms/Card.tsx"() {
3609
3609
  init_cn();
@@ -3651,6 +3651,15 @@ var init_Card = __esm({
3651
3651
  md: "shadow",
3652
3652
  lg: "shadow-elevation-dialog"
3653
3653
  };
3654
+ lookStyles = {
3655
+ elevated: "",
3656
+ "flat-bordered": "shadow-none border-[length:var(--border-width)] border-border",
3657
+ "borderless-divider": "shadow-none border-0 border-b border-border rounded-none",
3658
+ ticket: "shadow-none border-dashed border-[length:var(--border-width)] border-border",
3659
+ invoice: "shadow-none border-[length:var(--border-width-thick)] border-border rounded-sm",
3660
+ chip: "shadow-none rounded-pill border-[length:var(--border-width)] border-border",
3661
+ "tile-image-first": "p-0 overflow-hidden"
3662
+ };
3654
3663
  Card = React86__default.forwardRef(
3655
3664
  ({
3656
3665
  className,
@@ -3659,6 +3668,7 @@ var init_Card = __esm({
3659
3668
  title,
3660
3669
  subtitle,
3661
3670
  shadow,
3671
+ look = "elevated",
3662
3672
  children,
3663
3673
  ...props
3664
3674
  }, ref) => {
@@ -3671,6 +3681,7 @@ var init_Card = __esm({
3671
3681
  "transition-all duration-[var(--transition-normal)]",
3672
3682
  variantStyles4[variant],
3673
3683
  paddingStyles2[padding],
3684
+ lookStyles[look],
3674
3685
  shadow && shadowStyles2[shadow],
3675
3686
  className
3676
3687
  ),
@@ -3887,7 +3887,7 @@ var init_Checkbox = __esm({
3887
3887
  Checkbox.displayName = "Checkbox";
3888
3888
  }
3889
3889
  });
3890
- var variantStyles4, paddingStyles2, shadowStyles2, Card, CardHeader, CardTitle, CardContent, CardBody, CardFooter;
3890
+ var variantStyles4, paddingStyles2, shadowStyles2, lookStyles, Card, CardHeader, CardTitle, CardContent, CardBody, CardFooter;
3891
3891
  var init_Card = __esm({
3892
3892
  "components/atoms/Card.tsx"() {
3893
3893
  init_cn();
@@ -3935,6 +3935,15 @@ var init_Card = __esm({
3935
3935
  md: "shadow",
3936
3936
  lg: "shadow-elevation-dialog"
3937
3937
  };
3938
+ lookStyles = {
3939
+ elevated: "",
3940
+ "flat-bordered": "shadow-none border-[length:var(--border-width)] border-border",
3941
+ "borderless-divider": "shadow-none border-0 border-b border-border rounded-none",
3942
+ ticket: "shadow-none border-dashed border-[length:var(--border-width)] border-border",
3943
+ invoice: "shadow-none border-[length:var(--border-width-thick)] border-border rounded-sm",
3944
+ chip: "shadow-none rounded-pill border-[length:var(--border-width)] border-border",
3945
+ "tile-image-first": "p-0 overflow-hidden"
3946
+ };
3938
3947
  Card = React85__namespace.default.forwardRef(
3939
3948
  ({
3940
3949
  className,
@@ -3943,6 +3952,7 @@ var init_Card = __esm({
3943
3952
  title,
3944
3953
  subtitle,
3945
3954
  shadow,
3955
+ look = "elevated",
3946
3956
  children,
3947
3957
  ...props
3948
3958
  }, ref) => {
@@ -3955,6 +3965,7 @@ var init_Card = __esm({
3955
3965
  "transition-all duration-[var(--transition-normal)]",
3956
3966
  variantStyles4[variant],
3957
3967
  paddingStyles2[padding],
3968
+ lookStyles[look],
3958
3969
  shadow && shadowStyles2[shadow],
3959
3970
  className
3960
3971
  ),
@@ -3838,7 +3838,7 @@ var init_Checkbox = __esm({
3838
3838
  Checkbox.displayName = "Checkbox";
3839
3839
  }
3840
3840
  });
3841
- var variantStyles4, paddingStyles2, shadowStyles2, Card, CardHeader, CardTitle, CardContent, CardBody, CardFooter;
3841
+ var variantStyles4, paddingStyles2, shadowStyles2, lookStyles, Card, CardHeader, CardTitle, CardContent, CardBody, CardFooter;
3842
3842
  var init_Card = __esm({
3843
3843
  "components/atoms/Card.tsx"() {
3844
3844
  init_cn();
@@ -3886,6 +3886,15 @@ var init_Card = __esm({
3886
3886
  md: "shadow",
3887
3887
  lg: "shadow-elevation-dialog"
3888
3888
  };
3889
+ lookStyles = {
3890
+ elevated: "",
3891
+ "flat-bordered": "shadow-none border-[length:var(--border-width)] border-border",
3892
+ "borderless-divider": "shadow-none border-0 border-b border-border rounded-none",
3893
+ ticket: "shadow-none border-dashed border-[length:var(--border-width)] border-border",
3894
+ invoice: "shadow-none border-[length:var(--border-width-thick)] border-border rounded-sm",
3895
+ chip: "shadow-none rounded-pill border-[length:var(--border-width)] border-border",
3896
+ "tile-image-first": "p-0 overflow-hidden"
3897
+ };
3889
3898
  Card = React85__default.forwardRef(
3890
3899
  ({
3891
3900
  className,
@@ -3894,6 +3903,7 @@ var init_Card = __esm({
3894
3903
  title,
3895
3904
  subtitle,
3896
3905
  shadow,
3906
+ look = "elevated",
3897
3907
  children,
3898
3908
  ...props
3899
3909
  }, ref) => {
@@ -3906,6 +3916,7 @@ var init_Card = __esm({
3906
3916
  "transition-all duration-[var(--transition-normal)]",
3907
3917
  variantStyles4[variant],
3908
3918
  paddingStyles2[padding],
3919
+ lookStyles[look],
3909
3920
  shadow && shadowStyles2[shadow],
3910
3921
  className
3911
3922
  ),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@almadar/ui",
3
- "version": "5.3.1",
3
+ "version": "5.4.0",
4
4
  "description": "React UI components, hooks, and providers for Almadar",
5
5
  "type": "module",
6
6
  "sideEffects": [