@herca/r-kit 0.0.74 → 0.0.76

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/clients.cjs CHANGED
@@ -11500,7 +11500,7 @@ function useUrlSearchParams() {
11500
11500
  const next = updater(readParams());
11501
11501
  const query = next.toString();
11502
11502
  const url = `${window.location.pathname}${query ? `?${query}` : ""}${window.location.hash}`;
11503
- if (options?.replace) {
11503
+ if (options?.replace == true) {
11504
11504
  window.history.replaceState(window.history.state, "", url);
11505
11505
  } else {
11506
11506
  window.history.pushState(window.history.state, "", url);
@@ -17042,25 +17042,21 @@ function RoundedSpinner({
17042
17042
  // src/components/select/select.tsx
17043
17043
  var import_clsx14 = __toESM(require("clsx"), 1);
17044
17044
  var import_jsx_runtime435 = require("react/jsx-runtime");
17045
- var isGroup = (item) => item != null && Array.isArray(item.options);
17046
17045
  function Select({
17047
17046
  options = [],
17048
17047
  value = null,
17049
17048
  onChange,
17050
17049
  isMulti = false,
17051
- multiple = false,
17052
17050
  placeholder = "Select...",
17053
17051
  isSearchable = true,
17054
17052
  isClearable = true,
17055
17053
  isDisabled = false,
17056
- disabled = false,
17057
17054
  renderOption = null,
17058
17055
  renderValue = null,
17059
17056
  className,
17060
17057
  label,
17061
17058
  description,
17062
17059
  hint,
17063
- tooltip,
17064
17060
  errorMessages,
17065
17061
  isLoadingMore,
17066
17062
  onLoadMore,
@@ -17074,8 +17070,7 @@ function Select({
17074
17070
  isSelectOpen,
17075
17071
  onOpenChange,
17076
17072
  searchOptions,
17077
- searchPlaceholder = "Search...",
17078
- icon
17073
+ searchPlaceholder = "Search..."
17079
17074
  }) {
17080
17075
  const [isOpen, setIsOpen] = (0, import_react415.useState)(false);
17081
17076
  const [searchTerm, setSearchTerm] = (0, import_react415.useState)("");
@@ -17092,40 +17087,20 @@ function Select({
17092
17087
  onLoadMore?.();
17093
17088
  }
17094
17089
  };
17095
- const getSearchText = (option) => typeof option.label === "string" ? option.label : String(option.value ?? "");
17096
- const { filteredOptions, renderEntries } = import_react415.default.useMemo(() => {
17097
- const flat = [];
17098
- const entries = [];
17099
- const term = searchTerm.toLowerCase();
17100
- const matches2 = (o) => getSearchText(o).toLowerCase().includes(term);
17101
- for (const item of options) {
17102
- if (isGroup(item)) {
17103
- const matched = item.options.filter(matches2);
17104
- if (matched.length === 0) continue;
17105
- const items = matched.map((option) => {
17106
- const index = flat.length;
17107
- flat.push(option);
17108
- return { option, index };
17109
- });
17110
- entries.push({ kind: "group", label: item.label, items });
17111
- } else {
17112
- if (!matches2(item)) continue;
17113
- const index = flat.length;
17114
- flat.push(item);
17115
- entries.push({ kind: "option", option: item, index });
17116
- }
17117
- }
17118
- return { filteredOptions: flat, renderEntries: entries };
17090
+ const filteredOptions = import_react415.default.useMemo(() => {
17091
+ return options.filter(
17092
+ (option) => option.label.toLowerCase().includes(searchTerm.toLowerCase()) === true
17093
+ );
17119
17094
  }, [options, searchTerm]);
17120
17095
  const asArray = (val) => Array.isArray(val) ? val : val ? [val] : [];
17121
17096
  const isSelected = (option) => {
17122
- if (isMulti || multiple) {
17097
+ if (isMulti) {
17123
17098
  return asArray(value).some((v3) => v3.value === option.value);
17124
17099
  }
17125
17100
  return value?.value === option.value;
17126
17101
  };
17127
17102
  const handleSelect = (option) => {
17128
- if (isMulti || multiple) {
17103
+ if (isMulti) {
17129
17104
  const arr = asArray(value);
17130
17105
  const exists = arr.some((v3) => v3.value === option.value);
17131
17106
  const newValue = exists ? arr.filter((v3) => v3.value !== option.value) : [...arr, option];
@@ -17141,7 +17116,7 @@ function Select({
17141
17116
  };
17142
17117
  const handleRemove = (option, e) => {
17143
17118
  e.stopPropagation();
17144
- if (isMulti || multiple) {
17119
+ if (isMulti) {
17145
17120
  const arr = asArray(value);
17146
17121
  onChange?.(arr.filter((v3) => v3.value !== option.value));
17147
17122
  } else {
@@ -17150,7 +17125,7 @@ function Select({
17150
17125
  };
17151
17126
  const handleClear = (e) => {
17152
17127
  e.stopPropagation();
17153
- onChange?.(isMulti || multiple ? [] : null);
17128
+ onChange?.(isMulti ? [] : null);
17154
17129
  };
17155
17130
  const handleKeyDown2 = (e) => {
17156
17131
  if (!isOpen) {
@@ -17235,11 +17210,11 @@ function Select({
17235
17210
  }
17236
17211
  }, [searchOptions]);
17237
17212
  const getDisplayValue = () => {
17238
- const isEmpty = value == null || (isMulti || multiple) && asArray(value).length === 0;
17213
+ const isEmpty = value == null || isMulti && asArray(value).length === 0;
17239
17214
  if (isEmpty) {
17240
17215
  return /* @__PURE__ */ (0, import_jsx_runtime435.jsx)("span", { className: "text-gray-500", children: placeholder });
17241
17216
  }
17242
- if (isMulti || multiple) {
17217
+ if (isMulti) {
17243
17218
  return /* @__PURE__ */ (0, import_jsx_runtime435.jsx)("div", { className: "flex flex-wrap gap-1", children: asArray(value).map((item) => /* @__PURE__ */ (0, import_jsx_runtime435.jsxs)(
17244
17219
  "div",
17245
17220
  {
@@ -17261,23 +17236,8 @@ function Select({
17261
17236
  }
17262
17237
  return renderValue !== void 0 && renderValue !== null ? renderValue?.(value) : value.label;
17263
17238
  };
17264
- const showClearButton = isClearable && ((isMulti || multiple) && asArray(value).length > 0 || (!isMulti || !multiple) && value !== null);
17239
+ const showClearButton = isClearable && (isMulti && asArray(value).length > 0 || !isMulti && value !== null);
17265
17240
  const hasError = fieldHasError(errorMessages);
17266
- const renderOptionItem = (option, index) => {
17267
- const selected = isSelected(option);
17268
- return /* @__PURE__ */ (0, import_jsx_runtime435.jsx)(
17269
- "div",
17270
- {
17271
- ref: (el) => {
17272
- optionRefs.current[index] = el;
17273
- },
17274
- onMouseEnter: () => setHighlightedIndex(index),
17275
- onClick: () => handleSelect(option),
17276
- children: /* @__PURE__ */ (0, import_jsx_runtime435.jsx)(Chip, { className: "text-left", block: true, selected, children: /* @__PURE__ */ (0, import_jsx_runtime435.jsx)("div", { className: "flex-1", children: renderOption !== void 0 && renderOption !== null ? renderOption?.(option, { selected }) : /* @__PURE__ */ (0, import_jsx_runtime435.jsx)("div", { className: cn(selected && "font-medium"), children: option.label }) }) })
17277
- },
17278
- option.value
17279
- );
17280
- };
17281
17241
  return /* @__PURE__ */ (0, import_jsx_runtime435.jsx)(
17282
17242
  FormField,
17283
17243
  {
@@ -17286,7 +17246,6 @@ function Select({
17286
17246
  description,
17287
17247
  hint,
17288
17248
  required,
17289
- tooltip,
17290
17249
  children: /* @__PURE__ */ (0, import_jsx_runtime435.jsxs)(
17291
17250
  "div",
17292
17251
  {
@@ -17299,8 +17258,8 @@ function Select({
17299
17258
  "div",
17300
17259
  {
17301
17260
  "aria-selected": isOpen,
17302
- onClick: () => (!isDisabled || !disabled) && setIsOpen(!isOpen),
17303
- tabIndex: isDisabled || disabled ? -1 : 0,
17261
+ onClick: () => !isDisabled && setIsOpen(!isOpen),
17262
+ tabIndex: isDisabled ? -1 : 0,
17304
17263
  className: triggerClassName,
17305
17264
  children: trigger
17306
17265
  }
@@ -17310,36 +17269,33 @@ function Select({
17310
17269
  {
17311
17270
  "aria-selected": isOpen,
17312
17271
  className: cn(
17313
- "focus:ring-primary-300 flex min-h-10 cursor-pointer rounded-lg border bg-white text-gray-900 transition-all focus-within:outline-none focus:ring",
17314
- (isDisabled || disabled) && "cursor-not-allowed bg-gray-100",
17272
+ "focus:ring-primary-300 flex min-h-10 cursor-pointer items-center justify-between rounded-lg border bg-white px-3 py-2 text-gray-900 transition-all focus-within:outline-none focus:ring",
17273
+ isDisabled && "cursor-not-allowed bg-gray-100",
17315
17274
  isOpen ? "border-primary-300 ring-0" : "border-gray-200",
17316
17275
  hasError && "border-danger-500"
17317
17276
  ),
17318
- onClick: () => (!isDisabled || !disabled) && setIsOpen(!isOpen),
17319
- tabIndex: isDisabled && disabled ? -1 : 0,
17277
+ onClick: () => !isDisabled && setIsOpen(!isOpen),
17278
+ tabIndex: isDisabled ? -1 : 0,
17320
17279
  children: [
17321
- icon && /* @__PURE__ */ (0, import_jsx_runtime435.jsx)("div", { className: "flex items-center border-r border-gray-200 px-3 py-2", children: /* @__PURE__ */ (0, import_jsx_runtime435.jsx)(Icon_default, { name: icon, size: 22, className: "text-gray-600" }) }),
17322
- /* @__PURE__ */ (0, import_jsx_runtime435.jsxs)("div", { className: "flex w-full flex-1 items-center justify-between px-3 py-2", children: [
17323
- /* @__PURE__ */ (0, import_jsx_runtime435.jsx)("div", { className: "min-w-0 flex-1 text-xs font-medium text-gray-900", children: getDisplayValue() }),
17324
- /* @__PURE__ */ (0, import_jsx_runtime435.jsxs)("div", { className: "ml-2 flex shrink-0 items-start gap-1 self-start pt-0.5", children: [
17325
- showClearButton && /* @__PURE__ */ (0, import_jsx_runtime435.jsx)(
17326
- "button",
17327
- {
17328
- type: "button",
17329
- onClick: handleClear,
17330
- className: "cursor-pointer rounded text-center text-gray-700",
17331
- children: /* @__PURE__ */ (0, import_jsx_runtime435.jsx)(Icon_default, { name: "times-circle", size: 20 })
17332
- }
17333
- ),
17334
- /* @__PURE__ */ (0, import_jsx_runtime435.jsx)(
17335
- Icon_default,
17336
- {
17337
- className: "text-gray-700",
17338
- name: isOpen ? "angle-up-small" : "angle-down-small",
17339
- size: 20
17340
- }
17341
- )
17342
- ] })
17280
+ /* @__PURE__ */ (0, import_jsx_runtime435.jsx)("div", { className: "flex-1 overflow-hidden text-xs font-medium text-gray-900", children: getDisplayValue() }),
17281
+ /* @__PURE__ */ (0, import_jsx_runtime435.jsxs)("div", { className: "ml-2 flex items-center gap-1", children: [
17282
+ showClearButton && /* @__PURE__ */ (0, import_jsx_runtime435.jsx)(
17283
+ "button",
17284
+ {
17285
+ type: "button",
17286
+ onClick: handleClear,
17287
+ className: "cursor-pointer rounded text-center text-gray-700",
17288
+ children: /* @__PURE__ */ (0, import_jsx_runtime435.jsx)(Icon_default, { name: "times-circle", size: 20 })
17289
+ }
17290
+ ),
17291
+ /* @__PURE__ */ (0, import_jsx_runtime435.jsx)(
17292
+ Icon_default,
17293
+ {
17294
+ className: "text-gray-700",
17295
+ name: isOpen ? "angle-up-small" : "angle-down-small",
17296
+ size: 20
17297
+ }
17298
+ )
17343
17299
  ] })
17344
17300
  ]
17345
17301
  }
@@ -17378,14 +17334,27 @@ function Select({
17378
17334
  onScroll: onLoadMore !== void 0 ? handleScroll : void 0,
17379
17335
  children: [
17380
17336
  renderOptions === void 0 && /* @__PURE__ */ (0, import_jsx_runtime435.jsxs)(import_jsx_runtime435.Fragment, { children: [
17381
- filteredOptions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime435.jsx)("div", { className: "px-3 py-8 text-center text-sm text-gray-500", children: "No options found" }) : renderEntries.map(
17382
- (entry, i) => entry.kind === "group" ? /* @__PURE__ */ (0, import_jsx_runtime435.jsxs)("div", { className: "space-y-2", children: [
17383
- /* @__PURE__ */ (0, import_jsx_runtime435.jsx)("div", { className: "px-3 pt-1 pb-0.5 text-xs font-semibold tracking-wide text-gray-400 uppercase", children: entry.label }),
17384
- entry.items.map(
17385
- ({ option, index }) => renderOptionItem(option, index)
17386
- )
17387
- ] }, `grp-${i}`) : renderOptionItem(entry.option, entry.index)
17388
- ),
17337
+ filteredOptions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime435.jsx)("div", { className: "px-3 py-8 text-center text-sm text-gray-500", children: "No options found" }) : filteredOptions.map((option, index) => {
17338
+ const selected = isSelected(option);
17339
+ const highlighted = index === highlightedIndex;
17340
+ return /* @__PURE__ */ (0, import_jsx_runtime435.jsx)(
17341
+ "div",
17342
+ {
17343
+ ref: (el) => {
17344
+ optionRefs.current[index] = el;
17345
+ },
17346
+ onMouseEnter: () => setHighlightedIndex(index),
17347
+ onClick: () => handleSelect(option),
17348
+ className: cn(
17349
+ "flex cursor-pointer items-center justify-between rounded-lg px-3 py-2 text-sm font-medium text-gray-900 transition-colors focus:outline-none",
17350
+ highlighted && "bg-primary-100",
17351
+ selected ? "bg-primary-50 border-primary-300" : "hover:bg-gray-50"
17352
+ ),
17353
+ children: /* @__PURE__ */ (0, import_jsx_runtime435.jsx)("div", { className: "flex-1", children: renderOption !== void 0 && renderOption !== null ? renderOption?.(option, { selected }) : /* @__PURE__ */ (0, import_jsx_runtime435.jsx)("div", { className: cn(selected && "font-medium"), children: option.label }) })
17354
+ },
17355
+ option.value
17356
+ );
17357
+ }),
17389
17358
  onLoadMore !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime435.jsx)(
17390
17359
  "div",
17391
17360
  {