@kud/ink-ui 0.4.0 → 0.6.0

package/dist/index.d.ts

@@ -119,8 +119,9 @@ type StyledLine = {
 type ScrollViewProps = {
     lines: StyledLine[];
     showIndicator?: boolean;
+    initialStart?: number;
 };
-declare const ScrollView: ({ lines, showIndicator, }: ScrollViewProps) => React.JSX.Element;
+declare const ScrollView: ({ lines, showIndicator, initialStart, }: ScrollViewProps) => React.JSX.Element;
 
 type TabItem<T extends string = string> = {
     value: T;
@@ -133,6 +134,22 @@ type TabsProps<T extends string> = {
 };
 declare const Tabs: <T extends string>({ active, items }: TabsProps<T>) => React.JSX.Element;
 
+type SwitchValue = "left" | "right";
+type SwitchProps = {
+    left: string;
+    right: string;
+    value: SwitchValue;
+    color?: string;
+};
+declare const Switch: ({ left, right, value, color, }: SwitchProps) => React.JSX.Element;
+
+type ToggleProps = {
+    label: string;
+    on: boolean;
+    color?: string;
+};
+declare const Toggle: ({ label, on, color }: ToggleProps) => React.JSX.Element;
+
 type ProgressBarProps = {
     value: number;
     width?: number;
@@ -190,4 +207,4 @@ declare const spacing: {
 };
 type Spacing = (typeof spacing)[keyof typeof spacing];
 
-export { Alert, Badge, type BadgeVariant, Banner, type Color, type Column, ConfirmInput, FooterHints, Header, type Hint, type IconMode, KeyValue, LoadingScreen, MultiSelect, type NotifyOptions, ProgressBar, ScrollView, Select, type SelectOption, SelectableRow, type Spacing, type Span, Spinner, StatusMessage, type StatusVariant, type StyledLine, type TabItem, Table, Tabs, TextInput, Toast, colors, getIconMode, notify, setIconMode, spacing };
+export { Alert, Badge, type BadgeVariant, Banner, type Color, type Column, ConfirmInput, FooterHints, Header, type Hint, type IconMode, KeyValue, LoadingScreen, MultiSelect, type NotifyOptions, ProgressBar, ScrollView, Select, type SelectOption, SelectableRow, type Spacing, type Span, Spinner, StatusMessage, type StatusVariant, type StyledLine, Switch, type SwitchValue, type TabItem, Table, Tabs, TextInput, Toast, Toggle, colors, getIconMode, notify, setIconMode, spacing };

package/dist/index.js

@@ -251,11 +251,13 @@ var ConfirmInput = ({
 };
 var ScrollView = ({
   lines,
-  showIndicator = true
+  showIndicator = true,
+  initialStart = 0
 }) => {
   const ref = useRef(null);
   const [height, setHeight] = useState(1);
-  const [start, setStart] = useState(0);
+  const [start, setStart] = useState(initialStart);
+  useEffect(() => setStart(initialStart), [initialStart]);
   useLayoutEffect(() => {
     if (!ref.current) return;
     const { height: h } = measureElement(ref.current);
@@ -326,6 +328,44 @@ var Tabs = ({ active, items }) => {
     /* @__PURE__ */ jsx(Box, { gap: 2, children: cells.map((cell) => /* @__PURE__ */ jsx(Text, { color: colors.accent, children: cell.isActive ? "\u2500".repeat(cell.text.length) : " ".repeat(cell.text.length) }, cell.key)) })
   ] });
 };
+var Switch = ({
+  left,
+  right,
+  value,
+  color = colors.accent
+}) => {
+  const leftActive = value === "left";
+  return /* @__PURE__ */ jsxs(Text, { children: [
+    /* @__PURE__ */ jsx(
+      Text,
+      {
+        color: leftActive ? color : void 0,
+        bold: leftActive,
+        dimColor: !leftActive,
+        children: left
+      }
+    ),
+    /* @__PURE__ */ jsx(Text, { children: " " }),
+    /* @__PURE__ */ jsx(Text, { color: leftActive ? color : colors.muted, children: leftActive ? "\u25CF" : "\u25CB" }),
+    /* @__PURE__ */ jsx(Text, { color: colors.muted, children: "\u2500" }),
+    /* @__PURE__ */ jsx(Text, { color: !leftActive ? color : colors.muted, children: !leftActive ? "\u25CF" : "\u25CB" }),
+    /* @__PURE__ */ jsx(Text, { children: " " }),
+    /* @__PURE__ */ jsx(
+      Text,
+      {
+        color: !leftActive ? color : void 0,
+        bold: !leftActive,
+        dimColor: leftActive,
+        children: right
+      }
+    )
+  ] });
+};
+var Toggle = ({ label, on, color = colors.accent }) => /* @__PURE__ */ jsxs(Text, { color: on ? color : void 0, dimColor: !on, children: [
+  label,
+  " ",
+  on ? "\u25CF" : "\u25CB"
+] });
 var ProgressBar = ({ value, width = 20 }) => {
   const clamped = Math.max(0, Math.min(100, value));
   const filled = Math.round(clamped / 100 * width);
@@ -435,4 +475,4 @@ var notify = (message, options = {}) => {
   child.unref();
 };
 
-export { Alert, Badge, Banner, ConfirmInput, FooterHints, Header, KeyValue, LoadingScreen, MultiSelect, ProgressBar, ScrollView, Select, SelectableRow, Spinner, StatusMessage, Table, Tabs, TextInput, Toast, colors, getIconMode, notify, setIconMode, spacing };
+export { Alert, Badge, Banner, ConfirmInput, FooterHints, Header, KeyValue, LoadingScreen, MultiSelect, ProgressBar, ScrollView, Select, SelectableRow, Spinner, StatusMessage, Switch, Table, Tabs, TextInput, Toast, Toggle, colors, getIconMode, notify, setIconMode, spacing };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kud/ink-ui",
-  "version": "0.4.0",
+  "version": "0.6.0",
   "description": "React component library for Ink CLIs",
   "type": "module",
   "main": "dist/index.js",