@grandbazar/ui-baza 1.2.20 → 1.3.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.
package/dist/index.js CHANGED
@@ -59,7 +59,7 @@ const green = "_green_p5h5n_43";
59
59
  const neutral$3 = "_neutral_p5h5n_48";
60
60
  const lg$7 = "_lg_p5h5n_53";
61
61
  const md$a = "_md_p5h5n_60";
62
- const styles$w = {
62
+ const styles$x = {
63
63
  badge: badge,
64
64
  primary: primary$4,
65
65
  secondary: secondary$5,
@@ -75,13 +75,13 @@ const styles$w = {
75
75
  };
76
76
 
77
77
  function Badge({ children, className, size = "lg", color = "accent", mode = "primary", ...props }) {
78
- return /* @__PURE__ */ jsx("div", { className: classNames(styles$w.badge, styles$w[size], styles$w[color], styles$w[mode], className), ...props, children });
78
+ return /* @__PURE__ */ jsx("div", { className: classNames(styles$x.badge, styles$x[size], styles$x[color], styles$x[mode], className), ...props, children });
79
79
  }
80
80
 
81
81
  const badgeTabsItem = "_badgeTabsItem_10lit_2";
82
82
  const primary$3 = "_primary_10lit_18";
83
83
  const secondary$4 = "_secondary_10lit_36";
84
- const styles$v = {
84
+ const styles$w = {
85
85
  badgeTabsItem: badgeTabsItem,
86
86
  primary: primary$3,
87
87
  secondary: secondary$4
@@ -94,7 +94,7 @@ function BadgeTabsItem({ className, children, isActive, mode = "primary", ...pro
94
94
  type: "button",
95
95
  role: "tab",
96
96
  "aria-selected": Boolean(isActive),
97
- className: classNames(styles$v.badgeTabsItem, styles$v[mode], className),
97
+ className: classNames(styles$w.badgeTabsItem, styles$w[mode], className),
98
98
  ...props,
99
99
  children
100
100
  }
@@ -102,12 +102,12 @@ function BadgeTabsItem({ className, children, isActive, mode = "primary", ...pro
102
102
  }
103
103
 
104
104
  const badgeTabsRoot = "_badgeTabsRoot_1qkat_2";
105
- const styles$u = {
105
+ const styles$v = {
106
106
  badgeTabsRoot: badgeTabsRoot
107
107
  };
108
108
 
109
109
  function BadgeTabsRoot({ className, children, ...props }) {
110
- return /* @__PURE__ */ jsx("div", { role: "tablist", className: classNames(styles$u.badgeTabsRoot, className), ...props, children });
110
+ return /* @__PURE__ */ jsx("div", { role: "tablist", className: classNames(styles$v.badgeTabsRoot, className), ...props, children });
111
111
  }
112
112
 
113
113
  function BadgeTabs(props) {
@@ -953,6 +953,34 @@ function IconStop(props) {
953
953
  ) });
954
954
  }
955
955
 
956
+ function IconStore(props) {
957
+ return /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", ...props, children: /* @__PURE__ */ jsx(
958
+ "path",
959
+ {
960
+ d: "M22 10.3334C22 10.2726 21.993 10.2119 21.98 10.1526L20.897 5.2626C20.695 4.3344 20.181 3.5037 19.44 2.9097C18.699 2.3157 17.776 1.9946 16.827 2.0001H7.173C6.224 1.9953 5.302 2.3168 4.562 2.9108C3.822 3.5047 3.308 4.335 3.107 5.2626L2.02 10.1526C2.007 10.2119 2 10.2726 2 10.3334V11.1667C1.999 11.9781 2.296 12.7616 2.833 13.3692V17.8334C2.835 18.9381 3.274 19.9971 4.055 20.7782C4.836 21.5593 5.895 21.9987 7 22.0001H17C18.105 21.9987 19.164 21.5593 19.945 20.7782C20.726 19.9971 21.165 18.9381 21.167 17.8334V13.3692C21.704 12.7616 22.001 11.9781 22 11.1667V10.3334ZM3.667 10.4242L4.733 5.6242C4.854 5.0678 5.163 4.5697 5.607 4.2134C6.051 3.8571 6.604 3.6641 7.173 3.6667H7.833V6.1667C7.833 6.3878 7.921 6.5997 8.077 6.756C8.234 6.9123 8.446 7.0001 8.667 7.0001C8.888 7.0001 9.1 6.9123 9.256 6.756C9.412 6.5997 9.5 6.3878 9.5 6.1667V3.6667H14.5V6.1667C14.5 6.3878 14.588 6.5997 14.744 6.756C14.9 6.9123 15.112 7.0001 15.333 7.0001C15.554 7.0001 15.766 6.9123 15.923 6.756C16.079 6.5997 16.167 6.3878 16.167 6.1667V3.6667H16.827C17.396 3.6641 17.949 3.8571 18.393 4.2134C18.837 4.5697 19.146 5.0678 19.267 5.6242L20.333 10.4242V11.1667C20.333 11.6088 20.158 12.0327 19.845 12.3452C19.533 12.6578 19.109 12.8334 18.667 12.8334H17.833C17.391 12.8334 16.967 12.6578 16.655 12.3452C16.342 12.0327 16.167 11.6088 16.167 11.1667C16.167 10.9457 16.079 10.7338 15.923 10.5775C15.766 10.4212 15.554 10.3334 15.333 10.3334C15.112 10.3334 14.9 10.4212 14.744 10.5775C14.588 10.7338 14.5 10.9457 14.5 11.1667C14.5 11.6088 14.324 12.0327 14.012 12.3452C13.699 12.6578 13.275 12.8334 12.833 12.8334H11.167C10.725 12.8334 10.301 12.6578 9.988 12.3452C9.676 12.0327 9.5 11.6088 9.5 11.1667C9.5 10.9457 9.412 10.7338 9.256 10.5775C9.1 10.4212 8.888 10.3334 8.667 10.3334C8.446 10.3334 8.234 10.4212 8.077 10.5775C7.921 10.7338 7.833 10.9457 7.833 11.1667C7.833 11.6088 7.658 12.0327 7.345 12.3452C7.033 12.6578 6.609 12.8334 6.167 12.8334H5.333C4.891 12.8334 4.467 12.6578 4.155 12.3452C3.842 12.0327 3.667 11.6088 3.667 11.1667V10.4242ZM17 20.3334H7C6.337 20.3334 5.701 20.07 5.232 19.6012C4.763 19.1323 4.5 18.4964 4.5 17.8334V14.3942C4.772 14.4647 5.052 14.5003 5.333 14.5001H6.167C6.64 14.5003 7.108 14.3996 7.539 14.2046C7.97 14.0095 8.354 13.7248 8.667 13.3692C8.979 13.7248 9.363 14.0095 9.795 14.2046C10.226 14.3996 10.693 14.5003 11.167 14.5001H12.833C13.307 14.5003 13.774 14.3996 14.205 14.2046C14.637 14.0095 15.021 13.7248 15.333 13.3692C15.646 13.7248 16.03 14.0095 16.461 14.2046C16.892 14.3996 17.36 14.5003 17.833 14.5001H18.667C18.948 14.5003 19.228 14.4647 19.5 14.3942V17.8334C19.5 18.4964 19.237 19.1323 18.768 19.6012C18.299 20.07 17.663 20.3334 17 20.3334Z",
961
+ fill: "currentColor"
962
+ }
963
+ ) });
964
+ }
965
+ IconStore.Filled = function IconStoreFilled(props) {
966
+ return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", ...props, children: [
967
+ /* @__PURE__ */ jsx(
968
+ "path",
969
+ {
970
+ d: "M17.833 16.1667C16.956 16.1663 16.093 15.9347 15.333 15.495C14.574 15.9347 13.711 16.1663 12.833 16.1667H11.167C10.288 16.1655 9.425 15.9302 8.667 15.485C7.909 15.9303 7.046 16.1656 6.167 16.1667H5.333C4.455 16.1664 3.592 15.9325 2.833 15.4892V19.5C2.833 20.163 3.097 20.7989 3.566 21.2678C4.035 21.7366 4.67 22 5.333 22H18.667C19.33 22 19.966 21.7366 20.435 21.2678C20.903 20.7989 21.167 20.163 21.167 19.5V15.49C20.408 15.9327 19.545 16.1662 18.667 16.1667H17.833Z",
971
+ fill: "currentColor"
972
+ }
973
+ ),
974
+ /* @__PURE__ */ jsx(
975
+ "path",
976
+ {
977
+ d: "M16.167 2V7H14.5V2H9.5V7H7.833V2H3.833L2.02 10.1525L2 11.1667C2 12.0507 2.351 12.8986 2.976 13.5237C3.601 14.1488 4.449 14.5 5.333 14.5H6.167C6.642 14.4985 7.111 14.3948 7.542 14.1961C7.973 13.9974 8.357 13.7083 8.667 13.3483C8.976 13.7083 9.36 13.9974 9.791 14.1961C10.223 14.3948 10.692 14.4985 11.167 14.5H12.833C13.307 14.5002 13.774 14.3995 14.205 14.2045C14.637 14.0095 15.021 13.7247 15.333 13.3692C15.646 13.7247 16.03 14.0095 16.461 14.2045C16.892 14.3995 17.36 14.5002 17.833 14.5H18.667C19.551 14.5 20.399 14.1488 21.024 13.5237C21.649 12.8986 22 12.0507 22 11.1667V10.3333L20.167 2H16.167Z",
978
+ fill: "currentColor"
979
+ }
980
+ )
981
+ ] });
982
+ };
983
+
956
984
  function IconSwitch(props) {
957
985
  return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: "none", ...props, children: [
958
986
  /* @__PURE__ */ jsx(
@@ -1036,7 +1064,7 @@ function IconXMarkCircle(props) {
1036
1064
  const breadcrumbs = "_breadcrumbs_1bfmb_2";
1037
1065
  const breadcrumbsItem = "_breadcrumbsItem_1bfmb_8";
1038
1066
  const defaultSeparator = "_defaultSeparator_1bfmb_14";
1039
- const styles$t = {
1067
+ const styles$u = {
1040
1068
  breadcrumbs: breadcrumbs,
1041
1069
  breadcrumbsItem: breadcrumbsItem,
1042
1070
  defaultSeparator: defaultSeparator
@@ -1085,7 +1113,7 @@ function Slot({
1085
1113
  }
1086
1114
 
1087
1115
  const breadcrumbItem = "_breadcrumbItem_cua4v_2";
1088
- const styles$s = {
1116
+ const styles$t = {
1089
1117
  breadcrumbItem: breadcrumbItem
1090
1118
  };
1091
1119
 
@@ -1096,7 +1124,7 @@ function BreadcrumbItem({ children, className, isActive, asChild, ...props }) {
1096
1124
  {
1097
1125
  "data-active": isActive,
1098
1126
  "data-disabled": props.disabled,
1099
- className: classNames(styles$s.breadcrumbItem, className),
1127
+ className: classNames(styles$t.breadcrumbItem, className),
1100
1128
  ...isActive && { "aria-current": "page" },
1101
1129
  ...!asChild && { type: "button" },
1102
1130
  ...props,
@@ -1108,13 +1136,13 @@ function BreadcrumbItem({ children, className, isActive, asChild, ...props }) {
1108
1136
  function Breadcrumbs({
1109
1137
  className,
1110
1138
  children,
1111
- separator = /* @__PURE__ */ jsx(IconChevron, { className: styles$t.defaultSeparator })
1139
+ separator = /* @__PURE__ */ jsx(IconChevron, { className: styles$u.defaultSeparator })
1112
1140
  }) {
1113
1141
  const childrenArray = Array.isArray(children) ? children : [children];
1114
1142
  const lastIndex = childrenArray.length - 1;
1115
- return /* @__PURE__ */ jsx("nav", { "aria-label": "breadcrumb", className, children: /* @__PURE__ */ jsx("ol", { className: styles$t.breadcrumbs, children: childrenArray.map((item, index) => /* @__PURE__ */ jsxs(Fragment, { children: [
1116
- /* @__PURE__ */ jsx("li", { className: styles$t.breadcrumbsItem, children: item }),
1117
- index < lastIndex && /* @__PURE__ */ jsx("li", { className: styles$t.breadcrumbsItem, "aria-hidden": "true", children: separator })
1143
+ return /* @__PURE__ */ jsx("nav", { "aria-label": "breadcrumb", className, children: /* @__PURE__ */ jsx("ol", { className: styles$u.breadcrumbs, children: childrenArray.map((item, index) => /* @__PURE__ */ jsxs(Fragment, { children: [
1144
+ /* @__PURE__ */ jsx("li", { className: styles$u.breadcrumbsItem, children: item }),
1145
+ index < lastIndex && /* @__PURE__ */ jsx("li", { className: styles$u.breadcrumbsItem, "aria-hidden": "true", children: separator })
1118
1146
  ] }, index)) }) });
1119
1147
  }
1120
1148
  Breadcrumbs.Item = BreadcrumbItem;
@@ -1129,7 +1157,7 @@ const neutral$2 = "_neutral_1waqk_78";
1129
1157
  const lg$6 = "_lg_1waqk_145";
1130
1158
  const md$9 = "_md_1waqk_153";
1131
1159
  const sm$4 = "_sm_1waqk_161";
1132
- const styles$r = {
1160
+ const styles$s = {
1133
1161
  button: button,
1134
1162
  accent: accent$2,
1135
1163
  primary: primary$2,
@@ -1147,7 +1175,7 @@ const accent$1 = "_accent_o8iku_10";
1147
1175
  const neutral$1 = "_neutral_o8iku_22";
1148
1176
  const lg$5 = "_lg_o8iku_41";
1149
1177
  const md$8 = "_md_o8iku_46";
1150
- const styles$q = {
1178
+ const styles$r = {
1151
1179
  buttonFunction: buttonFunction,
1152
1180
  accent: accent$1,
1153
1181
  neutral: neutral$1,
@@ -1167,7 +1195,7 @@ function ButtonFunction({
1167
1195
  return /* @__PURE__ */ jsx(
1168
1196
  Component,
1169
1197
  {
1170
- className: classNames(styles$q.buttonFunction, styles$q[color], styles$q[size], className),
1198
+ className: classNames(styles$r.buttonFunction, styles$r[color], styles$r[size], className),
1171
1199
  ...props.disabled && { "data-disabled": true },
1172
1200
  ...!asChild && { type: "button" },
1173
1201
  ...props,
@@ -1189,7 +1217,7 @@ function Button({
1189
1217
  return /* @__PURE__ */ jsx(
1190
1218
  Component,
1191
1219
  {
1192
- className: classNames(styles$r.button, styles$r[color], styles$r[size], styles$r[mode], className),
1220
+ className: classNames(styles$s.button, styles$s[color], styles$s[size], styles$s[mode], className),
1193
1221
  ...!asChild && { type: "button" },
1194
1222
  ...props,
1195
1223
  children
@@ -1201,7 +1229,7 @@ Button.Function = ButtonFunction;
1201
1229
  const checkboxWrapper = "_checkboxWrapper_k1shg_2";
1202
1230
  const icon$2 = "_icon_k1shg_23";
1203
1231
  const checkbox = "_checkbox_k1shg_2";
1204
- const styles$p = {
1232
+ const styles$q = {
1205
1233
  checkboxWrapper: checkboxWrapper,
1206
1234
  icon: icon$2,
1207
1235
  checkbox: checkbox
@@ -1214,11 +1242,11 @@ function Checkbox({ className, label, indeterminate, ...props }) {
1214
1242
  {
1215
1243
  "data-disabled": `${Boolean(props.disabled)}`,
1216
1244
  "data-state": dataState,
1217
- className: classNames(styles$p.checkboxWrapper, className),
1245
+ className: classNames(styles$q.checkboxWrapper, className),
1218
1246
  children: [
1219
- dataState === "checked" && /* @__PURE__ */ jsx(IconCheck, { "data-disabled": `${Boolean(props.disabled)}`, className: styles$p.icon }),
1220
- dataState === "indeterminate" && /* @__PURE__ */ jsx(IconMinus, { "data-disabled": `${Boolean(props.disabled)}`, className: styles$p.icon }),
1221
- /* @__PURE__ */ jsx("input", { "data-state": dataState, type: "checkbox", className: styles$p.checkbox, ...props }),
1247
+ dataState === "checked" && /* @__PURE__ */ jsx(IconCheck, { "data-disabled": `${Boolean(props.disabled)}`, className: styles$q.icon }),
1248
+ dataState === "indeterminate" && /* @__PURE__ */ jsx(IconMinus, { "data-disabled": `${Boolean(props.disabled)}`, className: styles$q.icon }),
1249
+ /* @__PURE__ */ jsx("input", { "data-state": dataState, type: "checkbox", className: styles$q.checkbox, ...props }),
1222
1250
  label
1223
1251
  ]
1224
1252
  }
@@ -1226,7 +1254,7 @@ function Checkbox({ className, label, indeterminate, ...props }) {
1226
1254
  }
1227
1255
 
1228
1256
  const chip = "_chip_dj4kw_2";
1229
- const styles$o = {
1257
+ const styles$p = {
1230
1258
  chip: chip
1231
1259
  };
1232
1260
 
@@ -1234,7 +1262,7 @@ function Chip({ isSelected, children, className, disabled, ...props }) {
1234
1262
  return /* @__PURE__ */ jsx(
1235
1263
  "div",
1236
1264
  {
1237
- className: classNames(styles$o.chip, className),
1265
+ className: classNames(styles$p.chip, className),
1238
1266
  "data-selected": isSelected,
1239
1267
  "data-disabled": disabled,
1240
1268
  "aria-disabled": disabled,
@@ -1252,7 +1280,7 @@ const accent = "_accent_ww0fb_37";
1252
1280
  const neutral = "_neutral_ww0fb_42";
1253
1281
  const secondary$2 = "_secondary_ww0fb_47";
1254
1282
  const white = "_white_ww0fb_52";
1255
- const styles$n = {
1283
+ const styles$o = {
1256
1284
  root: root$1,
1257
1285
  lg: lg$4,
1258
1286
  md: md$7,
@@ -1264,7 +1292,7 @@ const styles$n = {
1264
1292
  };
1265
1293
 
1266
1294
  function Counter({ className, size = "lg", color = "red", ...props }) {
1267
- return /* @__PURE__ */ jsx("div", { className: classNames(styles$n.root, styles$n[size], styles$n[color], className), ...props });
1295
+ return /* @__PURE__ */ jsx("div", { className: classNames(styles$o.root, styles$o[size], styles$o[color], className), ...props });
1268
1296
  }
1269
1297
 
1270
1298
  const LOCALE_FIRST_DAY_OF_WEEK = {
@@ -1274,7 +1302,7 @@ const LOCALE_FIRST_DAY_OF_WEEK = {
1274
1302
 
1275
1303
  const datePickerCellWrapper = "_datePickerCellWrapper_np1gx_2";
1276
1304
  const datePickerCell = "_datePickerCell_np1gx_2";
1277
- const styles$m = {
1305
+ const styles$n = {
1278
1306
  datePickerCellWrapper: datePickerCellWrapper,
1279
1307
  datePickerCell: datePickerCell,
1280
1308
  "radius-none": "_radius-none_np1gx_83",
@@ -1284,10 +1312,10 @@ const styles$m = {
1284
1312
  };
1285
1313
 
1286
1314
  function DatePickerCell({ children, className, state, isCurrent, radius = "both", ...props }) {
1287
- return /* @__PURE__ */ jsx("div", { className: classNames(styles$m.datePickerCellWrapper, styles$m[`radius-${radius}`]), "data-state": state, children: /* @__PURE__ */ jsx(
1315
+ return /* @__PURE__ */ jsx("div", { className: classNames(styles$n.datePickerCellWrapper, styles$n[`radius-${radius}`]), "data-state": state, children: /* @__PURE__ */ jsx(
1288
1316
  "button",
1289
1317
  {
1290
- className: classNames(styles$m.datePickerCell, styles$m[`radius-${radius}`], className),
1318
+ className: classNames(styles$n.datePickerCell, styles$n[`radius-${radius}`], className),
1291
1319
  type: "button",
1292
1320
  role: "gridcell",
1293
1321
  "aria-selected": state === "selected",
@@ -1357,7 +1385,7 @@ function normalizeDateRange(firstDate, secondDate) {
1357
1385
  const datePickerField = "_datePickerField_1qk8s_2";
1358
1386
  const datePickerFieldCalendar = "_datePickerFieldCalendar_1qk8s_8";
1359
1387
  const datePickerFieldWeek = "_datePickerFieldWeek_1qk8s_14";
1360
- const styles$l = {
1388
+ const styles$m = {
1361
1389
  datePickerField: datePickerField,
1362
1390
  datePickerFieldCalendar: datePickerFieldCalendar,
1363
1391
  datePickerFieldWeek: datePickerFieldWeek
@@ -1372,9 +1400,9 @@ function DatePickerField({
1372
1400
  firstDayOfWeek = LOCALE_FIRST_DAY_OF_WEEK.ru
1373
1401
  }) {
1374
1402
  const weeks = useMemo(() => getCalendarGrid(month, year, firstDayOfWeek), [month, year, firstDayOfWeek]);
1375
- return /* @__PURE__ */ jsxs("div", { className: classNames(styles$l.datePickerField, className), role: "grid", children: [
1403
+ return /* @__PURE__ */ jsxs("div", { className: classNames(styles$m.datePickerField, className), role: "grid", children: [
1376
1404
  renderWeekdays?.(),
1377
- /* @__PURE__ */ jsx("div", { className: styles$l.datePickerFieldCalendar, role: "rowgroup", children: weeks.map((week, weekIndex) => /* @__PURE__ */ jsx("div", { className: styles$l.datePickerFieldWeek, role: "row", "aria-rowindex": weekIndex + 1, children: week.map((day, dayIndex) => /* @__PURE__ */ jsx(Slot, { role: "gridcell", "aria-colindex": dayIndex + 1, children: children(day) }, `${day.year}-${day.month}-${day.date}`)) }, weekIndex)) })
1405
+ /* @__PURE__ */ jsx("div", { className: styles$m.datePickerFieldCalendar, role: "rowgroup", children: weeks.map((week, weekIndex) => /* @__PURE__ */ jsx("div", { className: styles$m.datePickerFieldWeek, role: "row", "aria-rowindex": weekIndex + 1, children: week.map((day, dayIndex) => /* @__PURE__ */ jsx(Slot, { role: "gridcell", "aria-colindex": dayIndex + 1, children: children(day) }, `${day.year}-${day.month}-${day.date}`)) }, weekIndex)) })
1378
1406
  ] });
1379
1407
  }
1380
1408
 
@@ -1415,13 +1443,13 @@ const I18N_MONTH_LABELS = {
1415
1443
 
1416
1444
  const datePickerWeekdays = "_datePickerWeekdays_p8tsm_2";
1417
1445
  const datePickerWeekday = "_datePickerWeekday_p8tsm_2";
1418
- const styles$k = {
1446
+ const styles$l = {
1419
1447
  datePickerWeekdays: datePickerWeekdays,
1420
1448
  datePickerWeekday: datePickerWeekday
1421
1449
  };
1422
1450
 
1423
1451
  function DatePickerWeekDays({ className, locale = "ru" }) {
1424
- return /* @__PURE__ */ jsx("div", { className: classNames(styles$k.datePickerWeekdays, className), role: "row", children: I18N_WEEKDAY_LABELS[locale].map((label) => /* @__PURE__ */ jsx("div", { className: styles$k.datePickerWeekday, role: "columnheader", children: label }, label)) });
1452
+ return /* @__PURE__ */ jsx("div", { className: classNames(styles$l.datePickerWeekdays, className), role: "row", children: I18N_WEEKDAY_LABELS[locale].map((label) => /* @__PURE__ */ jsx("div", { className: styles$l.datePickerWeekday, role: "columnheader", children: label }, label)) });
1425
1453
  }
1426
1454
 
1427
1455
  function DatePicker() {
@@ -1657,21 +1685,21 @@ const DROPDOWN_PORTAL_SIDE_CONFIG = {
1657
1685
  };
1658
1686
 
1659
1687
  const dropdownContent = "_dropdownContent_12tkb_2";
1660
- const styles$j = {
1688
+ const styles$k = {
1661
1689
  dropdownContent: dropdownContent
1662
1690
  };
1663
1691
 
1664
1692
  function DropdownContent({ className, children, ...props }) {
1665
- return /* @__PURE__ */ jsx("div", { className: classNames(styles$j.dropdownContent, className), ...props, children });
1693
+ return /* @__PURE__ */ jsx("div", { className: classNames(styles$k.dropdownContent, className), ...props, children });
1666
1694
  }
1667
1695
 
1668
1696
  const dropdownItem = "_dropdownItem_msc4i_2";
1669
- const styles$i = {
1697
+ const styles$j = {
1670
1698
  dropdownItem: dropdownItem
1671
1699
  };
1672
1700
 
1673
1701
  function DropdownItem({ className, children, disabled, ...props }) {
1674
- return /* @__PURE__ */ jsx("div", { className: classNames(styles$i.dropdownItem, className), role: "menuitem", "data-disabled": disabled, ...props, children });
1702
+ return /* @__PURE__ */ jsx("div", { className: classNames(styles$j.dropdownItem, className), role: "menuitem", "data-disabled": disabled, ...props, children });
1675
1703
  }
1676
1704
 
1677
1705
  const CLICK_OUTSIDE_IGNORE_DATA_NAME = "data-clickoutside-ignore";
@@ -2099,7 +2127,7 @@ function useTriggerHandlersByEventTrigger() {
2099
2127
  }
2100
2128
 
2101
2129
  const dropdownPortal = "_dropdownPortal_p3tdk_2";
2102
- const styles$h = {
2130
+ const styles$i = {
2103
2131
  dropdownPortal: dropdownPortal
2104
2132
  };
2105
2133
 
@@ -2139,7 +2167,7 @@ function DropdownPortal({
2139
2167
  ...style
2140
2168
  },
2141
2169
  ref: portalRef,
2142
- className: classNames(styles$h.dropdownPortal, className),
2170
+ className: classNames(styles$i.dropdownPortal, className),
2143
2171
  ...handlersByTrigger[triggerEvent],
2144
2172
  ...isNested && { [CLICK_OUTSIDE_IGNORE_DATA_NAME]: "true" },
2145
2173
  children
@@ -2192,7 +2220,7 @@ const BOUNDARY_PAGES = 2;
2192
2220
  const paginationItem = "_paginationItem_1ll6p_2";
2193
2221
  const md$6 = "_md_1ll6p_46";
2194
2222
  const sm$3 = "_sm_1ll6p_60";
2195
- const styles$g = {
2223
+ const styles$h = {
2196
2224
  paginationItem: paginationItem,
2197
2225
  md: md$6,
2198
2226
  sm: sm$3
@@ -2204,7 +2232,7 @@ function PaginationItem({ className, children, size = "md", isCurrent, ...props
2204
2232
  {
2205
2233
  type: "button",
2206
2234
  ...isCurrent && { "aria-current": "page" },
2207
- className: classNames(styles$g.paginationItem, styles$g[size], className),
2235
+ className: classNames(styles$h.paginationItem, styles$h[size], className),
2208
2236
  ...props,
2209
2237
  children
2210
2238
  }
@@ -2241,7 +2269,7 @@ function getVisiblePages(totalPages, maxVisiblePagesWithEllipsis, currentPage) {
2241
2269
  const paginationRoot = "_paginationRoot_c5fwx_2";
2242
2270
  const paginationList = "_paginationList_c5fwx_7";
2243
2271
  const arrowLeft = "_arrowLeft_c5fwx_13";
2244
- const styles$f = {
2272
+ const styles$g = {
2245
2273
  paginationRoot: paginationRoot,
2246
2274
  paginationList: paginationList,
2247
2275
  arrowLeft: arrowLeft
@@ -2268,9 +2296,9 @@ function PaginationRoot({
2268
2296
  {
2269
2297
  "aria-label": "pagination navigation",
2270
2298
  role: "navigation",
2271
- className: classNames(styles$f.paginationRoot, className),
2299
+ className: classNames(styles$g.paginationRoot, className),
2272
2300
  ...props,
2273
- children: /* @__PURE__ */ jsxs("ul", { className: styles$f.paginationList, children: [
2301
+ children: /* @__PURE__ */ jsxs("ul", { className: styles$g.paginationList, children: [
2274
2302
  showArrows && /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
2275
2303
  PaginationItem$1,
2276
2304
  {
@@ -2278,7 +2306,7 @@ function PaginationRoot({
2278
2306
  onClick: () => onPageChange(currentPage - 1),
2279
2307
  disabled: isFirstPage,
2280
2308
  size,
2281
- children: /* @__PURE__ */ jsx(IconChevron$1, { className: styles$f.arrowLeft })
2309
+ children: /* @__PURE__ */ jsx(IconChevron$1, { className: styles$g.arrowLeft })
2282
2310
  }
2283
2311
  ) }),
2284
2312
  visiblePages.map((page, index) => /* @__PURE__ */ jsx("li", { children: page === ELLIPSIS_SYMBOL ? /* @__PURE__ */ jsx(PaginationItem$1, { "aria-label": "More pages", disabled: true, size, children: /* @__PURE__ */ jsx(Ellipsis, {}) }) : /* @__PURE__ */ jsx(
@@ -2314,15 +2342,15 @@ Pagination.Item = PaginationItem;
2314
2342
  const root = "_root_33gbh_2";
2315
2343
  const segment = "_segment_33gbh_10";
2316
2344
  const flexGrow = "_flexGrow_33gbh_19";
2317
- const fill = "_fill_33gbh_23";
2345
+ const fill$1 = "_fill_33gbh_23";
2318
2346
  const trail = "_trail_33gbh_28";
2319
2347
  const sm$2 = "_sm_33gbh_32";
2320
2348
  const md$5 = "_md_33gbh_36";
2321
- const styles$e = {
2349
+ const styles$f = {
2322
2350
  root: root,
2323
2351
  segment: segment,
2324
2352
  flexGrow: flexGrow,
2325
- fill: fill,
2353
+ fill: fill$1,
2326
2354
  trail: trail,
2327
2355
  sm: sm$2,
2328
2356
  md: md$5
@@ -2339,7 +2367,7 @@ function ProgressBarLinear({
2339
2367
  return /* @__PURE__ */ jsxs(
2340
2368
  "div",
2341
2369
  {
2342
- className: classNames(styles$e.root, styles$e[size], className),
2370
+ className: classNames(styles$f.root, styles$f[size], className),
2343
2371
  role: "progressbar",
2344
2372
  "aria-valuenow": clampedPercent,
2345
2373
  "aria-valuemin": 0,
@@ -2351,14 +2379,14 @@ function ProgressBarLinear({
2351
2379
  (Boolean(clampedPercent) || showFillOnZero) && /* @__PURE__ */ jsx(
2352
2380
  "div",
2353
2381
  {
2354
- className: classNames(styles$e.segment, styles$e.fill),
2382
+ className: classNames(styles$f.segment, styles$f.fill),
2355
2383
  style: {
2356
2384
  "--clamped-percent": `${clampedPercent}%`
2357
2385
  },
2358
2386
  "aria-hidden": "true"
2359
2387
  }
2360
2388
  ),
2361
- clampedPercent < 100 && /* @__PURE__ */ jsx("div", { className: classNames(styles$e.segment, styles$e.flexGrow, styles$e.trail), "aria-hidden": "true" })
2389
+ clampedPercent < 100 && /* @__PURE__ */ jsx("div", { className: classNames(styles$f.segment, styles$f.flexGrow, styles$f.trail), "aria-hidden": "true" })
2362
2390
  ]
2363
2391
  }
2364
2392
  );
@@ -2378,7 +2406,7 @@ function ProgressBarSteps({
2378
2406
  return /* @__PURE__ */ jsx(
2379
2407
  "div",
2380
2408
  {
2381
- className: classNames(styles$e.segment, styles$e.flexGrow, isFilled ? styles$e.fill : styles$e.trail),
2409
+ className: classNames(styles$f.segment, styles$f.flexGrow, isFilled ? styles$f.fill : styles$f.trail),
2382
2410
  "aria-hidden": "true"
2383
2411
  },
2384
2412
  index
@@ -2387,7 +2415,7 @@ function ProgressBarSteps({
2387
2415
  return /* @__PURE__ */ jsx(
2388
2416
  "div",
2389
2417
  {
2390
- className: classNames(styles$e.root, styles$e[size], className),
2418
+ className: classNames(styles$f.root, styles$f[size], className),
2391
2419
  role: "progressbar",
2392
2420
  "aria-valuenow": clampedCurrent,
2393
2421
  "aria-valuemin": 0,
@@ -2407,14 +2435,14 @@ ProgressBar.Steps = ProgressBarSteps;
2407
2435
 
2408
2436
  const radioWrapper = "_radioWrapper_13xie_2";
2409
2437
  const radio = "_radio_13xie_2";
2410
- const styles$d = {
2438
+ const styles$e = {
2411
2439
  radioWrapper: radioWrapper,
2412
2440
  radio: radio
2413
2441
  };
2414
2442
 
2415
2443
  function RadioButton({ className, label, ...props }) {
2416
- return /* @__PURE__ */ jsxs("label", { "data-disabled": `${Boolean(props.disabled)}`, className: classNames(styles$d.radioWrapper, className), children: [
2417
- /* @__PURE__ */ jsx("input", { type: "radio", className: styles$d.radio, ...props }),
2444
+ return /* @__PURE__ */ jsxs("label", { "data-disabled": `${Boolean(props.disabled)}`, className: classNames(styles$e.radioWrapper, className), children: [
2445
+ /* @__PURE__ */ jsx("input", { type: "radio", className: styles$e.radio, ...props }),
2418
2446
  label
2419
2447
  ] });
2420
2448
  }
@@ -2425,7 +2453,7 @@ const textFieldAreaWrapper = "_textFieldAreaWrapper_pia91_2";
2425
2453
  const textFieldAreaLabel = "_textFieldAreaLabel_pia91_14";
2426
2454
  const textFieldAreaLabelSuffix = "_textFieldAreaLabelSuffix_pia91_24";
2427
2455
  const textFieldArea = "_textFieldArea_pia91_2";
2428
- const styles$c = {
2456
+ const styles$d = {
2429
2457
  textFieldAreaWrapper: textFieldAreaWrapper,
2430
2458
  textFieldAreaLabel: textFieldAreaLabel,
2431
2459
  textFieldAreaLabelSuffix: textFieldAreaLabelSuffix,
@@ -2446,14 +2474,14 @@ function TextFieldArea({
2446
2474
  "data-invalid": isInvalid,
2447
2475
  "aria-invalid": isInvalid,
2448
2476
  "data-element": "field",
2449
- className: classNames(styles$c.textFieldArea, className),
2477
+ className: classNames(styles$d.textFieldArea, className),
2450
2478
  placeholder,
2451
2479
  ...props
2452
2480
  }
2453
2481
  );
2454
- return floatingLabel ? /* @__PURE__ */ jsxs("div", { className: styles$c.textFieldAreaWrapper, children: [
2455
- /* @__PURE__ */ jsx("label", { htmlFor: props.id, className: styles$c.textFieldAreaLabel, "data-element": "label", children: floatingLabel }),
2456
- floatingLabelSuffix && /* @__PURE__ */ jsx("span", { className: styles$c.textFieldAreaLabelSuffix, "data-element": "label-suffix", children: floatingLabelSuffix }),
2482
+ return floatingLabel ? /* @__PURE__ */ jsxs("div", { className: styles$d.textFieldAreaWrapper, children: [
2483
+ /* @__PURE__ */ jsx("label", { htmlFor: props.id, className: styles$d.textFieldAreaLabel, "data-element": "label", children: floatingLabel }),
2484
+ floatingLabelSuffix && /* @__PURE__ */ jsx("span", { className: styles$d.textFieldAreaLabelSuffix, "data-element": "label-suffix", children: floatingLabelSuffix }),
2457
2485
  textFieldArea
2458
2486
  ] }) : textFieldArea;
2459
2487
  }
@@ -2461,7 +2489,7 @@ function TextFieldArea({
2461
2489
  const textFieldInputWrapper = "_textFieldInputWrapper_1m8sa_2";
2462
2490
  const textFieldInputLabel = "_textFieldInputLabel_1m8sa_9";
2463
2491
  const textFieldInput = "_textFieldInput_1m8sa_2";
2464
- const styles$b = {
2492
+ const styles$c = {
2465
2493
  textFieldInputWrapper: textFieldInputWrapper,
2466
2494
  textFieldInputLabel: textFieldInputLabel,
2467
2495
  textFieldInput: textFieldInput
@@ -2480,37 +2508,37 @@ function TextFieldInput({
2480
2508
  "data-invalid": isInvalid,
2481
2509
  "aria-invalid": isInvalid,
2482
2510
  "data-element": "field",
2483
- className: classNames(styles$b.textFieldInput, className),
2511
+ className: classNames(styles$c.textFieldInput, className),
2484
2512
  placeholder,
2485
2513
  ...props
2486
2514
  }
2487
2515
  );
2488
- return floatingLabel ? /* @__PURE__ */ jsxs("div", { className: styles$b.textFieldInputWrapper, children: [
2489
- /* @__PURE__ */ jsx("label", { htmlFor: props.id, className: styles$b.textFieldInputLabel, "data-element": "label", children: floatingLabel }),
2516
+ return floatingLabel ? /* @__PURE__ */ jsxs("div", { className: styles$c.textFieldInputWrapper, children: [
2517
+ /* @__PURE__ */ jsx("label", { htmlFor: props.id, className: styles$c.textFieldInputLabel, "data-element": "label", children: floatingLabel }),
2490
2518
  textFieldInput
2491
2519
  ] }) : textFieldInput;
2492
2520
  }
2493
2521
 
2494
- const textFieldLabel = "_textFieldLabel_1l2ya_1";
2495
- const styles$a = {
2522
+ const textFieldLabel = "_textFieldLabel_1xy6x_2";
2523
+ const styles$b = {
2496
2524
  textFieldLabel: textFieldLabel
2497
2525
  };
2498
2526
 
2499
2527
  function TextFieldLabel({ className, children, isRequired, ...props }) {
2500
- return /* @__PURE__ */ jsx("label", { className: classNames(styles$a.textFieldLabel, className), "data-required": isRequired, ...props, children });
2528
+ return /* @__PURE__ */ jsx("label", { className: classNames(styles$b.textFieldLabel, className), "data-required": isRequired, ...props, children });
2501
2529
  }
2502
2530
 
2503
2531
  const textFieldRoot = "_textFieldRoot_cs7mv_2";
2504
2532
  const lg$3 = "_lg_cs7mv_38";
2505
2533
  const md$4 = "_md_cs7mv_70";
2506
- const styles$9 = {
2534
+ const styles$a = {
2507
2535
  textFieldRoot: textFieldRoot,
2508
2536
  lg: lg$3,
2509
2537
  md: md$4
2510
2538
  };
2511
2539
 
2512
2540
  function TextFieldRoot({ className, size = "lg", ...props }) {
2513
- return /* @__PURE__ */ jsx("div", { className: classNames(styles$9.textFieldRoot, styles$9[size], className), ...props });
2541
+ return /* @__PURE__ */ jsx("div", { className: classNames(styles$a.textFieldRoot, styles$a[size], className), ...props });
2514
2542
  }
2515
2543
 
2516
2544
  function TextField() {
@@ -2525,7 +2553,7 @@ const custom = "_custom_gh87y_15";
2525
2553
  const icon$1 = "_icon_gh87y_25";
2526
2554
  const inputCustomWrapper = "_inputCustomWrapper_gh87y_34";
2527
2555
  const customButton = "_customButton_gh87y_49";
2528
- const styles$8 = {
2556
+ const styles$9 = {
2529
2557
  search: search,
2530
2558
  "default": "_default_gh87y_10",
2531
2559
  custom: custom,
@@ -2551,7 +2579,7 @@ function Search(props) {
2551
2579
  value && /* @__PURE__ */ jsx(
2552
2580
  IconXMark.Small,
2553
2581
  {
2554
- className: styles$8.icon,
2582
+ className: styles$9.icon,
2555
2583
  "aria-label": "clear search",
2556
2584
  role: "button",
2557
2585
  onClick: () => {
@@ -2565,13 +2593,13 @@ function Search(props) {
2565
2593
  }
2566
2594
  )
2567
2595
  ] });
2568
- return /* @__PURE__ */ jsxs(TextField.Root, { size: "md", className: classNames(styles$8.search, styles$8[mode], className), children: [
2596
+ return /* @__PURE__ */ jsxs(TextField.Root, { size: "md", className: classNames(styles$9.search, styles$9[mode], className), children: [
2569
2597
  mode === "default" && /* @__PURE__ */ jsxs(Fragment$1, { children: [
2570
- /* @__PURE__ */ jsx(IconSearch, { className: styles$8.icon, "data-element": "icon" }),
2598
+ /* @__PURE__ */ jsx(IconSearch, { className: styles$9.icon, "data-element": "icon" }),
2571
2599
  inputField
2572
2600
  ] }),
2573
2601
  mode === "custom" && /* @__PURE__ */ jsxs(Fragment$1, { children: [
2574
- /* @__PURE__ */ jsx("div", { className: styles$8.inputCustomWrapper, children: inputField }),
2602
+ /* @__PURE__ */ jsx("div", { className: styles$9.inputCustomWrapper, children: inputField }),
2575
2603
  /* @__PURE__ */ jsx(
2576
2604
  "button",
2577
2605
  {
@@ -2579,11 +2607,11 @@ function Search(props) {
2579
2607
  type: "button",
2580
2608
  onClick: props.onSearch,
2581
2609
  "data-element": "custom-button",
2582
- className: styles$8.customButton,
2610
+ className: styles$9.customButton,
2583
2611
  style: {
2584
2612
  "--custom-button-width": `${props.buttonWidth ?? DEFAULT_CUSTOM_SEARCH_BUTTON_WIDTH}px`
2585
2613
  },
2586
- children: /* @__PURE__ */ jsx(IconSearch, { className: classNames(styles$8.icon), "data-element": "icon" })
2614
+ children: /* @__PURE__ */ jsx(IconSearch, { className: classNames(styles$9.icon), "data-element": "icon" })
2587
2615
  }
2588
2616
  )
2589
2617
  ] })
@@ -2609,7 +2637,7 @@ function useSegmentControlContext() {
2609
2637
  const segmentControlItem = "_segmentControlItem_178px_2";
2610
2638
  const lg$2 = "_lg_178px_23";
2611
2639
  const md$3 = "_md_178px_28";
2612
- const styles$7 = {
2640
+ const styles$8 = {
2613
2641
  segmentControlItem: segmentControlItem,
2614
2642
  lg: lg$2,
2615
2643
  md: md$3
@@ -2625,7 +2653,7 @@ function SegmentControlItem({ className, children, value, ...props }) {
2625
2653
  "aria-checked": value === activeValue,
2626
2654
  "data-state": value === activeValue ? "on" : "off",
2627
2655
  "data-value": value,
2628
- className: classNames(styles$7.segmentControlItem, styles$7[size], className),
2656
+ className: classNames(styles$8.segmentControlItem, styles$8[size], className),
2629
2657
  ...props,
2630
2658
  children
2631
2659
  }
@@ -2662,7 +2690,7 @@ const showAfterDelay = "_showAfterDelay_pulca_1";
2662
2690
  const lg$1 = "_lg_pulca_19";
2663
2691
  const md$2 = "_md_pulca_23";
2664
2692
  const indicator$1 = "_indicator_pulca_28";
2665
- const styles$6 = {
2693
+ const styles$7 = {
2666
2694
  segmentControlRoot: segmentControlRoot,
2667
2695
  showAfterDelay: showAfterDelay,
2668
2696
  lg: lg$1,
@@ -2677,11 +2705,11 @@ function SegmentControlRoot({ className, children, value, size = "md", ...props
2677
2705
  {
2678
2706
  ref: rootRef,
2679
2707
  role: "radiogroup",
2680
- className: classNames(styles$6.segmentControlRoot, styles$6[size], className),
2708
+ className: classNames(styles$7.segmentControlRoot, styles$7[size], className),
2681
2709
  ...props,
2682
2710
  children: [
2683
2711
  children,
2684
- /* @__PURE__ */ jsx("div", { className: classNames(styles$6.indicator, styles$6[size]), style: indicatorStyle })
2712
+ /* @__PURE__ */ jsx("div", { className: classNames(styles$7.indicator, styles$7[size]), style: indicatorStyle })
2685
2713
  ]
2686
2714
  }
2687
2715
  ) });
@@ -2692,6 +2720,302 @@ function SegmentControl(props) {
2692
2720
  }
2693
2721
  SegmentControl.Item = SegmentControlItem;
2694
2722
 
2723
+ const SLIDER_DEFAULT_MIN = 0;
2724
+ const SLIDER_DEFAULT_MAX = 100;
2725
+ const SLIDER_DEFAULT_STEP = 1;
2726
+ const SLIDER_PAGE_STEP_MULTIPLIER = 10;
2727
+ const SLIDER_STEP_MULTIPLIER_BY_KEY = {
2728
+ ArrowRight: 1,
2729
+ ArrowUp: 1,
2730
+ ArrowLeft: -1,
2731
+ ArrowDown: -1,
2732
+ PageUp: SLIDER_PAGE_STEP_MULTIPLIER,
2733
+ PageDown: -SLIDER_PAGE_STEP_MULTIPLIER
2734
+ };
2735
+
2736
+ function getNearestHandleIndex(target, values) {
2737
+ let nearestIndex = 0;
2738
+ let nearestDistance = Number.POSITIVE_INFINITY;
2739
+ values.forEach((value, index) => {
2740
+ const distance = Math.abs(value - target);
2741
+ const isCloser = distance < nearestDistance;
2742
+ const isTieResolvedByDirection = distance === nearestDistance && target > value;
2743
+ if (isCloser || isTieResolvedByDirection) {
2744
+ nearestDistance = distance;
2745
+ nearestIndex = index;
2746
+ }
2747
+ });
2748
+ return nearestIndex;
2749
+ }
2750
+
2751
+ function getPercent(value, bounds) {
2752
+ const { min, max } = bounds;
2753
+ if (max <= min) {
2754
+ return 0;
2755
+ }
2756
+ return Math.min(Math.max((value - min) / (max - min) * 100, 0), 100);
2757
+ }
2758
+
2759
+ function getFractionLength(value) {
2760
+ return String(value).split(".")[1]?.length ?? 0;
2761
+ }
2762
+ function snapToStep(value, bounds) {
2763
+ const { min, max, step } = bounds;
2764
+ const clamped = Math.min(Math.max(value, min), max);
2765
+ if (step <= 0) {
2766
+ return clamped;
2767
+ }
2768
+ const snapped = min + Math.round((clamped - min) / step) * step;
2769
+ const precision = Math.max(getFractionLength(step), getFractionLength(min));
2770
+ return Number(Math.min(Math.max(snapped, min), max).toFixed(precision));
2771
+ }
2772
+
2773
+ function getValueFromPointer(params) {
2774
+ const { clientX, trackStart, trackWidth, min, max, step } = params;
2775
+ if (trackWidth <= 0) {
2776
+ return min;
2777
+ }
2778
+ const ratio = (clientX - trackStart) / trackWidth;
2779
+ return snapToStep(min + ratio * (max - min), { min, max, step });
2780
+ }
2781
+
2782
+ function normalizeMark(mark) {
2783
+ if (typeof mark === "number") {
2784
+ return { value: mark, label: mark };
2785
+ }
2786
+ return { value: mark.value, label: mark.label };
2787
+ }
2788
+
2789
+ function updateHandleValue(params) {
2790
+ const { values, index, next, min, max, step } = params;
2791
+ const lowerBound = values[index - 1] ?? min;
2792
+ const upperBound = values[index + 1] ?? max;
2793
+ const snapped = snapToStep(next, { min, max, step });
2794
+ const nextValues = [...values];
2795
+ nextValues[index] = Math.min(Math.max(snapped, lowerBound), upperBound);
2796
+ return nextValues;
2797
+ }
2798
+
2799
+ const slider = "_slider_vuele_2";
2800
+ const fill = "_fill_vuele_20";
2801
+ const rail = "_rail_vuele_26";
2802
+ const handle = "_handle_vuele_34";
2803
+ const mark = "_mark_vuele_39";
2804
+ const markDot = "_markDot_vuele_43";
2805
+ const track = "_track_vuele_56";
2806
+ const marks = "_marks_vuele_106";
2807
+ const styles$6 = {
2808
+ slider: slider,
2809
+ fill: fill,
2810
+ rail: rail,
2811
+ handle: handle,
2812
+ mark: mark,
2813
+ markDot: markDot,
2814
+ track: track,
2815
+ marks: marks
2816
+ };
2817
+
2818
+ function SliderMarks({ marks, min, max, activeFrom, activeTo }) {
2819
+ return /* @__PURE__ */ jsx("div", { className: styles$6.marks, children: marks.map(({ value, label }) => {
2820
+ const isActive = value >= activeFrom && value <= activeTo;
2821
+ return /* @__PURE__ */ jsxs(
2822
+ "div",
2823
+ {
2824
+ "data-state": isActive ? "active" : "default",
2825
+ className: styles$6.mark,
2826
+ style: { insetInlineStart: `${getPercent(value, { min, max })}%` },
2827
+ children: [
2828
+ /* @__PURE__ */ jsx("span", { className: styles$6.markDot }),
2829
+ label
2830
+ ]
2831
+ },
2832
+ value
2833
+ );
2834
+ }) });
2835
+ }
2836
+
2837
+ function SliderBase({
2838
+ values,
2839
+ onValuesChange,
2840
+ min = SLIDER_DEFAULT_MIN,
2841
+ max = SLIDER_DEFAULT_MAX,
2842
+ step = SLIDER_DEFAULT_STEP,
2843
+ marks,
2844
+ disabled,
2845
+ className,
2846
+ "aria-label": ariaLabel,
2847
+ "aria-labelledby": ariaLabelledBy,
2848
+ "aria-describedby": ariaDescribedBy,
2849
+ ...props
2850
+ }) {
2851
+ const railRef = useRef(null);
2852
+ const handleRefs = useRef([]);
2853
+ const dragRef = useRef(null);
2854
+ const normalizedMarks = useMemo(() => marks?.map(normalizeMark) ?? [], [marks]);
2855
+ const fillFrom = values.length > 1 ? values[0] ?? min : min;
2856
+ const fillTo = values.at(-1) ?? min;
2857
+ const toPercent = (value) => getPercent(value, { min, max });
2858
+ const resolveKeyValue = (key, current) => {
2859
+ const multiplier = SLIDER_STEP_MULTIPLIER_BY_KEY[key];
2860
+ if (multiplier !== void 0) {
2861
+ return current + step * multiplier;
2862
+ }
2863
+ if (key === "Home") {
2864
+ return min;
2865
+ }
2866
+ return key === "End" ? max : null;
2867
+ };
2868
+ const resolveValueText = (value) => {
2869
+ const { label } = normalizedMarks.find((mark) => mark.value === value) ?? {};
2870
+ const text = typeof label === "string" || typeof label === "number" ? String(label) : void 0;
2871
+ return text === String(value) ? void 0 : text;
2872
+ };
2873
+ const commit = (index, next) => {
2874
+ const nextValues = updateHandleValue({ values, index, next, min, max, step });
2875
+ if (nextValues[index] === values[index]) {
2876
+ return;
2877
+ }
2878
+ onValuesChange(nextValues);
2879
+ };
2880
+ const readPointerValue = (clientX) => {
2881
+ if (!railRef.current) {
2882
+ return null;
2883
+ }
2884
+ const rect = railRef.current.getBoundingClientRect();
2885
+ return getValueFromPointer({ clientX, trackStart: rect.left, trackWidth: rect.width, min, max, step });
2886
+ };
2887
+ const handleKeyDown = (event, index) => {
2888
+ const current = values[index];
2889
+ if (disabled || current === void 0) {
2890
+ return;
2891
+ }
2892
+ const next = resolveKeyValue(event.key, current);
2893
+ if (next === null) {
2894
+ return;
2895
+ }
2896
+ event.preventDefault();
2897
+ commit(index, next);
2898
+ };
2899
+ const handlePointerDown = (event) => {
2900
+ if (disabled || event.button !== 0 || !event.isPrimary) {
2901
+ return;
2902
+ }
2903
+ const grabbedIndex = handleRefs.current.findIndex((handle) => handle === event.target);
2904
+ if (grabbedIndex >= 0) {
2905
+ const isAmbiguousGrab = values.filter((value) => value === values[grabbedIndex]).length > 1;
2906
+ dragRef.current = { pointerId: event.pointerId, index: isAmbiguousGrab ? null : grabbedIndex };
2907
+ event.currentTarget.setPointerCapture(event.pointerId);
2908
+ return;
2909
+ }
2910
+ const pointerValue = readPointerValue(event.clientX);
2911
+ if (pointerValue === null) {
2912
+ return;
2913
+ }
2914
+ const nearestIndex = getNearestHandleIndex(pointerValue, values);
2915
+ dragRef.current = { pointerId: event.pointerId, index: nearestIndex };
2916
+ event.currentTarget.setPointerCapture(event.pointerId);
2917
+ handleRefs.current[nearestIndex]?.focus();
2918
+ commit(nearestIndex, pointerValue);
2919
+ };
2920
+ const handlePointerMove = (event) => {
2921
+ const drag = dragRef.current;
2922
+ if (!drag || drag.pointerId !== event.pointerId || disabled) {
2923
+ return;
2924
+ }
2925
+ const pointerValue = readPointerValue(event.clientX);
2926
+ if (pointerValue === null) {
2927
+ return;
2928
+ }
2929
+ const index = drag.index ?? getNearestHandleIndex(pointerValue, values);
2930
+ dragRef.current = { pointerId: drag.pointerId, index };
2931
+ handleRefs.current[index]?.focus();
2932
+ commit(index, pointerValue);
2933
+ };
2934
+ const stopDragging = (event) => {
2935
+ if (dragRef.current?.pointerId !== event.pointerId) {
2936
+ return;
2937
+ }
2938
+ dragRef.current = null;
2939
+ if (event.currentTarget.hasPointerCapture(event.pointerId)) {
2940
+ event.currentTarget.releasePointerCapture(event.pointerId);
2941
+ }
2942
+ };
2943
+ const handleLostPointerCapture = (event) => {
2944
+ if (dragRef.current?.pointerId === event.pointerId) {
2945
+ dragRef.current = null;
2946
+ }
2947
+ };
2948
+ return /* @__PURE__ */ jsx(
2949
+ "div",
2950
+ {
2951
+ className: classNames(styles$6.slider, className),
2952
+ "data-disabled": disabled,
2953
+ "data-marks": Boolean(marks?.length),
2954
+ ...props,
2955
+ children: /* @__PURE__ */ jsxs(
2956
+ "div",
2957
+ {
2958
+ ref: railRef,
2959
+ className: styles$6.rail,
2960
+ onPointerDown: handlePointerDown,
2961
+ onPointerMove: handlePointerMove,
2962
+ onPointerUp: stopDragging,
2963
+ onPointerCancel: stopDragging,
2964
+ onLostPointerCapture: handleLostPointerCapture,
2965
+ children: [
2966
+ /* @__PURE__ */ jsx("div", { className: styles$6.track }),
2967
+ /* @__PURE__ */ jsx(
2968
+ "div",
2969
+ {
2970
+ className: styles$6.fill,
2971
+ style: { insetInlineStart: `${toPercent(fillFrom)}%`, insetInlineEnd: `${100 - toPercent(fillTo)}%` }
2972
+ }
2973
+ ),
2974
+ normalizedMarks.length ? /* @__PURE__ */ jsx(SliderMarks, { marks: normalizedMarks, min, max, activeFrom: fillFrom, activeTo: fillTo }) : null,
2975
+ values.map((value, index) => /* @__PURE__ */ jsx(
2976
+ "div",
2977
+ {
2978
+ ref: (element) => {
2979
+ handleRefs.current[index] = element;
2980
+ },
2981
+ role: "slider",
2982
+ tabIndex: disabled ? -1 : 0,
2983
+ "aria-valuemin": min,
2984
+ "aria-valuemax": max,
2985
+ "aria-valuenow": value,
2986
+ "aria-valuetext": resolveValueText(value),
2987
+ "aria-label": ariaLabel,
2988
+ "aria-labelledby": ariaLabelledBy,
2989
+ "aria-describedby": ariaDescribedBy,
2990
+ "aria-disabled": disabled,
2991
+ "aria-orientation": "horizontal",
2992
+ className: styles$6.handle,
2993
+ style: { insetInlineStart: `${toPercent(value)}%` },
2994
+ onKeyDown: (event) => handleKeyDown(event, index)
2995
+ },
2996
+ index
2997
+ ))
2998
+ ]
2999
+ }
3000
+ )
3001
+ }
3002
+ );
3003
+ }
3004
+
3005
+ function SliderRange({ value, onChange, ...props }) {
3006
+ const handleValuesChange = (nextValues) => {
3007
+ const [from = value[0], to = value[1]] = nextValues;
3008
+ onChange([from, to]);
3009
+ };
3010
+ return /* @__PURE__ */ jsx(SliderBase, { values: value, onValuesChange: handleValuesChange, ...props });
3011
+ }
3012
+
3013
+ function Slider({ value, onChange, ...props }) {
3014
+ const handleValuesChange = ([next = value]) => onChange(next);
3015
+ return /* @__PURE__ */ jsx(SliderBase, { values: [value], onValuesChange: handleValuesChange, ...props });
3016
+ }
3017
+ Slider.Range = SliderRange;
3018
+
2695
3019
  const stepper = "_stepper_103n3_2";
2696
3020
  const sm$1 = "_sm_103n3_10";
2697
3021
  const md$1 = "_md_103n3_17";
@@ -3018,4 +3342,4 @@ function Tooltip(props) {
3018
3342
  }
3019
3343
  Tooltip.Content = TooltipContent;
3020
3344
 
3021
- export { Badge, BadgeTabs, Breadcrumbs, Button, Checkbox, Chip, Counter, DatePicker, DropdownMenu, I18N_MONTH_LABELS, I18N_WEEKDAY_LABELS, IconArrow, IconArrowCircle, IconArrowCircleUp, IconArrowDiagonal, IconArrowUTurn, IconBell, IconBox, IconCalendar, IconCharacteristic, IconCheck, IconCheckCircle, IconChevron, IconChevronDouble, IconClock, IconCollapse, IconCopy, IconDots, IconDownload, IconEye, IconFace, IconFile, IconFilters, IconGear, IconHanger, IconHome, IconInfo, IconLogOut, IconLogo, IconMail, IconMinus, IconOneCircle, IconPerson, IconPhone, IconPlus, IconPrize, IconProject, IconQRCode, IconRequest, IconResizeCorner, IconScan, IconSearch, IconShopping, IconSort, IconStar, IconSticker, IconStop, IconSwitch, IconTrash, IconXMark, IconXMarkCircle, LOCALE_FIRST_DAY_OF_WEEK, Pagination, ProgressBar, RadioButton, Search, SegmentControl, Stepper, Switch, Tabs, Tag, TextField, Tooltip, useDatePickerControls, useDatePickerMultiSelect, useDatePickerSelect };
3345
+ export { Badge, BadgeTabs, Breadcrumbs, Button, Checkbox, Chip, Counter, DatePicker, DropdownMenu, I18N_MONTH_LABELS, I18N_WEEKDAY_LABELS, IconArrow, IconArrowCircle, IconArrowCircleUp, IconArrowDiagonal, IconArrowUTurn, IconBell, IconBox, IconCalendar, IconCharacteristic, IconCheck, IconCheckCircle, IconChevron, IconChevronDouble, IconClock, IconCollapse, IconCopy, IconDots, IconDownload, IconEye, IconFace, IconFile, IconFilters, IconGear, IconHanger, IconHome, IconInfo, IconLogOut, IconLogo, IconMail, IconMinus, IconOneCircle, IconPerson, IconPhone, IconPlus, IconPrize, IconProject, IconQRCode, IconRequest, IconResizeCorner, IconScan, IconSearch, IconShopping, IconSort, IconStar, IconSticker, IconStop, IconStore, IconSwitch, IconTrash, IconXMark, IconXMarkCircle, LOCALE_FIRST_DAY_OF_WEEK, Pagination, ProgressBar, RadioButton, Search, SegmentControl, Slider, Stepper, Switch, Tabs, Tag, TextField, Tooltip, useDatePickerControls, useDatePickerMultiSelect, useDatePickerSelect };