@deepnoid/ui 0.1.201 → 0.1.203

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
@@ -8197,37 +8197,13 @@ function TableHeaderCell({
8197
8197
  }) {
8198
8198
  const thRef = (0, import_react15.useRef)(null);
8199
8199
  const [showTitle, setShowTitle] = (0, import_react15.useState)(false);
8200
- const checkOverflow = (el) => {
8201
- if (el.scrollWidth > el.clientWidth) {
8202
- return true;
8203
- }
8204
- const children = Array.from(el.children);
8205
- for (const child of children) {
8206
- if (child.scrollWidth > child.clientWidth) {
8207
- return true;
8208
- }
8209
- }
8210
- return false;
8211
- };
8212
- const extractTextFromContent = (node) => {
8213
- if (typeof node === "string" || typeof node === "number") {
8214
- return String(node);
8215
- }
8216
- if ((0, import_react15.isValidElement)(node)) {
8217
- return String(node.props.children || "");
8218
- }
8219
- return "";
8220
- };
8221
- (0, import_react15.useEffect)(() => {
8222
- if (thRef.current && !isCheckbox) {
8223
- setTimeout(() => {
8224
- if (thRef.current) {
8225
- setShowTitle(checkOverflow(thRef.current));
8226
- }
8227
- }, 0);
8200
+ (0, import_react15.useLayoutEffect)(() => {
8201
+ if (!isCheckbox && thRef.current) {
8202
+ const el = thRef.current;
8203
+ setShowTitle(el.scrollWidth > el.clientWidth);
8228
8204
  }
8229
8205
  }, [content, isCheckbox]);
8230
- const titleText = !isCheckbox && showTitle ? extractTextFromContent(content) : void 0;
8206
+ const titleText = !isCheckbox && showTitle ? typeof content === "string" || typeof content === "number" ? String(content) : "" : void 0;
8231
8207
  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
8232
8208
  "th",
8233
8209
  {
@@ -8240,7 +8216,10 @@ function TableHeaderCell({
8240
8216
  flexShrink: 0,
8241
8217
  flexGrow: 0,
8242
8218
  boxSizing: "border-box"
8243
- } : column ? { ...getCellStyle(column), textAlign: "center" } : void 0,
8219
+ } : column ? {
8220
+ ...getCellStyle(column),
8221
+ textAlign: "center"
8222
+ } : void 0,
8244
8223
  title: titleText,
8245
8224
  children: content
8246
8225
  }
@@ -8249,7 +8228,6 @@ function TableHeaderCell({
8249
8228
  var TableHead = ({
8250
8229
  slots,
8251
8230
  columns,
8252
- color,
8253
8231
  size,
8254
8232
  rowCheckbox = false,
8255
8233
  hasCheckedRows,
@@ -8301,53 +8279,31 @@ function TableCell({
8301
8279
  }) {
8302
8280
  var _a, _b;
8303
8281
  const value = row[column.field];
8304
- const formattedValue = ((_a = column.valueFormatter) == null ? void 0 : _a.call(column, { value, field: column.field })) || value;
8282
+ const formattedValue = (_b = (_a = column.valueFormatter) == null ? void 0 : _a.call(column, { value, field: column.field })) != null ? _b : value;
8305
8283
  const content = column.renderCell ? column.renderCell({ id: row.id, field: column.field, value, formattedValue, row }) : formattedValue;
8284
+ const isTextContent = ["string", "number"].includes(typeof content) || content === null || content === void 0;
8306
8285
  const tdRef = (0, import_react16.useRef)(null);
8307
8286
  const [showTitle, setShowTitle] = (0, import_react16.useState)(false);
8308
- const isTextContent = ["string", "number"].includes(typeof content) || content === null || content === void 0;
8309
- const checkOverflow = (el) => {
8310
- if (el.scrollWidth > el.clientWidth) {
8311
- return true;
8312
- }
8313
- const children = Array.from(el.children);
8314
- for (const child of children) {
8315
- if (child.scrollWidth > child.clientWidth) {
8316
- return true;
8317
- }
8318
- }
8319
- return false;
8320
- };
8321
- (0, import_react16.useEffect)(() => {
8287
+ (0, import_react16.useLayoutEffect)(() => {
8322
8288
  if (tdRef.current && isTextContent) {
8323
- setTimeout(() => {
8324
- if (tdRef.current) {
8325
- setShowTitle(checkOverflow(tdRef.current));
8326
- }
8327
- }, 0);
8289
+ const el = tdRef.current;
8290
+ setShowTitle(el.scrollWidth > el.clientWidth);
8328
8291
  }
8329
8292
  }, [content, isTextContent]);
8330
8293
  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
8331
8294
  "td",
8332
8295
  {
8333
8296
  ref: tdRef,
8334
- className: clsx(
8335
- slots.td(),
8336
- classNames == null ? void 0 : classNames.td,
8337
- column.className,
8338
- isTextContent && "truncate",
8339
- isTextContent && "[&>*]:inline-block [&>*]:max-w-full [&>*]:truncate [&>*]:align-middle"
8340
- ),
8297
+ className: clsx(slots.td(), classNames == null ? void 0 : classNames.td, column.className, isTextContent && "truncate"),
8341
8298
  style: {
8342
8299
  ...getCellStyle(column),
8343
8300
  maxWidth: column.width || "150px",
8344
8301
  textAlign: column.align || "center",
8345
- ...!isTextContent && {
8346
- overflow: "visible",
8347
- whiteSpace: "normal"
8348
- }
8302
+ whiteSpace: isTextContent ? "nowrap" : "normal",
8303
+ overflow: isTextContent ? "hidden" : "visible",
8304
+ textOverflow: isTextContent ? "ellipsis" : void 0
8349
8305
  },
8350
- title: showTitle ? String(((_b = value == null ? void 0 : value.props) == null ? void 0 : _b.children) || content || "") : void 0,
8306
+ title: showTitle && isTextContent ? String(content != null ? content : "") : void 0,
8351
8307
  children: content
8352
8308
  },
8353
8309
  `${row.id}-${column.field}-${colIdx}-${rowIndex}`
@@ -9375,6 +9331,7 @@ var Select = (0, import_react21.forwardRef)((originalProps, ref) => {
9375
9331
  dropdownIconName = "brace-up",
9376
9332
  optionIconName,
9377
9333
  optionIconPlacement,
9334
+ clearable,
9378
9335
  ...inputProps
9379
9336
  } = props;
9380
9337
  const slots = (0, import_react21.useMemo)(() => select({ ...variantProps }), [variantProps]);
@@ -9428,6 +9385,11 @@ var Select = (0, import_react21.forwardRef)((originalProps, ref) => {
9428
9385
  setSelectedOptions(nextOptions);
9429
9386
  onChange == null ? void 0 : onChange(nextOptions);
9430
9387
  };
9388
+ const handleClear = (e) => {
9389
+ e.stopPropagation();
9390
+ setSelectedOptions([]);
9391
+ onChange == null ? void 0 : onChange([]);
9392
+ };
9431
9393
  (0, import_react21.useEffect)(() => {
9432
9394
  const handleClickOutside = (e) => {
9433
9395
  var _a2;
@@ -9554,6 +9516,17 @@ var Select = (0, import_react21.forwardRef)((originalProps, ref) => {
9554
9516
  }
9555
9517
  ),
9556
9518
  /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("input", { type: "hidden", name: inputProps.name, value: selectedValue }),
9519
+ clearable && selectedOptions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
9520
+ icon_button_default,
9521
+ {
9522
+ name: "close",
9523
+ variant: "ghost",
9524
+ size: "sm",
9525
+ color: "neutral",
9526
+ onClick: handleClear,
9527
+ classNames: { base: "pr-[2px]" }
9528
+ }
9529
+ ),
9557
9530
  /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
9558
9531
  Icon_default,
9559
9532
  {
package/dist/index.mjs CHANGED
@@ -36,7 +36,7 @@ import {
36
36
  } from "./chunk-DS5CGU2X.mjs";
37
37
  import {
38
38
  table_default
39
- } from "./chunk-KYWCJIXI.mjs";
39
+ } from "./chunk-W3V4SZV5.mjs";
40
40
  import "./chunk-MZ76AA76.mjs";
41
41
  import {
42
42
  skeleton_default
@@ -64,11 +64,11 @@ import {
64
64
  } from "./chunk-XZYQFBCT.mjs";
65
65
  import {
66
66
  timePicker_default
67
- } from "./chunk-YBXBTE5T.mjs";
67
+ } from "./chunk-COGGK5Q6.mjs";
68
68
  import "./chunk-QCEKPS7U.mjs";
69
69
  import {
70
70
  select_default
71
- } from "./chunk-75ZDPLJ4.mjs";
71
+ } from "./chunk-K2RW5KLO.mjs";
72
72
  import "./chunk-7MVEAQ7Z.mjs";
73
73
  import {
74
74
  list_default
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@deepnoid/ui",
3
- "version": "0.1.201",
3
+ "version": "0.1.203",
4
4
  "license": "MIT",
5
5
  "sideEffects": false,
6
6
  "exports": {