@pathscale/ui 0.0.141 → 0.0.142

package/dist/components/confirm-dialog/ConfirmDialog.d.ts

@@ -0,0 +1,14 @@
+import type { JSX } from "solid-js";
+import type { ComponentColor, IComponentBaseProps } from "../types";
+export type ConfirmDialogProps = IComponentBaseProps & {
+    open: boolean;
+    onClose: () => void;
+    onConfirm: () => void;
+    title: string;
+    message?: JSX.Element;
+    confirmText?: string;
+    cancelText?: string;
+    confirmColor?: ComponentColor;
+    loading?: boolean;
+};
+export default function ConfirmDialog(props: ConfirmDialogProps): JSX.Element;

package/dist/components/confirm-dialog/index.d.ts

@@ -0,0 +1,2 @@
+export { default as ConfirmDialog } from "./ConfirmDialog";
+export type { ConfirmDialogProps } from "./ConfirmDialog";

package/dist/components/dropdown/DropdownItem.d.ts

@@ -13,7 +13,9 @@ type NoAnchorProps = {
     closeOnClick?: boolean;
 };
 export type DropdownItemProps = (AnchorProps | ButtonProps | NoAnchorProps) & {
+    id?: string;
     "aria-selected"?: boolean;
+    role?: JSX.HTMLAttributes<HTMLLIElement>["role"];
 };
 declare const DropdownItem: (props: DropdownItemProps) => JSX.Element;
 export default DropdownItem;

package/dist/components/dropdown/DropdownMenu.d.ts

@@ -3,6 +3,7 @@ import type { IComponentBaseProps } from "../types";
 export type DropdownMenuProps = JSX.HTMLAttributes<HTMLUListElement> & IComponentBaseProps & {
     id?: string;
     hideOverflow?: boolean;
+    role?: string;
     "aria-labelledby"?: string;
 };
 declare const DropdownMenu: (props: DropdownMenuProps) => JSX.Element;

package/dist/components/dropdown/DropdownToggle.d.ts

@@ -10,6 +10,7 @@ export type DropdownToggleProps = Omit<JSX.LabelHTMLAttributes<HTMLLabelElement>
     "aria-haspopup"?: boolean | "menu" | "listbox" | "dialog" | "grid" | "tree";
     "aria-expanded"?: boolean;
     "aria-controls"?: string;
+    "aria-activedescendant"?: string;
 };
 declare const DropdownToggle: (props: DropdownToggleProps) => JSX.Element;
 export type SummaryProps = JSX.HTMLAttributes<HTMLElement>;

package/dist/components/dropdown-select/DropdownSelect.d.ts

@@ -0,0 +1,20 @@
+import { type JSX } from "solid-js";
+import type { ComponentSize, IComponentBaseProps } from "../types";
+export type DropdownSelectOption = {
+    label: string;
+    value: string;
+    disabled?: boolean;
+};
+export type DropdownSelectProps = IComponentBaseProps & {
+    options: DropdownSelectOption[];
+    value?: string;
+    onChange?: (value: string) => void;
+    label?: string;
+    placeholder?: string;
+    disabled?: boolean;
+    showCheckmark?: boolean;
+    size?: ComponentSize;
+    "aria-label"?: string;
+};
+declare const DropdownSelect: (props: DropdownSelectProps) => JSX.Element;
+export default DropdownSelect;

package/dist/components/dropdown-select/index.d.ts

@@ -0,0 +1,2 @@
+export { default as DropdownSelect } from "./DropdownSelect";
+export type { DropdownSelectProps, DropdownSelectOption } from "./DropdownSelect";

package/dist/components/duration-badge/DurationBadge.d.ts

@@ -0,0 +1,14 @@
+import { type JSX } from "solid-js";
+import type { ComponentColor, IComponentBaseProps } from "../types";
+export interface DurationBadgeProps extends IComponentBaseProps {
+    /** Duration in seconds */
+    duration: number;
+    /** Badge color, default "error" */
+    color?: ComponentColor;
+    /** Show pulsing dot, default true */
+    pulseDot?: boolean;
+    /** Optional label before the time */
+    label?: string;
+}
+declare const DurationBadge: (props: DurationBadgeProps) => JSX.Element;
+export default DurationBadge;

package/dist/components/duration-badge/index.d.ts

@@ -0,0 +1,2 @@
+export { default as DurationBadge } from "./DurationBadge";
+export type { DurationBadgeProps } from "./DurationBadge";

package/dist/components/empty-state/EmptyState.d.ts

@@ -0,0 +1,10 @@
+import { type JSX, type Component } from "solid-js";
+import type { IComponentBaseProps } from "../types";
+export type EmptyStateProps = IComponentBaseProps & Omit<JSX.HTMLAttributes<HTMLDivElement>, "title"> & {
+    icon?: string;
+    iconSize?: number;
+    title?: JSX.Element;
+    description?: JSX.Element;
+};
+declare const EmptyState: Component<EmptyStateProps>;
+export default EmptyState;

package/dist/components/empty-state/index.d.ts

@@ -0,0 +1,2 @@
+export { default as EmptyState } from "./EmptyState";
+export type { EmptyStateProps } from "./EmptyState";

package/dist/components/form-actions/FormActions.d.ts

@@ -0,0 +1,14 @@
+import { type JSX } from "solid-js";
+import type { IComponentBaseProps } from "../types";
+export type FormActionsLayout = "single" | "split" | "center";
+export type FormActionsProps = IComponentBaseProps & {
+    submitText?: string;
+    cancelText?: string;
+    isLoading?: boolean;
+    isValid?: boolean;
+    onCancel?: () => void;
+    layout?: FormActionsLayout;
+    children?: JSX.Element;
+} & Omit<JSX.HTMLAttributes<HTMLDivElement>, "children">;
+declare const FormActions: (props: FormActionsProps) => JSX.Element;
+export default FormActions;

package/dist/components/form-actions/index.d.ts

@@ -0,0 +1,2 @@
+export { default as FormActions } from "./FormActions";
+export type { FormActionsProps } from "./FormActions";

package/dist/components/form-section/FormSection.d.ts

@@ -0,0 +1,9 @@
+import { type JSX } from "solid-js";
+import type { IComponentBaseProps, ComponentSize } from "../types";
+export type FormSectionGap = ComponentSize | "none";
+export type FormSectionProps = IComponentBaseProps & JSX.HTMLAttributes<HTMLDivElement> & {
+    title?: string;
+    gap?: FormSectionGap;
+};
+declare const FormSection: (props: FormSectionProps) => JSX.Element;
+export default FormSection;

package/dist/components/form-section/index.d.ts

@@ -0,0 +1,2 @@
+export { default as FormSection } from "./FormSection";
+export type { FormSectionProps } from "./FormSection";

package/dist/components/form-status/FormStatus.d.ts

@@ -0,0 +1,10 @@
+import { type JSX, type Component } from "solid-js";
+import type { IComponentBaseProps } from "../types";
+export type FormStatusProps = IComponentBaseProps & Omit<JSX.HTMLAttributes<HTMLDivElement>, "role"> & {
+    error?: string | null;
+    success?: string | null;
+    loading?: boolean;
+    loadingMessage?: string;
+};
+declare const FormStatus: Component<FormStatusProps>;
+export default FormStatus;

package/dist/components/form-status/index.d.ts

@@ -0,0 +1,2 @@
+export { default as FormStatus } from "./FormStatus";
+export type { FormStatusProps } from "./FormStatus";

package/dist/components/glow-card/GlowCard.d.ts

@@ -0,0 +1,5 @@
+import { type JSX } from "solid-js";
+import type { IComponentBaseProps } from "../types";
+import "./GlowCard.css";
+export type GlowCardProps = IComponentBaseProps & JSX.HTMLAttributes<HTMLDivElement>;
+export default function GlowCard(props: GlowCardProps): JSX.Element;

package/dist/components/glow-card/index.d.ts

@@ -0,0 +1,2 @@
+export { default as GlowCard } from "./GlowCard";
+export type { GlowCardProps } from "./GlowCard";

package/dist/components/level-meter/LevelMeter.d.ts

@@ -0,0 +1,10 @@
+import type { JSX } from "solid-js";
+import type { ComponentColor, IComponentBaseProps } from "../types";
+export type LevelMeterProps = IComponentBaseProps & {
+    level: number;
+    color?: ComponentColor;
+    direction?: "vertical" | "horizontal";
+    "aria-label"?: string;
+} & Omit<JSX.HTMLAttributes<HTMLDivElement>, "role">;
+declare const LevelMeter: (props: LevelMeterProps) => JSX.Element;
+export default LevelMeter;

package/dist/components/level-meter/index.d.ts

@@ -0,0 +1,2 @@
+export { default as LevelMeter } from "./LevelMeter";
+export type { LevelMeterProps } from "./LevelMeter";

package/dist/components/media-toggle-controls/MediaToggleControls.d.ts

@@ -0,0 +1,15 @@
+import { type Accessor, type Component } from "solid-js";
+import type { ComponentSize, IComponentBaseProps } from "../types";
+export interface MediaToggleControlsProps extends IComponentBaseProps {
+    isAudioEnabled: Accessor<boolean>;
+    isVideoEnabled: Accessor<boolean>;
+    onToggleAudio: () => void;
+    onToggleVideo: () => void;
+    size?: ComponentSize;
+    disabled?: boolean;
+    class?: string;
+    className?: string;
+    style?: any;
+}
+declare const MediaToggleControls: Component<MediaToggleControlsProps>;
+export default MediaToggleControls;

package/dist/components/media-toggle-controls/index.d.ts

@@ -0,0 +1,2 @@
+export { default as MediaToggleControls } from "./MediaToggleControls";
+export type { MediaToggleControlsProps } from "./MediaToggleControls";

package/dist/components/radio-group/RadioGroup.d.ts

@@ -0,0 +1,24 @@
+import { type JSX } from "solid-js";
+import type { ComponentColor, ComponentSize, IComponentBaseProps } from "../types";
+export type RadioGroupOption = {
+    value: string;
+    label: string;
+    disabled?: boolean;
+};
+type RadioGroupBaseProps = {
+    name: string;
+    label?: string;
+    options: RadioGroupOption[];
+    value?: string;
+    onChange?: (value: string) => void;
+    size?: ComponentSize;
+    color?: ComponentColor;
+    direction?: "horizontal" | "vertical";
+    dataTheme?: string;
+    class?: string;
+    className?: string;
+    style?: JSX.CSSProperties;
+};
+export type RadioGroupProps = RadioGroupBaseProps & IComponentBaseProps;
+declare const RadioGroup: (props: RadioGroupProps) => JSX.Element;
+export default RadioGroup;

package/dist/components/radio-group/index.d.ts

@@ -0,0 +1 @@
+export { default as RadioGroup, type RadioGroupProps, type RadioGroupOption } from "./RadioGroup";

package/dist/components/range-slider/RangeSlider.d.ts

@@ -0,0 +1,21 @@
+import { type JSX } from "solid-js";
+import type { ComponentColor, ComponentSize, IComponentBaseProps } from "../types";
+type RangeSliderBaseProps = {
+    label: string;
+    value: number;
+    onChange: (value: number) => void;
+    min?: number;
+    max?: number;
+    step?: number;
+    disabled?: boolean;
+    formatValue?: (value: number) => string;
+    color?: ComponentColor;
+    size?: ComponentSize;
+    dataTheme?: string;
+    class?: string;
+    className?: string;
+    style?: JSX.CSSProperties;
+};
+export type RangeSliderProps = RangeSliderBaseProps & IComponentBaseProps & Omit<JSX.InputHTMLAttributes<HTMLInputElement>, keyof RangeSliderBaseProps>;
+declare const RangeSlider: (props: RangeSliderProps) => JSX.Element;
+export default RangeSlider;

package/dist/components/range-slider/index.d.ts

@@ -0,0 +1,2 @@
+export { default as RangeSlider } from "./RangeSlider";
+export type { RangeSliderProps } from "./RangeSlider";

package/dist/components/section-card/SectionCard.d.ts

@@ -0,0 +1,10 @@
+import { type JSX } from "solid-js";
+import type { IComponentBaseProps } from "../types";
+export type SectionCardPadding = "default" | "tight" | "none";
+export type SectionCardProps = IComponentBaseProps & JSX.HTMLAttributes<HTMLElement> & {
+    title?: string;
+    actions?: JSX.Element;
+    padding?: SectionCardPadding;
+};
+declare const SectionCard: (props: SectionCardProps) => JSX.Element;
+export default SectionCard;

package/dist/components/section-card/index.d.ts

@@ -0,0 +1,2 @@
+export { default as SectionCard } from "./SectionCard";
+export type { SectionCardProps } from "./SectionCard";

package/dist/components/skip-link/SkipLink.d.ts

@@ -0,0 +1,7 @@
+import { type JSX } from "solid-js";
+export type SkipLinkProps = {
+    href?: string;
+    children?: JSX.Element;
+    class?: string;
+} & Omit<JSX.AnchorHTMLAttributes<HTMLAnchorElement>, "href" | "children" | "class">;
+export default function SkipLink(props: SkipLinkProps): JSX.Element;

package/dist/components/skip-link/index.d.ts

@@ -0,0 +1,2 @@
+export { default as SkipLink } from "./SkipLink";
+export type { SkipLinkProps } from "./SkipLink";

package/dist/components/toggle-setting/ToggleSetting.d.ts

@@ -0,0 +1,17 @@
+import { type JSX } from "solid-js";
+import type { ComponentSize, IComponentBaseProps } from "../types";
+type ToggleSettingBaseProps = {
+    label: string;
+    description?: string;
+    checked?: boolean;
+    onChange?: (checked: boolean) => void;
+    disabled?: boolean;
+    size?: ComponentSize;
+    dataTheme?: string;
+    class?: string;
+    className?: string;
+    style?: JSX.CSSProperties;
+};
+export type ToggleSettingProps = ToggleSettingBaseProps & IComponentBaseProps;
+declare const ToggleSetting: (props: ToggleSettingProps) => JSX.Element;
+export default ToggleSetting;

package/dist/components/toggle-setting/index.d.ts

@@ -0,0 +1,2 @@
+export { default as ToggleSetting } from "./ToggleSetting";
+export type { ToggleSettingProps } from "./ToggleSetting";

package/dist/components/video-preview/VideoPreview.d.ts

@@ -0,0 +1,21 @@
+import { type Accessor, type Component, type JSX } from "solid-js";
+import type { IComponentBaseProps } from "../types";
+type VideoPreviewBaseProps = {
+    /**
+     * Reactive accessor for the MediaStream to display
+     */
+    stream: Accessor<MediaStream | null>;
+    /**
+     * Whether the video should be muted
+     * @default true
+     */
+    muted?: boolean;
+    /**
+     * Whether to mirror the video (applies scaleX(-1))
+     * @default false
+     */
+    mirror?: boolean;
+};
+export type VideoPreviewProps = VideoPreviewBaseProps & IComponentBaseProps & Omit<JSX.VideoHTMLAttributes<HTMLVideoElement>, keyof VideoPreviewBaseProps>;
+export declare const VideoPreview: Component<VideoPreviewProps>;
+export default VideoPreview;

package/dist/components/video-preview/index.d.ts

@@ -0,0 +1,2 @@
+export { default as VideoPreview } from "./VideoPreview";
+export type { VideoPreviewProps } from "./VideoPreview";

package/dist/glow-card/GlowCard.css

@@ -0,0 +1,57 @@
+.glow-card {
+  --glow-color-border: oklch(100% 0 0 / 0.3);
+  --glow-color-bg: oklch(100% 0 0 / 0.1);
+  position: relative;
+  border-radius: inherit;
+}
+
+.glow-card::before,
+.glow-card::after {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  opacity: 0;
+  transition: opacity 0.3s ease;
+  pointer-events: none;
+}
+
+.glow-card::before {
+  background: radial-gradient(
+    250px circle at var(--mouse-x) var(--mouse-y),
+    var(--glow-color-border),
+    transparent 80%
+  );
+  z-index: 1;
+  inset: -1px;
+  -webkit-mask:
+    linear-gradient(#fff 0 0) content-box,
+    linear-gradient(#fff 0 0);
+  mask:
+    linear-gradient(#fff 0 0) content-box,
+    linear-gradient(#fff 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  padding: 1px;
+}
+
+.glow-card::after {
+  background: radial-gradient(
+    400px circle at var(--mouse-x) var(--mouse-y),
+    var(--glow-color-bg),
+    transparent 80%
+  );
+  z-index: 0;
+}
+
+.glow-card:hover::before,
+.glow-card:hover::after {
+  opacity: 1;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .glow-card::before,
+  .glow-card::after {
+    transition: none;
+  }
+}

package/dist/index.css

@@ -0,0 +1,48 @@
+.glow-card {
+  --glow-color-border: oklch(100% 0 0 / .3);
+  --glow-color-bg: oklch(100% 0 0 / .1);
+  border-radius: inherit;
+  position: relative;
+}
+
+.glow-card:before, .glow-card:after {
+  content: "";
+  border-radius: inherit;
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity .3s;
+  position: absolute;
+  inset: 0;
+}
+
+.glow-card:before {
+  background: radial-gradient(250px circle at var(--mouse-x) var(--mouse-y), var(--glow-color-border), transparent 80%);
+  z-index: 1;
+  -webkit-mask-composite: xor;
+  padding: 1px;
+  inset: -1px;
+  mask-image: linear-gradient(#fff 0 0), linear-gradient(#fff 0 0);
+  mask-position: 0 0, 0 0;
+  mask-size: auto, auto;
+  mask-repeat: repeat, repeat;
+  mask-clip: content-box, border-box;
+  mask-origin: content-box, border-box;
+  mask-composite: exclude;
+  mask-mode: match-source, match-source;
+}
+
+.glow-card:after {
+  background: radial-gradient(400px circle at var(--mouse-x) var(--mouse-y), var(--glow-color-bg), transparent 80%);
+  z-index: 0;
+}
+
+.glow-card:hover:before, .glow-card:hover:after {
+  opacity: 1;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .glow-card:before, .glow-card:after {
+    transition: none;
+  }
+}
+

package/dist/index.d.ts

@@ -20,6 +20,7 @@ export { AlphaSlider, ColorInput, ColorPickerContext, ColorPickerFlowerSelector,
 export type { AlphaSliderProps, ColorFormat, ColorInputProps, ColorPickerContextType, ColorPickerMode, ColorPickerProps, ColorPreviewProps, ColorSwatchesProps, ColorValue, ColorWheelFlowerProps, ColorWheelProps, HueSliderProps, LightnessSliderProps, SaturationBrightnessProps, } from "./components/colorpicker";
 export { CodeMockup, CodeMockupLine } from "./components/codemockup";
 export { Collapse, CollapseContent, CollapseDetails, CollapseTitle, Summary, } from "./components/collapse";
+export { ConfirmDialog, type ConfirmDialogProps } from "./components/confirm-dialog";
 export { default as ConnectionStatus } from "./components/connectionstatus";
 export type { ConnectionState, ConnectionStatusProps, } from "./components/connectionstatus";
 export { default as CopyButton } from "./components/copy-button";
@@ -29,14 +30,21 @@ export { default as Divider } from "./components/divider";
 export { default as Dock } from "./components/dock";
 export { default as Drawer, type DrawerProps } from "./components/drawer";
 export { default as Dropdown } from "./components/dropdown";
+export { DropdownSelect, type DropdownSelectProps, type DropdownSelectOption } from "./components/dropdown-select";
+export { DurationBadge, type DurationBadgeProps } from "./components/duration-badge";
+export { EmptyState, type EmptyStateProps } from "./components/empty-state";
 export { default as FileInput } from "./components/fileinput";
 export { default as FloatingDock } from "./components/floating-dock";
 export type { FloatingDockProps, FloatingDockItem, FloatingDockDirection } from "./components/floating-dock";
 export { default as Flex } from "./components/flex";
 export { default as GlassPanel } from "./components/glass-panel";
+export { GlowCard, type GlowCardProps } from "./components/glow-card";
 export type { GlassPanelProps, GlassPanelBlur } from "./components/glass-panel";
 export { default as Footer } from "./components/footer";
 export type { FooterProps, FooterTitleProps } from "./components/footer";
+export { FormActions, type FormActionsProps } from "./components/form-actions";
+export { FormSection, type FormSectionProps } from "./components/form-section";
+export { FormStatus, type FormStatusProps } from "./components/form-status";
 export { default as Form, useFormValidation } from "./components/form";
 export { useDesktop } from "./components/utils";
 export type { FormProps, LabelProps, ValidatedFormProps, } from "./components/form";
@@ -53,10 +61,12 @@ export { default as Kbd } from "./components/kbd";
 export { default as Link } from "./components/link";
 export { LiveChatBubble, LiveChatPanel, } from "./components/live-chat";
 export type { LiveChatBubbleProps, LiveChatPanelProps, ChatMessage, SendMessagePayload, SendMessageResponse, } from "./components/live-chat";
+export { LevelMeter, type LevelMeterProps } from "./components/level-meter";
 export { default as Loading } from "./components/loading";
 export { LanguageSwitcher, createI18n, I18nProvider, I18nContext, useI18n, } from "./components/language-switcher";
 export type { LanguageSwitcherProps, I18nStore, I18nOptions, I18nContextValue, I18nProviderProps, Language, } from "./components/language-switcher";
 export { default as Mask } from "./components/mask";
+export { MediaToggleControls, type MediaToggleControlsProps } from "./components/media-toggle-controls";
 export { Menu } from "./components/menu";
 export { default as Modal } from "./components/modal";
 export { default as Navbar } from "./components/navbar";
@@ -71,14 +81,18 @@ export { default as Progress } from "./components/progress";
 export { PropsTable } from "./components/props-table";
 export { default as RadialProgress } from "./components/radialprogress";
 export { default as Radio } from "./components/radio";
+export { RadioGroup, type RadioGroupProps, type RadioGroupOption } from "./components/radio-group";
 export { default as Range } from "./components/range";
+export { RangeSlider, type RangeSliderProps } from "./components/range-slider";
 export { Rating } from "./components/rating";
 export type { RatingHiddenProps, RatingItemProps, RatingProps, } from "./components/rating";
+export { SectionCard, type SectionCardProps } from "./components/section-card";
 export { default as Select } from "./components/select";
 export { ShowcaseSection } from "./components/showcase-section";
 export { default as ShowcaseBlock } from "./components/showcase/ShowcaseBlock";
 export { Sidenav, SidenavMenu, SidenavItem, SidenavGroup, SidenavLink, SidenavButton, } from "./components/sidenav";
 export { default as Skeleton } from "./components/skeleton";
+export { SkipLink, type SkipLinkProps } from "./components/skip-link";
 export { default as Stack } from "./components/stack";
 export { default as StatCard } from "./components/stat-card";
 export { default as Stats } from "./components/stats";
@@ -105,7 +119,9 @@ export { default as Toast } from "./components/toast";
 export { ToastContainer, ToastStack } from "./components/toastcontainer";
 export type { ToastRenderer, ToastStackProps, } from "./components/toastcontainer";
 export { default as Toggle } from "./components/toggle";
+export { ToggleSetting, type ToggleSettingProps } from "./components/toggle-setting";
 export { default as Tooltip } from "./components/tooltip";
+export { VideoPreview, type VideoPreviewProps } from "./components/video-preview";
 export { default as WindowMockup, type WindowMockupProps, } from "./components/windowmockup";
 export * from "./stores";
 export * from "./motion";