feat: expand live chat and work server tools

src/components/inputs/primitives/input/samples/BaseSample.css

@@ -0,0 +1,22 @@
+.input-base-sample-preview {
+  display: block;
+  width: 100%;
+  height: 100%;
+  min-height: 0;
+  padding: 0;
+}
+
+.input-base-sample-preview__control.ant-input {
+  display: block;
+  width: 100%;
+  min-width: 0;
+  max-width: 100%;
+  height: 100% !important;
+  min-height: 100%;
+  min-height: 44px;
+  max-height: none;
+  margin: 0;
+  border-radius: 14px;
+  padding-inline: 14px;
+  box-shadow: none;
+}

src/components/inputs/primitives/input/samples/BaseSample.tsx

@@ -1,6 +1,7 @@
 import { useState } from 'react';
 import type { SampleMeta } from '../../../../../widgets/core';
 import { InputUI } from '../InputUI';
+import './BaseSample.css';
 
 export const sampleMeta: SampleMeta = {
   id: 'input-base',
@@ -18,12 +19,15 @@ export function Sample() {
   const [value, setValue] = useState('초기값');
 
   return (
-    <InputUI
-      value={value}
-      placeholder="입력 후 Enter 또는 blur"
-      onChange={(event) => {
-        setValue(event.target.value);
-      }}
-    />
+    <div className="input-base-sample-preview">
+      <InputUI
+        className="input-base-sample-preview__control"
+        value={value}
+        placeholder="입력 후 Enter 또는 blur"
+        onChange={(event) => {
+          setValue(event.target.value);
+        }}
+      />
+    </div>
   );
 }

src/components/inputs/primitives/input/samples/Sample.tsx

@@ -38,7 +38,7 @@ export function Sample() {
           }}
         />
         <Text>확정 값: {committedValue}</Text>
-        <Text type="secondary">확정 횟수: {commitCount}</Text>
+        <Text type="secondary">{`확정 횟수: ${commitCount}`}</Text>
       </Flex>
     </Card>
   );

src/components/inputs/select/SelectUI.tsx

@@ -12,6 +12,7 @@ export function SelectUI({
   value,
   defaultValue,
   onChange,
+  formatLabel,
   showSearch = true,
   allowClear = true,
   placeholder = '항목을 선택하세요',
@@ -21,10 +22,10 @@ export function SelectUI({
     () =>
       data.map((item) => ({
         value: item.code,
-        label: item.value,
+        label: formatLabel ? formatLabel(item) : item.value,
         item,
       })),
-    [data],
+    [data, formatLabel],
   );
 
   const itemMap = useMemo(

src/components/inputs/select/types/select.ts

@@ -13,4 +13,5 @@ export type SelectUIProps = Omit<
   value?: string;
   defaultValue?: string;
   onChange?: (code?: string, item?: SelectOptionItem) => void;
+  formatLabel?: (item: SelectOptionItem) => string;
 };