@designbasekorea/ui 0.3.3 → 0.3.5

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.
Files changed (14) hide show
  1. package/dist/index.css +1 -1
  2. package/dist/index.css.map +1 -1
  3. package/dist/index.d.ts +8 -4
  4. package/dist/index.esm.css +1 -1
  5. package/dist/index.esm.css.map +1 -1
  6. package/dist/index.esm.js +11 -8
  7. package/dist/index.esm.js.map +1 -1
  8. package/dist/index.js +11 -8
  9. package/dist/index.js.map +1 -1
  10. package/dist/index.umd.css +1 -1
  11. package/dist/index.umd.css.map +1 -1
  12. package/dist/index.umd.js +11 -8
  13. package/dist/index.umd.js.map +1 -1
  14. package/package.json +1 -1
package/dist/index.esm.js CHANGED
@@ -11398,20 +11398,23 @@ const Timeline = ({ items, type = 'alternate', variant = 'default', size = 'm',
11398
11398
  'designbase-timeline__item--disabled': item.disabled,
11399
11399
  });
11400
11400
  const contentClasses = clsx('designbase-timeline__content', `designbase-timeline__content--${itemPosition}`);
11401
- const dotClasses = clsx('designbase-timeline__dot', `designbase-timeline__dot--${itemColor}`, `designbase-timeline__dot--${variant}`, {
11401
+ const itemStatus = item.status || 'pending';
11402
+ const dotClasses = clsx('designbase-timeline__dot', `designbase-timeline__dot--${itemColor}`, `designbase-timeline__dot--${variant}`, `designbase-timeline__dot--${itemStatus}`, {
11402
11403
  'designbase-timeline__dot--clickable': isClickable,
11404
+ 'designbase-timeline__dot--with-icon': item.icon,
11405
+ 'designbase-timeline__dot--with-number': item.number && !item.icon,
11403
11406
  });
11404
- return (jsxs("div", { className: itemClasses, children: [jsxs("div", { className: "designbase-timeline__indicator-container", children: [jsx("div", { className: dotClasses, onClick: () => handleItemClick(item, index), tabIndex: isClickable ? 0 : -1, role: isClickable ? 'button' : undefined, "aria-label": `${item.title} 타임라인 점`, onKeyDown: (e) => {
11407
+ return (jsxs("div", { className: itemClasses, children: [jsxs("div", { className: "designbase-timeline__indicator-container", children: [itemStatus === 'active' && !item.icon && item.number === undefined && (jsx("div", { className: "designbase-timeline__pulse" })), jsx("div", { className: dotClasses, onClick: () => handleItemClick(item, index), tabIndex: isClickable ? 0 : -1, role: isClickable ? 'button' : undefined, "aria-label": item.title ? `${item.title} 타임라인 점` : `타임라인 점 ${index + 1}`, onKeyDown: (e) => {
11405
11408
  if (e.key === 'Enter' || e.key === ' ') {
11406
11409
  e.preventDefault();
11407
11410
  handleItemClick(item, index);
11408
11411
  }
11409
- }, children: item.icon ? (jsx("div", { className: "designbase-timeline__icon", children: item.icon })) : (jsx("span", { className: "designbase-timeline__number", children: index + 1 })) }), !isLast && (jsx("div", { className: "designbase-timeline__connector" }))] }), jsx("div", { className: contentClasses, children: jsxs("div", { className: "designbase-timeline__content-inner", onClick: () => handleItemClick(item, index), tabIndex: isClickable ? 0 : -1, role: isClickable ? 'button' : undefined, "aria-label": `${item.title} 타임라인 아이템`, onKeyDown: (e) => {
11410
- if (e.key === 'Enter' || e.key === ' ') {
11411
- e.preventDefault();
11412
- handleItemClick(item, index);
11413
- }
11414
- }, children: [item.timestamp && (jsx("div", { className: "designbase-timeline__timestamp", children: item.timestamp })), jsx("h3", { className: "designbase-timeline__title", children: item.title }), item.description && (jsx("p", { className: "designbase-timeline__description", children: item.description }))] }) })] }, item.id));
11412
+ }, children: item.icon ? (jsx("div", { className: "designbase-timeline__icon", children: item.icon })) : item.number !== undefined ? (jsx("span", { className: "designbase-timeline__number", children: item.number })) : null }), !isLast && (jsx("div", { className: "designbase-timeline__connector" }))] }), jsxs("div", { className: contentClasses, children: [item.timestamp && (jsx("div", { className: "designbase-timeline__timestamp", children: item.timestamp })), jsx("div", { className: "designbase-timeline__content-inner", onClick: () => handleItemClick(item, index), tabIndex: isClickable ? 0 : -1, role: isClickable ? 'button' : undefined, "aria-label": item.title ? `${item.title} 타임라인 아이템` : `타임라인 아이템 ${index + 1}`, onKeyDown: (e) => {
11413
+ if (e.key === 'Enter' || e.key === ' ') {
11414
+ e.preventDefault();
11415
+ handleItemClick(item, index);
11416
+ }
11417
+ }, children: item.content ? (item.content) : (jsxs(Fragment, { children: [item.title && (jsx("h3", { className: "designbase-timeline__title", children: item.title })), item.description && (jsx("p", { className: "designbase-timeline__description", children: item.description }))] })) })] })] }, item.id));
11415
11418
  }) }) }));
11416
11419
  };
11417
11420