@synnaxlabs/pluto 0.12.0 → 0.14.0

package/dist/Selector-R3lL41_i.js

@@ -1,267 +0,0 @@
-import { j as jsxRuntimeExports } from "./jsx-runtime-rX5tAIG2.js";
-import { createContext, useState, useContext, useCallback } from "react";
-import { I as Icon, s as Icon$1, W as WithIcon, g as Text, E as Editable } from "./Toggle-kLunfJtR.js";
-import { S as Space, P as Pack } from "./Center-gEKkAkdh.js";
-import { C as CSS } from "./css-NTD4Xm8x.js";
-import "./component-k78Jq9I7.js";
-const resetSelection = (selected = "", tabs = []) => {
-  var _a;
-  if (tabs.length === 0)
-    return void 0;
-  return tabs.find((t) => t.tabKey === selected) != null ? selected : (_a = tabs[tabs.length - 1]) == null ? void 0 : _a.tabKey;
-};
-const rename = (key, title, tabs) => {
-  title = title.trim();
-  if (title.length === 0)
-    return tabs;
-  const t = tabs.find((t2) => t2.tabKey === key);
-  if (t == null || t.name === title)
-    return tabs;
-  return tabs.map((t2) => t2.tabKey === key ? { ...t2, name: title } : t2);
-};
-const useStatic = ({
-  tabs,
-  content,
-  onSelect
-}) => {
-  var _a;
-  const [selected, setSelected] = useState(((_a = tabs[0]) == null ? void 0 : _a.tabKey) ?? "");
-  const handleSelect = (key) => {
-    setSelected(key);
-    onSelect == null ? void 0 : onSelect(key);
-  };
-  return {
-    tabs,
-    selected,
-    content,
-    onSelect: handleSelect
-  };
-};
-const TabsContext = createContext({ tabs: [] });
-const useTabsContext = () => useContext(TabsContext);
-const Tabs = ({
-  content,
-  children,
-  onSelect,
-  selected,
-  closable,
-  tabs,
-  onClose,
-  onDragStart,
-  onDragEnd,
-  onCreate,
-  onRename,
-  emptyContent,
-  className,
-  onDragOver,
-  onDrop,
-  size = "medium",
-  ...props
-}) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-  Space,
-  {
-    empty: true,
-    className: CSS(CSS.B("tabs"), className),
-    onDragOver,
-    onDrop,
-    ...props,
-    children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
-      TabsContext.Provider,
-      {
-        value: {
-          tabs,
-          emptyContent,
-          selected,
-          closable,
-          content: children ?? content,
-          onSelect,
-          onClose,
-          onDragStart,
-          onDragEnd,
-          onRename,
-          onCreate,
-          onDrop
-        },
-        children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx(Selector, { size }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx(Content, {})
-        ]
-      }
-    )
-  }
-);
-const Provider = TabsContext.Provider;
-const Content = () => {
-  const {
-    tabs,
-    selected,
-    content: renderProp,
-    emptyContent,
-    onSelect
-  } = useTabsContext();
-  let content = null;
-  const selectedTab = tabs.find((tab) => tab.tabKey === selected);
-  if (selected == null || selectedTab == null)
-    return emptyContent ?? null;
-  if (renderProp != null)
-    content = renderProp(selectedTab);
-  else if (selectedTab.content != null)
-    content = selectedTab.content;
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    "div",
-    {
-      className: CSS.B("tabs-content"),
-      onClick: () => onSelect == null ? void 0 : onSelect(selected),
-      style: { width: "100%", height: "100%" },
-      children: content
-    }
-  );
-};
-const CLS = "tabs-selector";
-const Selector = ({
-  className,
-  size = "medium",
-  ...props
-}) => {
-  const {
-    tabs,
-    selected,
-    onSelect,
-    onClose,
-    closable,
-    onDragEnd,
-    onDragStart,
-    onDrop,
-    onRename,
-    onCreate
-  } = useTabsContext();
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
-    Space,
-    {
-      className: CSS(CSS.B(CLS), CSS.size(size), className),
-      direction: "x",
-      align: "center",
-      justify: "start",
-      onDrop,
-      empty: true,
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx(Space, { className: CSS.BE(CLS, "tabs"), empty: true, direction: "x", grow: true, children: tabs.map((tab) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-          SelectorButton,
-          {
-            selected,
-            onSelect,
-            onClose,
-            onDragStart,
-            onDragEnd,
-            onRename,
-            closable: tab.closable ?? closable,
-            size,
-            ...tab
-          },
-          tab.tabKey
-        )) }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(Space, { className: CSS.BE(CLS, "actions"), children: onCreate != null && /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { size, sharp: true, onClick: onCreate, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Icon$1.Add, {}) }) })
-      ]
-    }
-  );
-};
-const SelectorButton = ({
-  selected,
-  onSelect,
-  onClose,
-  tabKey,
-  name,
-  onDragStart,
-  onDragEnd,
-  onRename,
-  closable = true,
-  icon,
-  size,
-  editable = true
-}) => {
-  const handleDragStart = useCallback(
-    (e) => onDragStart == null ? void 0 : onDragStart(e, { tabKey, name }),
-    [onDragStart, tabKey, name]
-  );
-  const handleDragEnd = useCallback(
-    (e) => onDragEnd == null ? void 0 : onDragEnd(e, { tabKey, name }),
-    [onDragEnd, tabKey, name]
-  );
-  const handleClose = useCallback(
-    (e) => {
-      e.stopPropagation();
-      onClose == null ? void 0 : onClose(tabKey);
-    },
-    [onClose, tabKey]
-  );
-  const _onSelect = useCallback(() => onSelect == null ? void 0 : onSelect(tabKey), [onSelect, tabKey]);
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
-    Pack,
-    {
-      size,
-      className: CSS(
-        CSS.BE(CLS, "btn"),
-        onRename == null && CSS.BEM(CLS, "btn", "uneditable"),
-        CSS.selected(selected === tabKey),
-        closable && onClose != null && CSS.BEM(CLS, "btn", "closable")
-      ),
-      draggable: true,
-      direction: "x",
-      justify: "center",
-      align: "center",
-      onClick: _onSelect,
-      onDragStart: handleDragStart,
-      onDragEnd: handleDragEnd,
-      bordered: false,
-      rounded: false,
-      children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx(
-          Name,
-          {
-            name,
-            tabKey,
-            onRename,
-            icon,
-            editable
-          }
-        ),
-        closable && onClose != null && /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { onClick: handleClose, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Icon$1.Close, { "aria-label": "pluto-tabs__close" }) })
-      ]
-    }
-  );
-};
-const Name = ({
-  onRename,
-  name,
-  tabKey,
-  icon,
-  editable = true
-}) => {
-  if (onRename == null || !editable) {
-    if (icon != null)
-      return /* @__PURE__ */ jsxRuntimeExports.jsx(WithIcon, { startIcon: icon, level: "p", noWrap: true, children: name });
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { level: "p", noWrap: true, children: name });
-  }
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    Editable,
-    {
-      level: "p",
-      onChange: (newText) => onRename(tabKey, newText),
-      value: name,
-      noWrap: true
-    }
-  );
-};
-export {
-  Content as C,
-  Provider as P,
-  Selector as S,
-  Tabs as T,
-  TabsContext as a,
-  resetSelection as b,
-  useTabsContext as c,
-  rename as r,
-  useStatic as u
-};
-//# sourceMappingURL=Selector-R3lL41_i.js.map

package/dist/Selector-hQLSIYum.cjs

@@ -1,266 +0,0 @@
-"use strict";
-const jsxRuntime = require("./jsx-runtime-N1ikfypN.cjs");
-const React = require("react");
-const Toggle = require("./Toggle-eOKYw1OT.cjs");
-const Center = require("./Center-ZAcURh-3.cjs");
-const css = require("./css-V3VUT_Js.cjs");
-require("./component-joFaJiQW.cjs");
-const resetSelection = (selected = "", tabs = []) => {
-  var _a;
-  if (tabs.length === 0)
-    return void 0;
-  return tabs.find((t) => t.tabKey === selected) != null ? selected : (_a = tabs[tabs.length - 1]) == null ? void 0 : _a.tabKey;
-};
-const rename = (key, title, tabs) => {
-  title = title.trim();
-  if (title.length === 0)
-    return tabs;
-  const t = tabs.find((t2) => t2.tabKey === key);
-  if (t == null || t.name === title)
-    return tabs;
-  return tabs.map((t2) => t2.tabKey === key ? { ...t2, name: title } : t2);
-};
-const useStatic = ({
-  tabs,
-  content,
-  onSelect
-}) => {
-  var _a;
-  const [selected, setSelected] = React.useState(((_a = tabs[0]) == null ? void 0 : _a.tabKey) ?? "");
-  const handleSelect = (key) => {
-    setSelected(key);
-    onSelect == null ? void 0 : onSelect(key);
-  };
-  return {
-    tabs,
-    selected,
-    content,
-    onSelect: handleSelect
-  };
-};
-const TabsContext = React.createContext({ tabs: [] });
-const useTabsContext = () => React.useContext(TabsContext);
-const Tabs = ({
-  content,
-  children,
-  onSelect,
-  selected,
-  closable,
-  tabs,
-  onClose,
-  onDragStart,
-  onDragEnd,
-  onCreate,
-  onRename,
-  emptyContent,
-  className,
-  onDragOver,
-  onDrop,
-  size = "medium",
-  ...props
-}) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-  Center.Space,
-  {
-    empty: true,
-    className: css.CSS(css.CSS.B("tabs"), className),
-    onDragOver,
-    onDrop,
-    ...props,
-    children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(
-      TabsContext.Provider,
-      {
-        value: {
-          tabs,
-          emptyContent,
-          selected,
-          closable,
-          content: children ?? content,
-          onSelect,
-          onClose,
-          onDragStart,
-          onDragEnd,
-          onRename,
-          onCreate,
-          onDrop
-        },
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Selector, { size }),
-          /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Content, {})
-        ]
-      }
-    )
-  }
-);
-const Provider = TabsContext.Provider;
-const Content = () => {
-  const {
-    tabs,
-    selected,
-    content: renderProp,
-    emptyContent,
-    onSelect
-  } = useTabsContext();
-  let content = null;
-  const selectedTab = tabs.find((tab) => tab.tabKey === selected);
-  if (selected == null || selectedTab == null)
-    return emptyContent ?? null;
-  if (renderProp != null)
-    content = renderProp(selectedTab);
-  else if (selectedTab.content != null)
-    content = selectedTab.content;
-  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-    "div",
-    {
-      className: css.CSS.B("tabs-content"),
-      onClick: () => onSelect == null ? void 0 : onSelect(selected),
-      style: { width: "100%", height: "100%" },
-      children: content
-    }
-  );
-};
-const CLS = "tabs-selector";
-const Selector = ({
-  className,
-  size = "medium",
-  ...props
-}) => {
-  const {
-    tabs,
-    selected,
-    onSelect,
-    onClose,
-    closable,
-    onDragEnd,
-    onDragStart,
-    onDrop,
-    onRename,
-    onCreate
-  } = useTabsContext();
-  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(
-    Center.Space,
-    {
-      className: css.CSS(css.CSS.B(CLS), css.CSS.size(size), className),
-      direction: "x",
-      align: "center",
-      justify: "start",
-      onDrop,
-      empty: true,
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Center.Space, { className: css.CSS.BE(CLS, "tabs"), empty: true, direction: "x", grow: true, children: tabs.map((tab) => /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-          SelectorButton,
-          {
-            selected,
-            onSelect,
-            onClose,
-            onDragStart,
-            onDragEnd,
-            onRename,
-            closable: tab.closable ?? closable,
-            size,
-            ...tab
-          },
-          tab.tabKey
-        )) }),
-        /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Center.Space, { className: css.CSS.BE(CLS, "actions"), children: onCreate != null && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Toggle.Icon, { size, sharp: true, onClick: onCreate, children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Toggle.Icon$1.Add, {}) }) })
-      ]
-    }
-  );
-};
-const SelectorButton = ({
-  selected,
-  onSelect,
-  onClose,
-  tabKey,
-  name,
-  onDragStart,
-  onDragEnd,
-  onRename,
-  closable = true,
-  icon,
-  size,
-  editable = true
-}) => {
-  const handleDragStart = React.useCallback(
-    (e) => onDragStart == null ? void 0 : onDragStart(e, { tabKey, name }),
-    [onDragStart, tabKey, name]
-  );
-  const handleDragEnd = React.useCallback(
-    (e) => onDragEnd == null ? void 0 : onDragEnd(e, { tabKey, name }),
-    [onDragEnd, tabKey, name]
-  );
-  const handleClose = React.useCallback(
-    (e) => {
-      e.stopPropagation();
-      onClose == null ? void 0 : onClose(tabKey);
-    },
-    [onClose, tabKey]
-  );
-  const _onSelect = React.useCallback(() => onSelect == null ? void 0 : onSelect(tabKey), [onSelect, tabKey]);
-  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(
-    Center.Pack,
-    {
-      size,
-      className: css.CSS(
-        css.CSS.BE(CLS, "btn"),
-        onRename == null && css.CSS.BEM(CLS, "btn", "uneditable"),
-        css.CSS.selected(selected === tabKey),
-        closable && onClose != null && css.CSS.BEM(CLS, "btn", "closable")
-      ),
-      draggable: true,
-      direction: "x",
-      justify: "center",
-      align: "center",
-      onClick: _onSelect,
-      onDragStart: handleDragStart,
-      onDragEnd: handleDragEnd,
-      bordered: false,
-      rounded: false,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-          Name,
-          {
-            name,
-            tabKey,
-            onRename,
-            icon,
-            editable
-          }
-        ),
-        closable && onClose != null && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Toggle.Icon, { onClick: handleClose, children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Toggle.Icon$1.Close, { "aria-label": "pluto-tabs__close" }) })
-      ]
-    }
-  );
-};
-const Name = ({
-  onRename,
-  name,
-  tabKey,
-  icon,
-  editable = true
-}) => {
-  if (onRename == null || !editable) {
-    if (icon != null)
-      return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Toggle.WithIcon, { startIcon: icon, level: "p", noWrap: true, children: name });
-    return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Toggle.Text, { level: "p", noWrap: true, children: name });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
-    Toggle.Editable,
-    {
-      level: "p",
-      onChange: (newText) => onRename(tabKey, newText),
-      value: name,
-      noWrap: true
-    }
-  );
-};
-exports.Content = Content;
-exports.Provider = Provider;
-exports.Selector = Selector;
-exports.Tabs = Tabs;
-exports.TabsContext = TabsContext;
-exports.rename = rename;
-exports.resetSelection = resetSelection;
-exports.useStatic = useStatic;
-exports.useTabsContext = useTabsContext;
-//# sourceMappingURL=Selector-hQLSIYum.cjs.map