framepexls-ui-lib 0.3.16 → 0.3.17

package/dist/SegmentedTabs.d.mts

@@ -0,0 +1,20 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React__default from 'react';
+import Button from './Button.mjs';
+
+type ButtonColor = NonNullable<React__default.ComponentProps<typeof Button>["color"]>;
+type SegmentedTabOption = {
+    value: string;
+    label: React__default.ReactNode;
+};
+type SegmentedTabsProps = {
+    value: string;
+    options: SegmentedTabOption[];
+    onChange: (value: string) => void;
+    color?: ButtonColor;
+    size?: "sm" | "md";
+    className?: string;
+};
+declare function SegmentedTabs({ value, options, onChange, color, size, className, }: SegmentedTabsProps): react_jsx_runtime.JSX.Element;
+
+export { type SegmentedTabOption, type SegmentedTabsProps, SegmentedTabs as default };

package/dist/SegmentedTabs.d.ts

@@ -0,0 +1,20 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React__default from 'react';
+import Button from './Button.js';
+
+type ButtonColor = NonNullable<React__default.ComponentProps<typeof Button>["color"]>;
+type SegmentedTabOption = {
+    value: string;
+    label: React__default.ReactNode;
+};
+type SegmentedTabsProps = {
+    value: string;
+    options: SegmentedTabOption[];
+    onChange: (value: string) => void;
+    color?: ButtonColor;
+    size?: "sm" | "md";
+    className?: string;
+};
+declare function SegmentedTabs({ value, options, onChange, color, size, className, }: SegmentedTabsProps): react_jsx_runtime.JSX.Element;
+
+export { type SegmentedTabOption, type SegmentedTabsProps, SegmentedTabs as default };

package/dist/SegmentedTabs.js

@@ -0,0 +1,73 @@
+"use strict";
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var SegmentedTabs_exports = {};
+__export(SegmentedTabs_exports, {
+  default: () => SegmentedTabs
+});
+module.exports = __toCommonJS(SegmentedTabs_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_Button = __toESM(require("./Button"));
+function SegmentedTabs({
+  value,
+  options,
+  onChange,
+  color = "rose",
+  size = "md",
+  className
+}) {
+  const btnSize = size === "sm" ? "xs" : "sm";
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      className: [
+        "inline-flex rounded-2xl border border-slate-200 bg-slate-50 p-1.5 text-sm",
+        "dark:border-white/10 dark:bg-white/5",
+        className != null ? className : ""
+      ].join(" "),
+      children: options.map((opt) => {
+        const active = value === opt.value;
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_Button.default,
+          {
+            size: btnSize,
+            variant: active ? "primary" : "ghost",
+            color,
+            className: "px-4 rounded-xl",
+            onClick: () => {
+              if (opt.value !== value) onChange(opt.value);
+            },
+            children: opt.label
+          },
+          opt.value
+        );
+      })
+    }
+  );
+}

package/dist/SegmentedTabs.mjs

@@ -0,0 +1,43 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import Button from "./Button";
+function SegmentedTabs({
+  value,
+  options,
+  onChange,
+  color = "rose",
+  size = "md",
+  className
+}) {
+  const btnSize = size === "sm" ? "xs" : "sm";
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: [
+        "inline-flex rounded-2xl border border-slate-200 bg-slate-50 p-1.5 text-sm",
+        "dark:border-white/10 dark:bg-white/5",
+        className != null ? className : ""
+      ].join(" "),
+      children: options.map((opt) => {
+        const active = value === opt.value;
+        return /* @__PURE__ */ jsx(
+          Button,
+          {
+            size: btnSize,
+            variant: active ? "primary" : "ghost",
+            color,
+            className: "px-4 rounded-xl",
+            onClick: () => {
+              if (opt.value !== value) onChange(opt.value);
+            },
+            children: opt.label
+          },
+          opt.value
+        );
+      })
+    }
+  );
+}
+export {
+  SegmentedTabs as default
+};

package/dist/index.d.mts

@@ -46,6 +46,7 @@ export { default as Link } from './Link.mjs';
 export { ToastProvider, useToast } from './Toast.mjs';
 export { default as StorageUsage, StorageUsageProps } from './StorageUsage.mjs';
 export { default as FileButton, FileButtonProps } from './FileButton.mjs';
+export { SegmentedTabOption, default as SegmentedTabs, SegmentedTabsProps } from './SegmentedTabs.mjs';
 export { a as Animations } from './animations-CHrNeawW.mjs';
 export { default as MotionProvider } from './MotionProvider.mjs';
 export { default as CalendarPanel, CalendarPanelProps } from './CalendarPanel.mjs';

package/dist/index.d.ts

@@ -46,6 +46,7 @@ export { default as Link } from './Link.js';
 export { ToastProvider, useToast } from './Toast.js';
 export { default as StorageUsage, StorageUsageProps } from './StorageUsage.js';
 export { default as FileButton, FileButtonProps } from './FileButton.js';
+export { SegmentedTabOption, default as SegmentedTabs, SegmentedTabsProps } from './SegmentedTabs.js';
 export { a as Animations } from './animations-CHrNeawW.js';
 export { default as MotionProvider } from './MotionProvider.js';
 export { default as CalendarPanel, CalendarPanelProps } from './CalendarPanel.js';

package/dist/index.js

@@ -74,6 +74,7 @@ __export(index_exports, {
   ReviewHistory: () => import_ReviewHistory.default,
   ReviewHistoryDialog: () => import_ReviewHistory2.ReviewHistoryDialog,
   SearchInput: () => import_SearchInput.default,
+  SegmentedTabs: () => import_SegmentedTabs.default,
   Select: () => import_Select.default,
   Sidebar: () => import_Sidebar.default,
   Skeleton: () => import_Skeleton.default,
@@ -152,6 +153,7 @@ var import_Link = __toESM(require("./Link"));
 var import_Toast = require("./Toast");
 var import_StorageUsage = __toESM(require("./StorageUsage"));
 var import_FileButton = __toESM(require("./FileButton"));
+var import_SegmentedTabs = __toESM(require("./SegmentedTabs"));
 var Animations = __toESM(require("./animations"));
 var import_MotionProvider = __toESM(require("./MotionProvider"));
 var import_CalendarPanel = __toESM(require("./CalendarPanel"));
@@ -213,6 +215,7 @@ var import_ThemeToggle = __toESM(require("./theme/ThemeToggle"));
   ReviewHistory,
   ReviewHistoryDialog,
   SearchInput,
+  SegmentedTabs,
   Select,
   Sidebar,
   Skeleton,

package/dist/index.mjs

@@ -49,20 +49,21 @@ import { default as default44 } from "./Link";
 import { ToastProvider, useToast } from "./Toast";
 import { default as default45 } from "./StorageUsage";
 import { default as default46 } from "./FileButton";
+import { default as default47 } from "./SegmentedTabs";
 import * as Animations from "./animations";
-import { default as default47 } from "./MotionProvider";
-import { default as default48 } from "./CalendarPanel";
-import { default as default49 } from "./TimePopover";
+import { default as default48 } from "./MotionProvider";
+import { default as default49 } from "./CalendarPanel";
+import { default as default50 } from "./TimePopover";
 import { WeekPopover, MonthPopover } from "./TimePopover";
-import { default as default50 } from "./TimePanel";
-import { default as default51 } from "./TimeRangeField";
-import { default as default52 } from "./Steps";
+import { default as default51 } from "./TimePanel";
+import { default as default52 } from "./TimeRangeField";
+import { default as default53 } from "./Steps";
 import { StepsNav } from "./Steps";
 export * from "./iconos";
-import { default as default53 } from "./ColorPicker";
-import { default as default54, useTheme } from "./theme/ThemeProvider";
-import { default as default55 } from "./theme/ThemeScript";
-import { default as default56 } from "./theme/ThemeToggle";
+import { default as default54 } from "./ColorPicker";
+import { default as default55, useTheme } from "./theme/ThemeProvider";
+import { default as default56 } from "./theme/ThemeScript";
+import { default as default57 } from "./theme/ThemeToggle";
 export {
   default3 as ActionIconButton,
   AnimatedBody,
@@ -74,12 +75,12 @@ export {
   default28 as BadgeCluster,
   default29 as Breadcrumb,
   default2 as Button,
-  default48 as CalendarPanel,
+  default49 as CalendarPanel,
   default41 as Card,
   default17 as ChartCard,
   default6 as Checkbox,
   default7 as CheckboxPillsGroup,
-  default53 as ColorPicker,
+  default54 as ColorPicker,
   default11 as ColumnSelector,
   default10 as ComboSelect,
   CtrHorizontalBar,
@@ -100,7 +101,7 @@ export {
   default22 as MediaTile,
   default31 as Money,
   MonthPopover,
-  default47 as MotionProvider,
+  default48 as MotionProvider,
   default39 as MultiComboSelect,
   default36 as OrderButton,
   default15 as Pagination,
@@ -109,24 +110,25 @@ export {
   default38 as ReviewHistory,
   ReviewHistoryDialog,
   default37 as SearchInput,
+  default47 as SegmentedTabs,
   default9 as Select,
   default40 as Sidebar,
   default23 as Skeleton,
   SortTh,
   default25 as StatCard,
-  default52 as Steps,
+  default53 as Steps,
   StepsNav,
   default45 as StorageUsage,
   Td,
   default5 as Textarea,
   Th,
-  default54 as ThemeProvider,
-  default55 as ThemeScript,
-  default56 as ThemeToggle,
+  default55 as ThemeProvider,
+  default56 as ThemeScript,
+  default57 as ThemeToggle,
   default32 as TimeAgo,
-  default50 as TimePanel,
-  default49 as TimePopover,
-  default51 as TimeRangeField,
+  default51 as TimePanel,
+  default50 as TimePopover,
+  default52 as TimeRangeField,
   ToastProvider,
   default43 as Tooltip,
   TopImpresionesBar,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "framepexls-ui-lib",
-  "version": "0.3.16",
+  "version": "0.3.17",
   "private": false,
   "license": "MIT",
   "description": "Componentes UI de Framepexls para React/Next.",