@kud/ink-ui 0.11.0 → 0.13.0

package/dist/index.d.ts

@@ -220,11 +220,24 @@ type ToggleSwitchProps = {
 };
 declare const ToggleSwitch: ({ on, label, onColor, offColor, }: ToggleSwitchProps) => React.JSX.Element;
 
+type UpdateBannerProps = {
+    name: string;
+    current: string;
+    latest: string;
+    command: string;
+    onConfirm: () => void;
+    onDecline: () => void;
+    focused?: boolean;
+};
+declare const UpdateBanner: ({ name, current, latest, command, onConfirm, onDecline, focused, }: UpdateBannerProps) => React.JSX.Element;
+
 type ProgressBarProps = {
     value: number;
     width?: number;
+    color?: string;
+    trackColor?: string;
 };
-declare const ProgressBar: ({ value, width }: ProgressBarProps) => React.JSX.Element;
+declare const ProgressBar: ({ value, width, color, trackColor, }: ProgressBarProps) => React.JSX.Element;
 
 type StatusVariant = "success" | "error" | "warning" | "info";
 
@@ -277,4 +290,4 @@ declare const spacing: {
 };
 type Spacing = (typeof spacing)[keyof typeof spacing];
 
-export { Alert, Badge, type BadgeVariant, Banner, type Color, type Column, Columns, ConfirmInput, EmailInput, FooterHints, Header, type Hint, type IconMode, KeyValue, LoadingScreen, MultiSelect, type NotifyOptions, OrderedList, Panel, PasswordInput, 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, ToggleSwitch, UnorderedList, colors, getIconMode, notify, setIconMode, spacing };
+export { Alert, Badge, type BadgeVariant, Banner, type Color, type Column, Columns, ConfirmInput, EmailInput, FooterHints, Header, type Hint, type IconMode, KeyValue, LoadingScreen, MultiSelect, type NotifyOptions, OrderedList, Panel, PasswordInput, 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, ToggleSwitch, UnorderedList, UpdateBanner, colors, getIconMode, notify, setIconMode, spacing };

package/dist/index.js

@@ -601,12 +601,67 @@ var ToggleSwitch = ({
     label !== void 0 && /* @__PURE__ */ jsx(Text, { color: on ? onColor : void 0, dimColor: !on, children: label })
   ] });
 };
-var ProgressBar = ({ value, width = 20 }) => {
+var UpdateBanner = ({
+  name,
+  current: current2,
+  latest,
+  command,
+  onConfirm,
+  onDecline,
+  focused = true
+}) => {
+  useInput(
+    (input, key) => {
+      if (key.return || /^y$/i.test(input)) onConfirm();
+      else if (key.escape || /^n$/i.test(input)) onDecline();
+    },
+    { isActive: focused }
+  );
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      flexDirection: "column",
+      borderStyle: "round",
+      borderColor: colors.accent,
+      paddingX: 2,
+      paddingY: 1,
+      rowGap: 1,
+      children: [
+        /* @__PURE__ */ jsxs(Box, { columnGap: 1, children: [
+          /* @__PURE__ */ jsx(Text, { bold: true, color: colors.accent, children: "Update available" }),
+          /* @__PURE__ */ jsx(Text, { dimColor: true, children: name })
+        ] }),
+        /* @__PURE__ */ jsxs(Box, { columnGap: 1, children: [
+          /* @__PURE__ */ jsx(Text, { dimColor: true, children: current2 }),
+          /* @__PURE__ */ jsx(Text, { dimColor: true, children: "\u2192" }),
+          /* @__PURE__ */ jsx(Text, { bold: true, color: colors.success, children: latest })
+        ] }),
+        /* @__PURE__ */ jsxs(Box, { columnGap: 1, children: [
+          /* @__PURE__ */ jsx(Text, { backgroundColor: colors.accent, color: "black", bold: true, children: " Y " }),
+          /* @__PURE__ */ jsx(Text, { children: "upgrade now" }),
+          /* @__PURE__ */ jsx(Text, { dimColor: true, children: "\xB7" }),
+          /* @__PURE__ */ jsx(Text, { backgroundColor: "#2b323d", color: "#8fa3ad", children: " N " }),
+          /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
+            "later \u2014 run ",
+            command,
+            " yourself"
+          ] })
+        ] })
+      ]
+    }
+  );
+};
+var ProgressBar = ({
+  value,
+  width = 20,
+  color = colors.accent,
+  trackColor = "#2b323d"
+}) => {
   const clamped = Math.max(0, Math.min(100, value));
   const filled = Math.round(clamped / 100 * width);
   return /* @__PURE__ */ jsxs(Text, { children: [
-    /* @__PURE__ */ jsx(Text, { color: colors.accent, children: "\u2588".repeat(filled) }),
-    /* @__PURE__ */ jsx(Text, { dimColor: true, children: "\u2591".repeat(width - filled) })
+    /* @__PURE__ */ jsx(Text, { color, children: "\u2588".repeat(filled) }),
+    /* @__PURE__ */ jsx(Text, { color: trackColor, children: "\u2588".repeat(width - filled) })
   ] });
 };
 
@@ -710,4 +765,4 @@ var notify = (message, options = {}) => {
   child.unref();
 };
 
-export { Alert, Badge, Banner, Columns, ConfirmInput, EmailInput, FooterHints, Header, KeyValue, LoadingScreen, MultiSelect, OrderedList, Panel, PasswordInput, ProgressBar, ScrollView, Select, SelectableRow, Spinner, StatusMessage, Switch, Table, Tabs, TextInput, Toast, Toggle, ToggleSwitch, UnorderedList, colors, getIconMode, notify, setIconMode, spacing };
+export { Alert, Badge, Banner, Columns, ConfirmInput, EmailInput, FooterHints, Header, KeyValue, LoadingScreen, MultiSelect, OrderedList, Panel, PasswordInput, ProgressBar, ScrollView, Select, SelectableRow, Spinner, StatusMessage, Switch, Table, Tabs, TextInput, Toast, Toggle, ToggleSwitch, UnorderedList, UpdateBanner, colors, getIconMode, notify, setIconMode, spacing };

package/package.json

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