@galaxy-io/dls 1.0.3

package/dist/hooks/useResize.d.ts

@@ -0,0 +1,83 @@
+export type ResizeAnchor = "left" | "right" | "top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right";
+interface UseResizeProps {
+    /**
+     * Current width of the element
+     */
+    currentWidth: number;
+    /**
+     * Current height of the element
+     */
+    currentHeight: number;
+    /**
+     * Callback when width changes
+     */
+    onWidthChange?: (width: number) => void;
+    /**
+     * Callback when height changes
+     */
+    onHeightChange?: (height: number) => void;
+    /**
+     * Callback when both dimensions change (for corner resizing)
+     */
+    onSizeChange?: (width: number, height: number) => void;
+    /**
+     * Minimum width constraint
+     */
+    minWidth?: number;
+    /**
+     * Maximum width constraint
+     */
+    maxWidth?: number;
+    /**
+     * Minimum height constraint
+     */
+    minHeight?: number;
+    /**
+     * Maximum height constraint
+     */
+    maxHeight?: number;
+    /**
+     * Which edge(s) are anchored/fixed. The resize handle is on the opposite side.
+     * - "left": right edge is fixed, handle on left
+     * - "right": left edge is fixed, handle on right
+     * - "top": bottom edge is fixed, handle on top
+     * - "bottom": top edge is fixed, handle on bottom
+     * - "top-left": bottom-right corner is fixed, handle on top-left
+     * - "top-right": bottom-left corner is fixed, handle on top-right
+     * - "bottom-left": top-right corner is fixed, handle on bottom-left
+     * - "bottom-right": top-left corner is fixed, handle on bottom-right
+     */
+    anchor: ResizeAnchor;
+}
+/**
+ * Unified resize hook that handles horizontal, vertical, and diagonal resizing.
+ *
+ * The anchor parameter determines which edge(s) are fixed:
+ * - For edge anchors (left/right/top/bottom), only that dimension is resized
+ * - For corner anchors (top-left/top-right/bottom-left/bottom-right), both dimensions are resized
+ *
+ * @example
+ * // Resize from left edge (right edge is fixed)
+ * const handleResize = useResize({
+ *   currentWidth: width,
+ *   anchor: "left",
+ *   onWidthChange: setWidth,
+ *   minWidth: 100,
+ *   maxWidth: 1000,
+ * });
+ *
+ * @example
+ * // Resize from top-left corner (bottom-right corner is fixed)
+ * const handleResize = useResize({
+ *   currentWidth: width,
+ *   currentHeight: height,
+ *   anchor: "top-left",
+ *   onSizeChange: (w, h) => { setWidth(w); setHeight(h); },
+ *   minWidth: 100,
+ *   maxWidth: 1000,
+ *   minHeight: 100,
+ *   maxHeight: 1000,
+ * });
+ */
+export declare const useResize: ({ currentWidth, currentHeight, onWidthChange, onHeightChange, onSizeChange, minWidth, maxWidth, minHeight, maxHeight, anchor, }: UseResizeProps) => (e: React.MouseEvent) => void;
+export {};

package/dist/hooks/useResize.js

@@ -0,0 +1,114 @@
+import { useCallback, useRef } from "react";
+//#region src/hooks/useResize.ts
+/**
+* Unified resize hook that handles horizontal, vertical, and diagonal resizing.
+*
+* The anchor parameter determines which edge(s) are fixed:
+* - For edge anchors (left/right/top/bottom), only that dimension is resized
+* - For corner anchors (top-left/top-right/bottom-left/bottom-right), both dimensions are resized
+*
+* @example
+* // Resize from left edge (right edge is fixed)
+* const handleResize = useResize({
+*   currentWidth: width,
+*   anchor: "left",
+*   onWidthChange: setWidth,
+*   minWidth: 100,
+*   maxWidth: 1000,
+* });
+*
+* @example
+* // Resize from top-left corner (bottom-right corner is fixed)
+* const handleResize = useResize({
+*   currentWidth: width,
+*   currentHeight: height,
+*   anchor: "top-left",
+*   onSizeChange: (w, h) => { setWidth(w); setHeight(h); },
+*   minWidth: 100,
+*   maxWidth: 1000,
+*   minHeight: 100,
+*   maxHeight: 1000,
+* });
+*/
+var useResize = ({ currentWidth, currentHeight, onWidthChange, onHeightChange, onSizeChange, minWidth = 0, maxWidth = Infinity, minHeight = 0, maxHeight = Infinity, anchor }) => {
+	const isResizingRef = useRef(false);
+	const startXRef = useRef(0);
+	const startYRef = useRef(0);
+	const startWidthRef = useRef(currentWidth);
+	const startHeightRef = useRef(currentHeight);
+	const handleMouseMove = useCallback((e) => {
+		if (!isResizingRef.current) return;
+		const deltaX = startXRef.current - e.clientX;
+		const deltaY = startYRef.current - e.clientY;
+		let widthDelta = 0;
+		let heightDelta = 0;
+		switch (anchor) {
+			case "left":
+				widthDelta = deltaX;
+				break;
+			case "right":
+				widthDelta = -deltaX;
+				break;
+			case "top":
+				heightDelta = deltaY;
+				break;
+			case "bottom":
+				heightDelta = -deltaY;
+				break;
+			case "top-left":
+				widthDelta = deltaX;
+				heightDelta = deltaY;
+				break;
+			case "top-right":
+				widthDelta = -deltaX;
+				heightDelta = deltaY;
+				break;
+			case "bottom-left":
+				widthDelta = deltaX;
+				heightDelta = -deltaY;
+				break;
+			case "bottom-right":
+				widthDelta = -deltaX;
+				heightDelta = -deltaY;
+				break;
+		}
+		const newWidth = Math.max(minWidth, Math.min(maxWidth, startWidthRef.current + widthDelta));
+		const newHeight = Math.max(minHeight, Math.min(maxHeight, startHeightRef.current + heightDelta));
+		if (onSizeChange && (widthDelta !== 0 || heightDelta !== 0)) onSizeChange(newWidth, newHeight);
+		else {
+			if (widthDelta !== 0 && onWidthChange) onWidthChange(newWidth);
+			if (heightDelta !== 0 && onHeightChange) onHeightChange(newHeight);
+		}
+	}, [
+		anchor,
+		minWidth,
+		maxWidth,
+		minHeight,
+		maxHeight,
+		onWidthChange,
+		onHeightChange,
+		onSizeChange
+	]);
+	return useCallback((e) => {
+		e.preventDefault();
+		e.stopPropagation();
+		isResizingRef.current = true;
+		startXRef.current = e.clientX;
+		startYRef.current = e.clientY;
+		startWidthRef.current = currentWidth;
+		startHeightRef.current = currentHeight;
+		const handleMouseUp = () => {
+			isResizingRef.current = false;
+			document.removeEventListener("mousemove", handleMouseMove);
+			document.removeEventListener("mouseup", handleMouseUp);
+		};
+		document.addEventListener("mousemove", handleMouseMove);
+		document.addEventListener("mouseup", handleMouseUp);
+	}, [
+		currentWidth,
+		currentHeight,
+		handleMouseMove
+	]);
+};
+//#endregion
+export { useResize };

package/dist/hotkeys/HotKeyBindings.d.ts

@@ -0,0 +1,7 @@
+import { type HotKeyVariant } from "./HotKeySymbol";
+interface HotKeyBindingsProps {
+    variant?: HotKeyVariant;
+    hotKeys: string[];
+}
+declare const HotKeyBindings: ({ variant, hotKeys }: HotKeyBindingsProps) => import("react").JSX.Element;
+export default HotKeyBindings;

package/dist/hotkeys/HotKeyBindings.js

@@ -0,0 +1,23 @@
+import HotKeySymbol from "./HotKeySymbol.js";
+/* empty css                         */
+import { styled } from "@linaria/react";
+import { jsx } from "react/jsx-runtime";
+//#region src/hotkeys/HotKeyBindings.tsx
+var HotKeyBindingWrapper = /*#__PURE__*/ styled("div")({
+	name: "HotKeyBindingWrapper",
+	class: "h179mi29",
+	propsAsIs: false
+});
+var HotKeyBindingSymbolWrapper = /*#__PURE__*/ styled("div")({
+	name: "HotKeyBindingSymbolWrapper",
+	class: "h1gstj4e",
+	propsAsIs: false
+});
+var HotKeyBindings = ({ variant, hotKeys }) => {
+	return /* @__PURE__ */ jsx(HotKeyBindingWrapper, { children: hotKeys.map((hotKey) => /* @__PURE__ */ jsx(HotKeyBindingSymbolWrapper, { children: /* @__PURE__ */ jsx(HotKeySymbol, {
+		variant,
+		hotKey
+	}) }, hotKey)) });
+};
+//#endregion
+export { HotKeyBindings as default };

package/dist/hotkeys/HotKeySymbol.d.ts

@@ -0,0 +1,13 @@
+export declare enum HotKeyVariant {
+    BASE = "BASE",
+    PRIMARY = "PRIMARY",
+    SECONDARY = "SECONDARY",
+    TERTIARY = "TERTIARY",
+    DISABLED = "DISABLED"
+}
+export interface HotKeyProps {
+    variant?: HotKeyVariant;
+    hotKey: string;
+}
+declare const HotKeySymbol: ({ variant, hotKey }: HotKeyProps) => import("react").JSX.Element;
+export default HotKeySymbol;

package/dist/hotkeys/HotKeySymbol.js

@@ -0,0 +1,49 @@
+import { withTheme } from "../theme/GalaxyTheme.js";
+/* empty css                       */
+import { styled } from "@linaria/react";
+import { match } from "ts-pattern";
+import { jsx } from "react/jsx-runtime";
+//#region src/hotkeys/HotKeySymbol.tsx
+var HotKeyVariant = /* @__PURE__ */ function(HotKeyVariant) {
+	HotKeyVariant["BASE"] = "BASE";
+	HotKeyVariant["PRIMARY"] = "PRIMARY";
+	HotKeyVariant["SECONDARY"] = "SECONDARY";
+	HotKeyVariant["TERTIARY"] = "TERTIARY";
+	HotKeyVariant["DISABLED"] = "DISABLED";
+	return HotKeyVariant;
+}({});
+var _exp = () => ({ $variant, theme }) => {
+	return match($variant).with("BASE", () => theme.color.background.base).with("PRIMARY", () => theme.color.background.primary).with("SECONDARY", () => theme.color.background.secondary).with("TERTIARY", () => theme.color.background.tertiary).with("DISABLED", () => theme.color.background.secondary).with(void 0, () => theme.color.background.tertiary).exhaustive();
+};
+var _exp2 = () => ({ $variant, theme }) => {
+	return match($variant).with("BASE", () => theme.color.border.primary).with("PRIMARY", () => theme.color.border.primary).with("SECONDARY", () => theme.color.border.primary).with("TERTIARY", () => theme.color.border.primary).with("DISABLED", () => theme.color.border.primary).with(void 0, () => theme.color.border.primary).exhaustive();
+};
+var _exp3 = () => ({ $variant, theme }) => {
+	return match($variant).with("DISABLED", () => theme.color.text.disabled).otherwise(() => theme.color.text.secondary);
+};
+var _exp4 = () => ({ theme }) => theme.font.sans.size.body_sm;
+var _exp5 = () => ({ theme }) => theme.font.sans.height.body_sm;
+var _exp6 = () => ({ theme }) => theme.font.sans.weight.regular;
+var _exp7 = () => ({ theme }) => theme.font.sans.family;
+var StyledHotKeySymbol = withTheme(/*#__PURE__*/ styled("div")({
+	name: "StyledHotKeySymbol",
+	class: "s12p8yma",
+	propsAsIs: false,
+	vars: {
+		"s12p8yma-0": [_exp()],
+		"s12p8yma-1": [_exp2()],
+		"s12p8yma-2": [_exp3()],
+		"s12p8yma-3": [_exp4()],
+		"s12p8yma-4": [_exp5()],
+		"s12p8yma-5": [_exp6()],
+		"s12p8yma-6": [_exp7()]
+	}
+}));
+var HotKeySymbol = ({ variant, hotKey }) => {
+	return /* @__PURE__ */ jsx(StyledHotKeySymbol, {
+		$variant: variant,
+		children: hotKey
+	});
+};
+//#endregion
+export { HotKeyVariant, HotKeySymbol as default };

package/dist/icons/BackIcon.d.ts

@@ -0,0 +1,3 @@
+import { type IconProps } from "./Icon";
+declare const BackIcon: ({ size, ...props }: Omit<IconProps, "component">) => import("react").JSX.Element;
+export default BackIcon;

package/dist/icons/BackIcon.js

@@ -0,0 +1,13 @@
+import Icon from "./Icon.js";
+import { jsx } from "react/jsx-runtime";
+import { ArrowLeftIcon } from "@phosphor-icons/react";
+//#region src/icons/BackIcon.tsx
+var BackIcon = ({ size = 12, ...props }) => {
+	return /* @__PURE__ */ jsx(Icon, {
+		component: ArrowLeftIcon,
+		size,
+		...props
+	});
+};
+//#endregion
+export { BackIcon as default };

package/dist/icons/CloseIcon.d.ts

@@ -0,0 +1,3 @@
+import { type IconProps } from "./Icon";
+declare const CloseIcon: ({ size, ...props }: Omit<IconProps, "component">) => import("react").JSX.Element;
+export default CloseIcon;

package/dist/icons/CloseIcon.js

@@ -0,0 +1,13 @@
+import Icon from "./Icon.js";
+import { jsx } from "react/jsx-runtime";
+import { XIcon } from "@phosphor-icons/react";
+//#region src/icons/CloseIcon.tsx
+var CloseIcon = ({ size = 12, ...props }) => {
+	return /* @__PURE__ */ jsx(Icon, {
+		component: XIcon,
+		size,
+		...props
+	});
+};
+//#endregion
+export { CloseIcon as default };

package/dist/icons/CreateIcon.d.ts

@@ -0,0 +1,3 @@
+import { type IconProps } from "./Icon";
+declare const CreateIcon: ({ size, ...props }: Omit<IconProps, "component">) => import("react").JSX.Element;
+export default CreateIcon;

package/dist/icons/CreateIcon.js

@@ -0,0 +1,13 @@
+import Icon from "./Icon.js";
+import { jsx } from "react/jsx-runtime";
+import { PlusIcon } from "@phosphor-icons/react";
+//#region src/icons/CreateIcon.tsx
+var CreateIcon = ({ size = 12, ...props }) => {
+	return /* @__PURE__ */ jsx(Icon, {
+		component: PlusIcon,
+		size,
+		...props
+	});
+};
+//#endregion
+export { CreateIcon as default };

package/dist/icons/ForwardIcon.d.ts

@@ -0,0 +1,3 @@
+import { type IconProps } from "./Icon";
+declare const ForwardIcon: ({ size, ...props }: Omit<IconProps, "component">) => import("react").JSX.Element;
+export default ForwardIcon;

package/dist/icons/ForwardIcon.js

@@ -0,0 +1,13 @@
+import Icon from "./Icon.js";
+import { jsx } from "react/jsx-runtime";
+import { ArrowRightIcon } from "@phosphor-icons/react";
+//#region src/icons/ForwardIcon.tsx
+var ForwardIcon = ({ size = 12, ...props }) => {
+	return /* @__PURE__ */ jsx(Icon, {
+		component: ArrowRightIcon,
+		size,
+		...props
+	});
+};
+//#endregion
+export { ForwardIcon as default };

package/dist/icons/GalaxyLogomark.d.ts

@@ -0,0 +1,5 @@
+declare const GalaxyLogomark: ({ height, isDark }: {
+    height: number;
+    isDark?: boolean;
+}) => import("react").JSX.Element;
+export default GalaxyLogomark;

package/dist/icons/GalaxyLogomark.js

@@ -0,0 +1,21 @@
+import { GalaxyTheme } from "../theme/constants.js";
+import { useGalaxyTheme } from "../theme/GalaxyTheme.js";
+import SvgGalaxyLogomarkDark from "../assets/components/GalaxyLogomarkDark.js";
+import SvgGalaxyLogomarkLight from "../assets/components/GalaxyLogomarkLight.js";
+import { match } from "ts-pattern";
+import { useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/icons/GalaxyLogomark.tsx
+var GalaxyLogomark = ({ height, isDark }) => {
+	const { galaxyTheme } = useGalaxyTheme();
+	return useMemo(() => {
+		if (isDark) return /* @__PURE__ */ jsx(SvgGalaxyLogomarkDark, { height });
+		return match(galaxyTheme).with(GalaxyTheme.DARK, () => /* @__PURE__ */ jsx(SvgGalaxyLogomarkLight, { height })).with(GalaxyTheme.LIGHT, () => /* @__PURE__ */ jsx(SvgGalaxyLogomarkDark, { height })).exhaustive();
+	}, [
+		height,
+		isDark,
+		galaxyTheme
+	]);
+};
+//#endregion
+export { GalaxyLogomark as default };

package/dist/icons/GalaxyLogomark3D.d.ts

@@ -0,0 +1,41 @@
+import { PresetsType } from "@react-three/drei/helpers/environment-assets";
+export interface LightConfig {
+    intensity?: number;
+    color?: string;
+}
+export interface MaterialConfig {
+    metalness?: number;
+    roughness?: number;
+    transmission?: number;
+    thickness?: number;
+    ior?: number;
+    envMapIntensity?: number;
+    clearcoat?: number;
+    clearcoatRoughness?: number;
+    sheen?: number;
+    sheenRoughness?: number;
+    sheenColor?: string;
+}
+interface GalaxyLogomark3DProps {
+    height: number | string;
+    isDark?: boolean;
+    isAutoRotate?: boolean;
+    isInteractive?: boolean;
+    isHoverable?: boolean;
+    speed?: number;
+    /** Backlight configuration (enables dramatic mode when provided) */
+    backlight?: LightConfig;
+    /** Spotlight configuration (enables dramatic mode when provided) */
+    spotlight?: LightConfig;
+    /** Fill light configuration (enables dramatic mode when provided) */
+    fillLight?: LightConfig;
+    /** Override material properties */
+    material?: MaterialConfig;
+    /** Override mesh color (bypasses theme) */
+    color?: string;
+    /** Environment preset (default: 'studio', or 'night' in dramatic mode) */
+    environmentPreset?: PresetsType;
+}
+declare const GalaxyLogomark3D: ({ height, isDark, isAutoRotate, isInteractive, isHoverable, speed, backlight, spotlight, fillLight, material, color: colorOverride, environmentPreset, }: GalaxyLogomark3DProps) => import("react").JSX.Element;
+export default GalaxyLogomark3D;
+export type { GalaxyLogomark3DProps };