@octohirono/stitch-design-system 0.1.0

package/dist/components/Toolbar/index.d.ts

@@ -0,0 +1,2 @@
+export { Toolbar } from './Toolbar';
+export type { ToolbarProps, ToolbarButtonProps, ToolbarLinkProps, ToolbarSeparatorProps, ToolbarToggleGroupProps, ToolbarToggleGroupSingleProps, ToolbarToggleGroupMultipleProps, } from './Toolbar';

package/dist/components/Toolbar/toolbar.module.js

@@ -0,0 +1,14 @@
+//#region packages/react/src/components/Toolbar/toolbar.module.less
+var e = "_root_1m3hm_1", t = "_button_1m3hm_15", n = "_buttonDanger_1m3hm_48", r = "_buttonIcon_1m3hm_55", i = "_toggleGroup_1m3hm_61", a = "_toggleItem_1m3hm_65", o = "_itemIcon_1m3hm_103", s = "_separator_1m3hm_106", c = "_link_1m3hm_118", l = {
+	root: e,
+	button: t,
+	buttonDanger: n,
+	buttonIcon: r,
+	toggleGroup: i,
+	toggleItem: a,
+	itemIcon: o,
+	separator: s,
+	link: c
+};
+//#endregion
+export { t as button, n as buttonDanger, r as buttonIcon, l as default, o as itemIcon, c as link, e as root, s as separator, i as toggleGroup, a as toggleItem };

package/dist/components/Tooltip/Tooltip.d.ts

@@ -0,0 +1,41 @@
+import React from 'react';
+export type TooltipPlacement = 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end' | 'right' | 'right-start' | 'right-end';
+export type TooltipTrigger = 'hover' | 'focus' | 'click';
+/**
+ * 文字提示浮层（Ant `Tooltip` 语义）：`title` 内容 + `placement`（12 向）+ `trigger`
+ * （`hover` / `focus` / `click`）+ 受控 `open` / `defaultOpen` / `onOpenChange`。标准矩形浮层，
+ * 圆角 / 边框 / 阴影由主题决定。
+ *
+ * 跨-prop 注意事项：
+ * - **受控/非受控双模式**：给 `open` 由父管（配 `onOpenChange`），只给 `defaultOpen` 组件自管。
+ * - **a11y 描述关联**：显示时把 tooltip 的 id 拼进触发器的 `aria-describedby`（保留子元素原有值），
+ *   隐藏时撤回；浮层 `role="tooltip"` + `aria-hidden` 随显隐切换。
+ * - **面 = 浅底浮起层**：气泡走 `--stitch-bg-elevated`（浮起面）+ 深字 `--stitch-text-primary`；
+ *   边框 / 箭头走 `--stitch-text-disabled`。箭头几何（菱形边长、位置微调、gap）为浮层结构量、
+ *   非主题值。
+ */
+export interface TooltipProps {
+    /** 提示内容，支持多行（可用 \n 或 <br/> 换行） */
+    title: React.ReactNode;
+    /** 弹出位置 @default 'top' */
+    placement?: TooltipPlacement;
+    /** 触发方式 @default 'hover' */
+    trigger?: TooltipTrigger;
+    /** 受控显隐（气泡浮层约定：Ant v5 `open`） */
+    open?: boolean;
+    /** 非受控初始显隐 @default false */
+    defaultOpen?: boolean;
+    /** 显隐变化回调（气泡浮层约定：Ant v5 `onOpenChange`） */
+    onOpenChange?: (open: boolean) => void;
+    /** 子元素（触发器） */
+    children: React.ReactElement;
+    /** 自定义类名 */
+    className?: string;
+    /** 自定义样式 */
+    style?: React.CSSProperties;
+}
+/**
+ * 文字提示浮层：hover / focus / click 触发，12 向定位。
+ * 显示时通过 `aria-describedby` 把内容关联到触发器，屏幕阅读器可读；受控（`open`/`onOpenChange`）与非受控双模式。
+ */
+export declare const Tooltip: React.FC<TooltipProps>;

package/dist/components/Tooltip/Tooltip.js

@@ -0,0 +1,38 @@
+import e from "./tooltip.module.js";
+import t, { useCallback as n, useEffect as r, useId as i, useRef as a, useState as o } from "react";
+import s from "clsx";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+//#region packages/react/src/components/Tooltip/Tooltip.tsx
+var u = ({ title: u, placement: d = "top", trigger: f = "hover", open: p, defaultOpen: m = !1, onOpenChange: h, children: g, className: _, style: v }) => {
+	let [y, b] = o(m), x = p !== void 0, S = x ? p : y, C = a(void 0), w = `stitch-tooltip-${i().replace(/:/g, "")}`, T = n((e) => {
+		x || b(e), h?.(e);
+	}, [x, h]), E = n(() => {
+		clearTimeout(C.current), T(!0);
+	}, [T]), D = n(() => {
+		C.current = setTimeout(() => T(!1), 100);
+	}, [T]);
+	r(() => () => clearTimeout(C.current), []);
+	let O = t.Children.only(g), k = O.props["aria-describedby"], A = { "aria-describedby": S ? [k, w].filter(Boolean).join(" ") : k }, j = {};
+	f === "hover" ? (j.onMouseEnter = E, j.onMouseLeave = D) : f === "focus" ? (j.onFocus = E, j.onBlur = D) : f === "click" && (j.onClick = () => T(!S));
+	let M = e[d.replace(/-/g, "_")];
+	return /* @__PURE__ */ l("div", {
+		className: s(e.tooltipWrapper, _),
+		style: v,
+		...j,
+		children: [t.cloneElement(O, A), /* @__PURE__ */ c("div", {
+			className: s(e.tooltip, M, S && e.visible),
+			role: "tooltip",
+			id: w,
+			"aria-hidden": !S,
+			onMouseEnter: f === "hover" ? E : void 0,
+			onMouseLeave: f === "hover" ? D : void 0,
+			children: /* @__PURE__ */ c("div", {
+				className: e.content,
+				children: u
+			})
+		})]
+	});
+};
+u.displayName = "Tooltip";
+//#endregion
+export { u as Tooltip };

package/dist/components/Tooltip/index.d.ts

@@ -0,0 +1,2 @@
+export { Tooltip } from './Tooltip';
+export type { TooltipProps, TooltipPlacement, TooltipTrigger } from './Tooltip';

package/dist/components/Tooltip/tooltip.module.js

@@ -0,0 +1,21 @@
+//#region packages/react/src/components/Tooltip/tooltip.module.less
+var e = "_tooltipWrapper_ivtw5_1", t = "_tooltip_ivtw5_1", n = "_visible_ivtw5_27", r = "_content_ivtw5_39", i = "_top_ivtw5_45", a = "_top_start_ivtw5_60", o = "_top_end_ivtw5_75", s = "_bottom_ivtw5_90", c = "_bottom_start_ivtw5_105", l = "_bottom_end_ivtw5_120", u = "_left_ivtw5_135", d = "_left_start_ivtw5_150", f = "_left_end_ivtw5_165", p = "_right_ivtw5_180", m = "_right_start_ivtw5_195", h = "_right_end_ivtw5_210", g = {
+	tooltipWrapper: e,
+	tooltip: t,
+	visible: n,
+	content: r,
+	top: i,
+	top_start: a,
+	top_end: o,
+	bottom: s,
+	bottom_start: c,
+	bottom_end: l,
+	left: u,
+	left_start: d,
+	left_end: f,
+	right: p,
+	right_start: m,
+	right_end: h
+};
+//#endregion
+export { s as bottom, l as bottom_end, c as bottom_start, r as content, g as default, u as left, f as left_end, d as left_start, p as right, h as right_end, m as right_start, t as tooltip, e as tooltipWrapper, i as top, o as top_end, a as top_start, n as visible };

package/dist/components/_internal/useOverlay.d.ts

@@ -0,0 +1,15 @@
+/** 取容器内所有可聚焦元素（跳过 disabled / aria-hidden）。 */
+export declare const getFocusable: (root: HTMLElement) => HTMLElement[];
+export interface UseOverlayOptions {
+    /** 浮层是否打开 */
+    open: boolean;
+    /** 浮层根节点 ref（焦点陷阱与初始聚焦的范围） */
+    containerRef: React.RefObject<HTMLElement | null>;
+    /** 按下 Esc 时触发（通常 = 关闭） */
+    onEscape?: () => void;
+}
+/**
+ * 覆盖层通用行为：焦点转移 + 焦点陷阱 + Esc 关闭 + 滚动锁 + 焦点归还。
+ * Modal / Drawer 共享，避免在每个浮层组件里重复实现。
+ */
+export declare function useOverlay({ open, containerRef, onEscape, }: UseOverlayOptions): void;

package/dist/components/_internal/useOverlay.js

@@ -0,0 +1,55 @@
+import { useEffect as e } from "react";
+//#region packages/react/src/components/_internal/useOverlay.ts
+var t = [
+	"a[href]",
+	"area[href]",
+	"button:not([disabled])",
+	"input:not([disabled]):not([type=\"hidden\"])",
+	"select:not([disabled])",
+	"textarea:not([disabled])",
+	"[tabindex]:not([tabindex=\"-1\"])",
+	"audio[controls]",
+	"video[controls]",
+	"[contenteditable]:not([contenteditable=\"false\"])"
+].join(","), n = (e) => Array.from(e.querySelectorAll(t)).filter((e) => !e.hasAttribute("disabled") && e.getAttribute("aria-hidden") !== "true");
+function r({ open: t, containerRef: r, onEscape: i }) {
+	e(() => {
+		if (!t) return;
+		let e = document.activeElement, i = window.setTimeout(() => {
+			let e = r.current;
+			e && (n(e)[0] ?? e).focus();
+		}, 0);
+		return () => {
+			window.clearTimeout(i), e?.focus?.();
+		};
+	}, [t, r]), e(() => {
+		if (!t) return;
+		let e = (e) => {
+			if (e.key === "Escape") {
+				i?.();
+				return;
+			}
+			if (e.key !== "Tab") return;
+			let t = r.current;
+			if (!t) return;
+			let a = n(t);
+			if (a.length === 0) {
+				e.preventDefault(), t.focus();
+				return;
+			}
+			let o = a[0], s = a[a.length - 1], c = document.activeElement;
+			e.shiftKey ? (c === o || !t.contains(c)) && (e.preventDefault(), s.focus()) : (c === s || !t.contains(c)) && (e.preventDefault(), o.focus());
+		};
+		return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
+	}, [
+		t,
+		i,
+		r
+	]), e(() => {
+		if (t) return document.body.style.overflow = "hidden", () => {
+			document.body.style.overflow = "";
+		};
+	}, [t]);
+}
+//#endregion
+export { n as getFocusable, r as useOverlay };

package/dist/index.d.ts

@@ -0,0 +1,82 @@
+export { Button } from './components/Button';
+export type { ButtonProps, ButtonType, ButtonSize, ButtonHTMLType, } from './components/Button';
+export { Icon, ICON_LIST } from './components/Icon';
+export type { IconProps, IconName } from './components/Icon';
+export { Toggle } from './components/Toggle';
+export type { ToggleProps } from './components/Toggle';
+export { ToggleGroup } from './components/ToggleGroup';
+export type { ToggleGroupProps, ToggleGroupSingleProps, ToggleGroupMultipleProps, ToggleGroupItem, } from './components/ToggleGroup';
+export { Image } from './components/Image';
+export type { ImageProps, ImageColor } from './components/Image';
+export { Card } from './components/Card';
+export type { CardProps, CardVariant, CardColor } from './components/Card';
+export { Divider } from './components/Divider';
+export type { DividerProps, DividerType, DividerVariant, DividerOrientation, } from './components/Divider';
+export { Collapse } from './components/Collapse';
+export type { CollapseProps } from './components/Collapse';
+export { Tabs } from './components/Tabs';
+export type { TabsProps, TabItem } from './components/Tabs';
+export { Accordion } from './components/Accordion';
+export type { AccordionProps, AccordionItem } from './components/Accordion';
+export { AspectRatio } from './components/AspectRatio';
+export type { AspectRatioProps } from './components/AspectRatio';
+export { Avatar } from './components/Avatar';
+export type { AvatarProps, AvatarSize, AvatarShape } from './components/Avatar';
+export { Input } from './components/Input';
+export type { InputProps, InputSize } from './components/Input';
+export { PasswordInput } from './components/PasswordInput';
+export type { PasswordInputProps } from './components/PasswordInput';
+export { OtpField } from './components/OtpField';
+export type { OtpFieldProps } from './components/OtpField';
+export { Checkbox } from './components/Checkbox';
+export type { CheckboxProps, CheckboxOption, CheckboxSize, } from './components/Checkbox';
+export { Radio } from './components/Radio';
+export type { RadioProps, RadioOption, RadioSize } from './components/Radio';
+export { Switch } from './components/Switch';
+export type { SwitchProps, SwitchSize } from './components/Switch';
+export { Slider } from './components/Slider';
+export type { SliderProps, SliderOrientation } from './components/Slider';
+export { Label } from './components/Label';
+export type { LabelProps } from './components/Label';
+export { Select } from './components/Select';
+export type { SelectProps, SelectOption, SelectSize, } from './components/Select';
+export { Form } from './components/Form';
+export type { FormProps, FormItemProps, FormInstance, FormLayout, FormLabelAlign, FormSize, FormItemLayout, RequiredMark, ValidateStatus, RuleObject, RuleRender, RuleType, Rules, NamePath, ColProps, FieldData, ValidateError, ValidateInfo, ScrollOptions, StoreValue, FormProviderProps, } from './components/Form';
+export { Tag } from './components/Tag';
+export type { TagProps, TagSize, TagVariant, TagColor } from './components/Tag';
+export { Table } from './components/Table';
+export type { TableProps, TableColumn } from './components/Table';
+export { CodeBlock } from './components/CodeBlock';
+export type { CodeBlockProps } from './components/CodeBlock';
+export { Loading } from './components/Loading';
+export type { LoadingProps, LoadingSize } from './components/Loading';
+export { Progress } from './components/Progress';
+export type { ProgressProps, ProgressSize, ProgressInfoPosition, } from './components/Progress';
+export { Skeleton } from './components/Skeleton';
+export type { SkeletonProps, SkeletonVariant, SkeletonButtonProps, SkeletonInputProps, SkeletonAvatarProps, } from './components/Skeleton';
+export { Notification } from './components/Notification';
+export type { NotificationStatic, NotificationConfig, NotificationType, NotificationPosition, NotificationPlacement, } from './components/Notification';
+export { Modal } from './components/Modal';
+export type { ModalProps } from './components/Modal';
+export { AlertDialog } from './components/AlertDialog';
+export type { AlertDialogProps } from './components/AlertDialog';
+export { Drawer } from './components/Drawer';
+export type { DrawerProps, DrawerPlacement } from './components/Drawer';
+export { Tooltip } from './components/Tooltip';
+export type { TooltipProps, TooltipPlacement, TooltipTrigger, } from './components/Tooltip';
+export { Popover } from './components/Popover';
+export type { PopoverProps } from './components/Popover';
+export { HoverCard } from './components/HoverCard';
+export type { HoverCardProps } from './components/HoverCard';
+export { DropdownMenu } from './components/DropdownMenu';
+export type { DropdownMenuProps, DropdownMenuItem, } from './components/DropdownMenu';
+export { ContextMenu } from './components/ContextMenu';
+export type { ContextMenuProps, ContextMenuItem, } from './components/ContextMenu';
+export { Menubar } from './components/Menubar';
+export type { MenubarProps, MenubarMenu, MenubarMenuItem, } from './components/Menubar';
+export { Toolbar } from './components/Toolbar';
+export type { ToolbarProps, ToolbarButtonProps, ToolbarLinkProps, ToolbarSeparatorProps, ToolbarToggleGroupProps, ToolbarToggleGroupSingleProps, ToolbarToggleGroupMultipleProps, } from './components/Toolbar';
+export { NavigationMenu } from './components/NavigationMenu';
+export type { NavigationMenuProps, NavItem } from './components/NavigationMenu';
+export { ScrollArea } from './components/ScrollArea';
+export type { ScrollAreaProps, ScrollAreaOrientation, } from './components/ScrollArea';

package/dist/index.js

@@ -0,0 +1,43 @@
+/* empty css                               */
+import { Button as e } from "./components/Button/Button.js";
+import { ICON_LIST as t, Icon as n } from "./components/Icon/Icon.js";
+import { Toggle as r } from "./components/Toggle/Toggle.js";
+import { ToggleGroup as i } from "./components/ToggleGroup/ToggleGroup.js";
+import { Image as a } from "./components/Image/Image.js";
+import { Card as o } from "./components/Card/Card.js";
+import { Divider as s } from "./components/Divider/Divider.js";
+import { Collapse as c } from "./components/Collapse/Collapse.js";
+import { Tabs as l } from "./components/Tabs/Tabs.js";
+import { Accordion as u } from "./components/Accordion/Accordion.js";
+import { AspectRatio as d } from "./components/AspectRatio/AspectRatio.js";
+import { Avatar as f } from "./components/Avatar/Avatar.js";
+import { Input as p } from "./components/Input/Input.js";
+import { PasswordInput as m } from "./components/PasswordInput/PasswordInput.js";
+import { OtpField as h } from "./components/OtpField/OtpField.js";
+import { Checkbox as g } from "./components/Checkbox/Checkbox.js";
+import { Radio as _ } from "./components/Radio/Radio.js";
+import { Switch as v } from "./components/Switch/Switch.js";
+import { Slider as y } from "./components/Slider/Slider.js";
+import { Label as b } from "./components/Label/Label.js";
+import { Select as x } from "./components/Select/Select.js";
+import { Form as S } from "./components/Form/Form.js";
+import { Tag as C } from "./components/Tag/Tag.js";
+import { Table as w } from "./components/Table/Table.js";
+import { CodeBlock as T } from "./components/CodeBlock/CodeBlock.js";
+import { Loading as E } from "./components/Loading/Loading.js";
+import { Progress as D } from "./components/Progress/Progress.js";
+import { Skeleton as O } from "./components/Skeleton/Skeleton.js";
+import { Notification as k } from "./components/Notification/NotificationPortal.js";
+import { Modal as A } from "./components/Modal/Modal.js";
+import { AlertDialog as j } from "./components/AlertDialog/AlertDialog.js";
+import { Drawer as M } from "./components/Drawer/Drawer.js";
+import { Tooltip as N } from "./components/Tooltip/Tooltip.js";
+import { Popover as P } from "./components/Popover/Popover.js";
+import { HoverCard as F } from "./components/HoverCard/HoverCard.js";
+import { DropdownMenu as I } from "./components/DropdownMenu/DropdownMenu.js";
+import { ContextMenu as L } from "./components/ContextMenu/ContextMenu.js";
+import { Menubar as R } from "./components/Menubar/Menubar.js";
+import { Toolbar as z } from "./components/Toolbar/Toolbar.js";
+import { NavigationMenu as B } from "./components/NavigationMenu/NavigationMenu.js";
+import { ScrollArea as V } from "./components/ScrollArea/ScrollArea.js";
+export { u as Accordion, j as AlertDialog, d as AspectRatio, f as Avatar, e as Button, o as Card, g as Checkbox, T as CodeBlock, c as Collapse, L as ContextMenu, s as Divider, M as Drawer, I as DropdownMenu, S as Form, F as HoverCard, t as ICON_LIST, n as Icon, a as Image, p as Input, b as Label, E as Loading, R as Menubar, A as Modal, B as NavigationMenu, k as Notification, h as OtpField, m as PasswordInput, P as Popover, D as Progress, _ as Radio, V as ScrollArea, x as Select, O as Skeleton, y as Slider, v as Switch, w as Table, l as Tabs, C as Tag, r as Toggle, i as ToggleGroup, z as Toolbar, N as Tooltip };