@x-plat/design-system 0.7.2 → 0.8.1

package/dist/components/AutoResizeTextArea/index.css

@@ -21,6 +21,8 @@
 .lib-xplat-auto-resize-textarea-wrapper .lib-xplat-auto-resize-textarea:focus-within {
   border-color: var(--semantic-interaction-focus-ring);
   box-shadow: 0 0 0 2px var(--semantic-interaction-overlay-10);
+  outline: 2px solid transparent;
+  outline-offset: 2px;
 }
 .lib-xplat-auto-resize-textarea-wrapper .lib-xplat-auto-resize-textarea:has(> textarea:not(:placeholder-shown)):not(:focus-within) {
   border-color: var(--semantic-border-tertiary);

package/dist/components/Button/index.css

@@ -39,7 +39,8 @@
   font-weight: var(--semantic-typo-label-1-m-weight);
   letter-spacing: var(--semantic-typo-label-1-m-ls);
 }
-.lib-xplat-button:disabled {
+.lib-xplat-button:disabled,
+.lib-xplat-button.disabled {
   cursor: not-allowed;
   background-color: var(--semantic-surface-neutral-disabled) !important;
   border-color: var(--semantic-surface-neutral-disabled) !important;

package/dist/components/Button/index.d.cts

@@ -9,6 +9,12 @@ interface ButtonProps extends Omit<ButtonAttributes, "className"> {
     type?: ButtonType;
     size?: ButtonSize;
 }
+/**
+ * 버튼은 `<button>` 으로만 렌더된다. 누르면 **무언가 일어나는** 자리에 쓴다.
+ *
+ * 이동하는 자리는 버튼이 아니라 링크다. 버튼처럼 보여야 하면 `LinkButton`,
+ * 본문 속 텍스트 링크는 `Link` 를 쓴다.
+ */
 declare const Button: {
     (props: ButtonProps): react_jsx_runtime.JSX.Element;
     displayName: string;

package/dist/components/Button/index.d.ts

@@ -9,6 +9,12 @@ interface ButtonProps extends Omit<ButtonAttributes, "className"> {
     type?: ButtonType;
     size?: ButtonSize;
 }
+/**
+ * 버튼은 `<button>` 으로만 렌더된다. 누르면 **무언가 일어나는** 자리에 쓴다.
+ *
+ * 이동하는 자리는 버튼이 아니라 링크다. 버튼처럼 보여야 하면 `LinkButton`,
+ * 본문 속 텍스트 링크는 `Link` 를 쓴다.
+ */
 declare const Button: {
     (props: ButtonProps): react_jsx_runtime.JSX.Element;
     displayName: string;

package/dist/components/Chart/index.cjs

@@ -172,9 +172,16 @@ var useChartTooltip = (enabled) => {
   }, []);
   return { tooltip, show, hide, move, containerRef };
 };
+var formatTick = (value, maxVal) => {
+  const step = maxVal / 4;
+  if (!Number.isFinite(step) || step <= 0) return "0";
+  const decimals = step >= 1 ? 0 : Math.min(4, Math.ceil(-Math.log10(step)));
+  const fixed = value.toFixed(decimals);
+  return decimals === 0 ? Number(fixed).toLocaleString("en-US") : fixed;
+};
 var GridLines = import_react.default.memo(({ width, height, chartH, maxVal }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: [0, 0.25, 0.5, 0.75, 1].map((ratio) => {
   const y = PADDING.top + (1 - ratio) * chartH;
-  const val = Math.round(maxVal * ratio);
+  const val = formatTick(maxVal * ratio, maxVal);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("line", { x1: PADDING.left, y1: y, x2: width - PADDING.right, y2: y, className: "chart-grid" }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("text", { x: PADDING.left - 8, y: y + 4, className: "chart-axis-label", textAnchor: "end", children: val })

package/dist/components/Chart/index.js

@@ -136,9 +136,16 @@ var useChartTooltip = (enabled) => {
   }, []);
   return { tooltip, show, hide, move, containerRef };
 };
+var formatTick = (value, maxVal) => {
+  const step = maxVal / 4;
+  if (!Number.isFinite(step) || step <= 0) return "0";
+  const decimals = step >= 1 ? 0 : Math.min(4, Math.ceil(-Math.log10(step)));
+  const fixed = value.toFixed(decimals);
+  return decimals === 0 ? Number(fixed).toLocaleString("en-US") : fixed;
+};
 var GridLines = React.memo(({ width, height, chartH, maxVal }) => /* @__PURE__ */ jsx(Fragment, { children: [0, 0.25, 0.5, 0.75, 1].map((ratio) => {
   const y = PADDING.top + (1 - ratio) * chartH;
-  const val = Math.round(maxVal * ratio);
+  const val = formatTick(maxVal * ratio, maxVal);
   return /* @__PURE__ */ jsxs("g", { children: [
     /* @__PURE__ */ jsx("line", { x1: PADDING.left, y1: y, x2: width - PADDING.right, y2: y, className: "chart-grid" }),
     /* @__PURE__ */ jsx("text", { x: PADDING.left - 8, y: y + 4, className: "chart-axis-label", textAnchor: "end", children: val })

package/dist/components/ChatInput/index.css

@@ -99,6 +99,8 @@
 .lib-xplat-auto-resize-textarea-wrapper .lib-xplat-auto-resize-textarea:focus-within {
   border-color: var(--semantic-interaction-focus-ring);
   box-shadow: 0 0 0 2px var(--semantic-interaction-overlay-10);
+  outline: 2px solid transparent;
+  outline-offset: 2px;
 }
 .lib-xplat-auto-resize-textarea-wrapper .lib-xplat-auto-resize-textarea:has(> textarea:not(:placeholder-shown)):not(:focus-within) {
   border-color: var(--semantic-border-tertiary);
@@ -144,6 +146,8 @@
 .lib-xplat-chat-input:focus-within {
   border-color: var(--semantic-interaction-focus-ring);
   box-shadow: 0 0 0 2px var(--semantic-interaction-overlay-10);
+  outline: 2px solid transparent;
+  outline-offset: 2px;
 }
 .lib-xplat-chat-input.disabled {
   background-color: var(--semantic-surface-neutral-secondary);