@almadar/ui 5.31.1 → 5.32.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.
@@ -7362,6 +7362,7 @@ function RichSelect({
7362
7362
  "button",
7363
7363
  {
7364
7364
  type: "button",
7365
+ dir: opt.dir,
7365
7366
  disabled: opt.disabled,
7366
7367
  onClick: () => !opt.disabled && toggle(opt.value),
7367
7368
  className: cn(
@@ -7371,8 +7372,14 @@ function RichSelect({
7371
7372
  selected.includes(opt.value) && "text-primary font-medium"
7372
7373
  ),
7373
7374
  children: [
7374
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: opt.label }),
7375
- selected.includes(opt.value) && /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: "check", className: "h-icon-default w-icon-default" })
7375
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-2 min-w-0", children: [
7376
+ opt.icon != null && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 flex items-center", children: opt.icon }),
7377
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex flex-col min-w-0", children: [
7378
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: opt.label }),
7379
+ opt.secondaryLabel != null && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground font-normal", children: opt.secondaryLabel })
7380
+ ] })
7381
+ ] }),
7382
+ selected.includes(opt.value) && /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: "check", className: "h-icon-default w-icon-default shrink-0" })
7376
7383
  ]
7377
7384
  },
7378
7385
  opt.value
package/dist/avl/index.js CHANGED
@@ -7313,6 +7313,7 @@ function RichSelect({
7313
7313
  "button",
7314
7314
  {
7315
7315
  type: "button",
7316
+ dir: opt.dir,
7316
7317
  disabled: opt.disabled,
7317
7318
  onClick: () => !opt.disabled && toggle(opt.value),
7318
7319
  className: cn(
@@ -7322,8 +7323,14 @@ function RichSelect({
7322
7323
  selected.includes(opt.value) && "text-primary font-medium"
7323
7324
  ),
7324
7325
  children: [
7325
- /* @__PURE__ */ jsx("span", { children: opt.label }),
7326
- selected.includes(opt.value) && /* @__PURE__ */ jsx(Icon, { name: "check", className: "h-icon-default w-icon-default" })
7326
+ /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2 min-w-0", children: [
7327
+ opt.icon != null && /* @__PURE__ */ jsx("span", { className: "shrink-0 flex items-center", children: opt.icon }),
7328
+ /* @__PURE__ */ jsxs("span", { className: "flex flex-col min-w-0", children: [
7329
+ /* @__PURE__ */ jsx("span", { children: opt.label }),
7330
+ opt.secondaryLabel != null && /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground font-normal", children: opt.secondaryLabel })
7331
+ ] })
7332
+ ] }),
7333
+ selected.includes(opt.value) && /* @__PURE__ */ jsx(Icon, { name: "check", className: "h-icon-default w-icon-default shrink-0" })
7327
7334
  ]
7328
7335
  },
7329
7336
  opt.value
@@ -4,6 +4,12 @@ export interface SelectOption {
4
4
  value: string;
5
5
  label: string;
6
6
  disabled?: boolean;
7
+ /** Leading content rendered in rich mode only (native mode ignores this). */
8
+ icon?: React.ReactNode;
9
+ /** Secondary line of text rendered below label in rich mode only. */
10
+ secondaryLabel?: string;
11
+ /** dir attribute applied to the option row in rich mode only. */
12
+ dir?: string;
7
13
  }
8
14
  export interface SelectOptionGroup {
9
15
  label: string;
@@ -2511,6 +2511,7 @@ function RichSelect({
2511
2511
  "button",
2512
2512
  {
2513
2513
  type: "button",
2514
+ dir: opt.dir,
2514
2515
  disabled: opt.disabled,
2515
2516
  onClick: () => !opt.disabled && toggle(opt.value),
2516
2517
  className: cn(
@@ -2520,8 +2521,14 @@ function RichSelect({
2520
2521
  selected.includes(opt.value) && "text-primary font-medium"
2521
2522
  ),
2522
2523
  children: [
2523
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: opt.label }),
2524
- selected.includes(opt.value) && /* @__PURE__ */ jsxRuntime.jsx(exports.Icon, { name: "check", className: "h-icon-default w-icon-default" })
2524
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-2 min-w-0", children: [
2525
+ opt.icon != null && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 flex items-center", children: opt.icon }),
2526
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex flex-col min-w-0", children: [
2527
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: opt.label }),
2528
+ opt.secondaryLabel != null && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground font-normal", children: opt.secondaryLabel })
2529
+ ] })
2530
+ ] }),
2531
+ selected.includes(opt.value) && /* @__PURE__ */ jsxRuntime.jsx(exports.Icon, { name: "check", className: "h-icon-default w-icon-default shrink-0" })
2525
2532
  ]
2526
2533
  },
2527
2534
  opt.value
@@ -2463,6 +2463,7 @@ function RichSelect({
2463
2463
  "button",
2464
2464
  {
2465
2465
  type: "button",
2466
+ dir: opt.dir,
2466
2467
  disabled: opt.disabled,
2467
2468
  onClick: () => !opt.disabled && toggle(opt.value),
2468
2469
  className: cn(
@@ -2472,8 +2473,14 @@ function RichSelect({
2472
2473
  selected.includes(opt.value) && "text-primary font-medium"
2473
2474
  ),
2474
2475
  children: [
2475
- /* @__PURE__ */ jsx("span", { children: opt.label }),
2476
- selected.includes(opt.value) && /* @__PURE__ */ jsx(Icon, { name: "check", className: "h-icon-default w-icon-default" })
2476
+ /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2 min-w-0", children: [
2477
+ opt.icon != null && /* @__PURE__ */ jsx("span", { className: "shrink-0 flex items-center", children: opt.icon }),
2478
+ /* @__PURE__ */ jsxs("span", { className: "flex flex-col min-w-0", children: [
2479
+ /* @__PURE__ */ jsx("span", { children: opt.label }),
2480
+ opt.secondaryLabel != null && /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground font-normal", children: opt.secondaryLabel })
2481
+ ] })
2482
+ ] }),
2483
+ selected.includes(opt.value) && /* @__PURE__ */ jsx(Icon, { name: "check", className: "h-icon-default w-icon-default shrink-0" })
2477
2484
  ]
2478
2485
  },
2479
2486
  opt.value
@@ -3801,6 +3801,7 @@ function RichSelect({
3801
3801
  "button",
3802
3802
  {
3803
3803
  type: "button",
3804
+ dir: opt.dir,
3804
3805
  disabled: opt.disabled,
3805
3806
  onClick: () => !opt.disabled && toggle(opt.value),
3806
3807
  className: cn(
@@ -3810,8 +3811,14 @@ function RichSelect({
3810
3811
  selected.includes(opt.value) && "text-primary font-medium"
3811
3812
  ),
3812
3813
  children: [
3813
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: opt.label }),
3814
- selected.includes(opt.value) && /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: "check", className: "h-icon-default w-icon-default" })
3814
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-2 min-w-0", children: [
3815
+ opt.icon != null && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 flex items-center", children: opt.icon }),
3816
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex flex-col min-w-0", children: [
3817
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: opt.label }),
3818
+ opt.secondaryLabel != null && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground font-normal", children: opt.secondaryLabel })
3819
+ ] })
3820
+ ] }),
3821
+ selected.includes(opt.value) && /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: "check", className: "h-icon-default w-icon-default shrink-0" })
3815
3822
  ]
3816
3823
  },
3817
3824
  opt.value
@@ -3752,6 +3752,7 @@ function RichSelect({
3752
3752
  "button",
3753
3753
  {
3754
3754
  type: "button",
3755
+ dir: opt.dir,
3755
3756
  disabled: opt.disabled,
3756
3757
  onClick: () => !opt.disabled && toggle(opt.value),
3757
3758
  className: cn(
@@ -3761,8 +3762,14 @@ function RichSelect({
3761
3762
  selected.includes(opt.value) && "text-primary font-medium"
3762
3763
  ),
3763
3764
  children: [
3764
- /* @__PURE__ */ jsx("span", { children: opt.label }),
3765
- selected.includes(opt.value) && /* @__PURE__ */ jsx(Icon, { name: "check", className: "h-icon-default w-icon-default" })
3765
+ /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2 min-w-0", children: [
3766
+ opt.icon != null && /* @__PURE__ */ jsx("span", { className: "shrink-0 flex items-center", children: opt.icon }),
3767
+ /* @__PURE__ */ jsxs("span", { className: "flex flex-col min-w-0", children: [
3768
+ /* @__PURE__ */ jsx("span", { children: opt.label }),
3769
+ opt.secondaryLabel != null && /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground font-normal", children: opt.secondaryLabel })
3770
+ ] })
3771
+ ] }),
3772
+ selected.includes(opt.value) && /* @__PURE__ */ jsx(Icon, { name: "check", className: "h-icon-default w-icon-default shrink-0" })
3766
3773
  ]
3767
3774
  },
3768
3775
  opt.value
@@ -3537,6 +3537,7 @@ function RichSelect({
3537
3537
  "button",
3538
3538
  {
3539
3539
  type: "button",
3540
+ dir: opt.dir,
3540
3541
  disabled: opt.disabled,
3541
3542
  onClick: () => !opt.disabled && toggle(opt.value),
3542
3543
  className: cn(
@@ -3546,8 +3547,14 @@ function RichSelect({
3546
3547
  selected.includes(opt.value) && "text-primary font-medium"
3547
3548
  ),
3548
3549
  children: [
3549
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: opt.label }),
3550
- selected.includes(opt.value) && /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: "check", className: "h-icon-default w-icon-default" })
3550
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-2 min-w-0", children: [
3551
+ opt.icon != null && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 flex items-center", children: opt.icon }),
3552
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex flex-col min-w-0", children: [
3553
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: opt.label }),
3554
+ opt.secondaryLabel != null && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground font-normal", children: opt.secondaryLabel })
3555
+ ] })
3556
+ ] }),
3557
+ selected.includes(opt.value) && /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: "check", className: "h-icon-default w-icon-default shrink-0" })
3551
3558
  ]
3552
3559
  },
3553
3560
  opt.value
@@ -3488,6 +3488,7 @@ function RichSelect({
3488
3488
  "button",
3489
3489
  {
3490
3490
  type: "button",
3491
+ dir: opt.dir,
3491
3492
  disabled: opt.disabled,
3492
3493
  onClick: () => !opt.disabled && toggle(opt.value),
3493
3494
  className: cn(
@@ -3497,8 +3498,14 @@ function RichSelect({
3497
3498
  selected.includes(opt.value) && "text-primary font-medium"
3498
3499
  ),
3499
3500
  children: [
3500
- /* @__PURE__ */ jsx("span", { children: opt.label }),
3501
- selected.includes(opt.value) && /* @__PURE__ */ jsx(Icon, { name: "check", className: "h-icon-default w-icon-default" })
3501
+ /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2 min-w-0", children: [
3502
+ opt.icon != null && /* @__PURE__ */ jsx("span", { className: "shrink-0 flex items-center", children: opt.icon }),
3503
+ /* @__PURE__ */ jsxs("span", { className: "flex flex-col min-w-0", children: [
3504
+ /* @__PURE__ */ jsx("span", { children: opt.label }),
3505
+ opt.secondaryLabel != null && /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground font-normal", children: opt.secondaryLabel })
3506
+ ] })
3507
+ ] }),
3508
+ selected.includes(opt.value) && /* @__PURE__ */ jsx(Icon, { name: "check", className: "h-icon-default w-icon-default shrink-0" })
3502
3509
  ]
3503
3510
  },
3504
3511
  opt.value
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@almadar/ui",
3
- "version": "5.31.1",
3
+ "version": "5.32.0",
4
4
  "description": "React UI components, hooks, and providers for Almadar",
5
5
  "type": "module",
6
6
  "sideEffects": [