@togo-framework/ui 0.1.2 → 0.1.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +41 -1
- package/dist/index.js +122 -0
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -3917,4 +3917,44 @@ declare namespace CodeShowcase {
|
|
|
3917
3917
|
var displayName: string;
|
|
3918
3918
|
}
|
|
3919
3919
|
|
|
3920
|
-
|
|
3920
|
+
interface AuroraBackgroundProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
3921
|
+
/** Dim the orbs (0–1). Default 1. */
|
|
3922
|
+
intensity?: number;
|
|
3923
|
+
}
|
|
3924
|
+
declare function AuroraBackground({ className, intensity, style, ...rest }: AuroraBackgroundProps): React$1.JSX.Element;
|
|
3925
|
+
declare namespace AuroraBackground {
|
|
3926
|
+
var displayName: string;
|
|
3927
|
+
}
|
|
3928
|
+
interface GlassCardProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
3929
|
+
elevation?: "flat" | "raised" | "floating";
|
|
3930
|
+
hover?: boolean;
|
|
3931
|
+
}
|
|
3932
|
+
declare function GlassCard({ className, elevation, hover, children, ...rest }: GlassCardProps): React$1.JSX.Element;
|
|
3933
|
+
declare namespace GlassCard {
|
|
3934
|
+
var displayName: string;
|
|
3935
|
+
}
|
|
3936
|
+
interface RevealProps extends React$1.HTMLAttributes<HTMLDivElement> {
|
|
3937
|
+
delayMs?: number;
|
|
3938
|
+
as?: React$1.ElementType;
|
|
3939
|
+
}
|
|
3940
|
+
declare function Reveal({ className, delayMs, as: Tag, children, style, ...rest }: RevealProps): React$1.JSX.Element;
|
|
3941
|
+
declare namespace Reveal {
|
|
3942
|
+
var displayName: string;
|
|
3943
|
+
}
|
|
3944
|
+
interface MockupWindowProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "title"> {
|
|
3945
|
+
title?: React$1.ReactNode;
|
|
3946
|
+
}
|
|
3947
|
+
declare function MockupWindow({ className, title, children, ...rest }: MockupWindowProps): React$1.JSX.Element;
|
|
3948
|
+
declare namespace MockupWindow {
|
|
3949
|
+
var displayName: string;
|
|
3950
|
+
}
|
|
3951
|
+
interface PillButtonProps extends React$1.AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
3952
|
+
variant?: "flow" | "glass";
|
|
3953
|
+
size?: "md" | "lg";
|
|
3954
|
+
}
|
|
3955
|
+
declare function PillButton({ className, variant, size, children, ...rest }: PillButtonProps): React$1.JSX.Element;
|
|
3956
|
+
declare namespace PillButton {
|
|
3957
|
+
var displayName: string;
|
|
3958
|
+
}
|
|
3959
|
+
|
|
3960
|
+
export { type A2UIActionItem, type A2UIActionsData, type A2UIArtifact$1 as A2UIArtifact, type A2UICardData, type A2UICardField, type A2UIChartData, type A2UIChartSeries, type A2UIClientCandidate, type A2UIClientCandidatesData, type A2UIClientDiffConfirmData, type A2UIClientDiffRow, type A2UIClientField, type A2UIClientFieldPickerData, type A2UIKind, type A2UIMarkdownData, type A2UIPersonaStarter, type A2UIPersonaStartersData, type A2UITableColumn, type A2UITableData, type ActivityBucket, AdminLayout, type AdminLayoutProps, type AdminSubNavItem, AgentSteps, type AlertMapItem, type AlertSeverity, type AppBrand, AppHeader, type AppHeaderProps, AppLayout, type AppLayoutProps, type AppNavGroup, type AppNavItem, AppPageShell, type AppPageShellProps, AppSidebar, type AppSidebarProps, type AppearanceMode, ArtifactActions, type ArtifactActionsProps, ArtifactCard, type ArtifactCardProps, ArtifactChart, type ArtifactChartProps, ArtifactClientCandidates, type ArtifactClientCandidatesProps, ArtifactClientDiffConfirm, type ArtifactClientDiffConfirmProps, ArtifactClientFieldPicker, type ArtifactClientFieldPickerProps, type ArtifactInteraction, ArtifactMarkdown, type ArtifactMarkdownProps, ArtifactPersonaStarters, type ArtifactPersonaStartersProps, ArtifactRenderer, type ArtifactRendererProps, ArtifactTable, type ArtifactTableProps, ArtifactViewer, AuroraBackground, type AuroraBackgroundProps, AuthCard, type AuthCardBrand, type AuthClient, AuthErrorAlert, AuthFlow, type AuthLayout, AuthStepHeader, type BarPoint, type CardFilter, CardGrid, type CardGridLabels, ChatThread, CodeBlock, CodeShowcase, type CodeShowcaseProps, type CodeShowcaseTab, ColorPicker, type ColorPickerProps, ContextualSkeleton, type CopilotClient, type CopilotEvent, CopilotLauncher, CopilotProvider, type CopilotQuickAction, type CopilotRequest, CopilotSelectionTrigger, type CopilotSelectionTriggerProps, DEFAULT_LAYERS, DEFAULT_LEGEND_GROUPS, DEFAULT_REGION_PRESETS, DataState, type DataStateLabels, type DataStateProps, DataTable, type DataTableBulkAction, type DataTableColumnFilter, type DataTableColumnMeta, type DataTableDensity, type DataTableFilterType, type DataTableLanguage, type DataTableProps, type DataTableSelectOption, type DataTableServerCallbacks, type DataTableServerState, type DockPosition, DynamicIcon, DynamicSection, type DynamicSectionProps, EmptyState, type EmptyStateProps, EntityNetworkGraph, type EntityNetworkGraphProps, type ErrorFilter, ErrorTrackingPage, type ErrorTrackingPageProps, EventMapPanel, type EventMapPanelProps, Eyebrow, type EyebrowProps, FeatureCard, type FeatureCardProps, type FeedbackAttachment, FeedbackButton, type FeedbackButtonProps, FeedbackHub, type FeedbackHubProps, type FeedbackItem, type FeedbackKind, FeedbackWidget, type FeedbackWidgetProps, ForgotForm, GlassCard, type GlassCardProps, type GraphLink, type GraphNode, IconPicker, type IconPickerProps, type Issue$1 as Issue, type IssueAssignee, type IssueBreadcrumb, IssueDetail, type IssueDetailProps, type IssueLevel, type IssueSort, type IssueTag, IssuesList, type IssuesListProps, LANG_COOKIE_NAME, type LanguageContextValue, LanguageProvider, type LanguageProviderProps, type LegendGroup, type LegendItem, type LegendShapeType, LockScreen, type LockScreenProps, type LockScreenUser, type LogLevel, LoginForm, type LoginResult, Logo, type LogoProps, type LogoTone, type LogoVariant, type LogsFilter, LogsView, type LogsViewProps, MARKER_COLORS, MARKER_LABELS, type MapLayer, MapLayersPanel, type MapLayersPanelProps, MapLegend, type MapLegendProps, type MapMarker$1 as MapMarker, type MapMarkerType, MapPanel, type MapPanelProps, type MapRegionPreset, MapView, type MapViewProps, MarkdownContent, MarkdownEditor, type MarkdownEditorProps, MarkdownRenderer, type MarkdownRendererProps, MarkdownTable, type MarkdownView, MiniBarChart, MockupWindow, type MockupWindowProps, type ModelOption, MotorFeedbackLauncher, type MotorFeedbackLauncherProps, NestedStepsEditor, type NestedStepsEditorProps, NetworkGraph, type NetworkGraphProps, type NewFeedback, OTPBoxGroup, type OtpResult, PIPELINE_STAGES, PageHeader, type PageHeaderProps, PasswordInput, PasswordLockScreen, type PasswordLockScreenProps, type PasswordLockScreenUser, type PasswordRule, PasswordStrengthMeter, type PickedLocation, PillButton, type PillButtonProps, type PipelineCard, type PipelineLane, type PipelineModel, type PluginActivitySummary, type PluginAppearanceFields, PluginAppearanceSection, type PluginAppearanceSectionProps, PluginCard, type PluginCatalogEntry, type PluginDetailIdentity, PluginDetailLayout, type PluginDetailLayoutProps, type PluginDetailTab, PluginHero, PluginHeroSkeleton, PluginPageHeader, PluginSectionCard, PluginSparkline, type ProfileSession, ProfileView, type ProfileViewProps, type RenderMapContext, ResetForm, type ResolvedIcon, Reveal, type RevealProps, RouteProgress, type RouteProgressProps, STEP_FIELD_REGISTRY, SectionBoard, type SectionBoardProps, SectionHeading, type SectionHeadingProps, type SectionModel, SectionSkeleton, SentraLoading, type ServiceLogRow, ServiceUnavailable, type ServiceUnavailableProps, SessionExpired, type SessionExpiredProps, SeverityChip, type SidebarConversation, type SidebarUser, SourceBadge, type SparklinePoint, type StackFrame, type StackFrameContextLine, StatCard, type StatCardProps, StatusBadge, type StatusBadgeProps, type StatusBadgeTone, type Step, type StepFieldDef, type StepFieldType, type StepMetrics7d, StepOptionsDialog, type StepOptionsDialogProps, StreamingMessage, type TestRunCallbacks, type TestRunCompletePayload, TestRunPanel, type TestRunPanelProps, type TestRunSavedItem, type TestRunStep, TwoFAForm, UnifiedCopilotDock, type UnlockCredentials, type Verify2FAResult, type View, ViewToggle, type ViewToggleProps, Wordmark, type WordmarkProps, Workflow, WorkflowEditor, type WorkflowEditorProps, type WorkflowPalette, WorkflowPipeline, type WorkflowPipelineProps, type WorkflowProps, type WorkflowSource, type WorkflowStep, type WorkflowStepLike, WorkflowStepNode, type WorkflowStepNodeProps, type WorkflowView, cn, computeRules, computeScore, feedbackButtonVariants, levelTone, resolveIcon, statValueVariants, statusBadgeVariants, useCopilot, useLanguage, useT };
|
package/dist/index.js
CHANGED
|
@@ -15891,6 +15891,123 @@ function CodeShowcase({ tabs, className }) {
|
|
|
15891
15891
|
] });
|
|
15892
15892
|
}
|
|
15893
15893
|
CodeShowcase.displayName = "CodeShowcase";
|
|
15894
|
+
|
|
15895
|
+
// src/components/marketing/Glass.tsx
|
|
15896
|
+
import * as React29 from "react";
|
|
15897
|
+
import { jsx as jsx98, jsxs as jsxs86 } from "react/jsx-runtime";
|
|
15898
|
+
var DISPLAY2 = { fontFamily: '"Sora", var(--togo-font-body, ui-sans-serif, system-ui, sans-serif)' };
|
|
15899
|
+
function AuroraBackground({ className, intensity = 1, style, ...rest }) {
|
|
15900
|
+
return /* @__PURE__ */ jsxs86("div", { "aria-hidden": true, className: cn("pointer-events-none absolute inset-0 -z-10 overflow-hidden", className), style, ...rest, children: [
|
|
15901
|
+
/* @__PURE__ */ jsx98("style", { children: `
|
|
15902
|
+
@keyframes tg-aurora-a { 0%,100%{transform:translate3d(-6%,-4%,0) scale(1)} 50%{transform:translate3d(8%,6%,0) scale(1.15)} }
|
|
15903
|
+
@keyframes tg-aurora-b { 0%,100%{transform:translate3d(6%,8%,0) scale(1.1)} 50%{transform:translate3d(-8%,-6%,0) scale(.95)} }
|
|
15904
|
+
@keyframes tg-aurora-c { 0%,100%{transform:translate3d(0,0,0) scale(1.05)} 50%{transform:translate3d(-10%,4%,0) scale(1.2)} }
|
|
15905
|
+
.tg-orb{position:absolute;border-radius:9999px;filter:blur(70px);opacity:${0.5 * intensity};mix-blend-mode:screen}
|
|
15906
|
+
@media (prefers-reduced-motion: reduce){ .tg-orb{animation:none!important} }
|
|
15907
|
+
` }),
|
|
15908
|
+
/* @__PURE__ */ jsx98("div", { className: "tg-orb", style: { width: "46vw", height: "46vw", top: "-12%", left: "8%", background: "radial-gradient(circle, #1FC7DC, transparent 65%)", animation: "tg-aurora-a 22s ease-in-out infinite" } }),
|
|
15909
|
+
/* @__PURE__ */ jsx98("div", { className: "tg-orb", style: { width: "50vw", height: "50vw", top: "-18%", right: "2%", background: "radial-gradient(circle, #2D8CE6, transparent 65%)", animation: "tg-aurora-b 26s ease-in-out infinite" } }),
|
|
15910
|
+
/* @__PURE__ */ jsx98("div", { className: "tg-orb", style: { width: "42vw", height: "42vw", top: "20%", left: "30%", background: "radial-gradient(circle, #1659C8, transparent 68%)", animation: "tg-aurora-c 30s ease-in-out infinite" } }),
|
|
15911
|
+
/* @__PURE__ */ jsx98(
|
|
15912
|
+
"div",
|
|
15913
|
+
{
|
|
15914
|
+
className: "absolute inset-0 opacity-[0.35]",
|
|
15915
|
+
style: {
|
|
15916
|
+
backgroundImage: "linear-gradient(rgba(120,140,160,.10) 1px,transparent 1px),linear-gradient(90deg,rgba(120,140,160,.10) 1px,transparent 1px)",
|
|
15917
|
+
backgroundSize: "56px 56px",
|
|
15918
|
+
maskImage: "radial-gradient(900px 600px at 50% 0%, #000, transparent 80%)",
|
|
15919
|
+
WebkitMaskImage: "radial-gradient(900px 600px at 50% 0%, #000, transparent 80%)"
|
|
15920
|
+
}
|
|
15921
|
+
}
|
|
15922
|
+
)
|
|
15923
|
+
] });
|
|
15924
|
+
}
|
|
15925
|
+
AuroraBackground.displayName = "AuroraBackground";
|
|
15926
|
+
function GlassCard({ className, elevation = "raised", hover = false, children, ...rest }) {
|
|
15927
|
+
const shadow = elevation === "floating" ? "shadow-[0_30px_80px_-30px_rgba(0,0,0,.7)]" : elevation === "raised" ? "shadow-[0_16px_50px_-24px_rgba(0,0,0,.6)]" : "";
|
|
15928
|
+
return /* @__PURE__ */ jsx98(
|
|
15929
|
+
"div",
|
|
15930
|
+
{
|
|
15931
|
+
className: cn(
|
|
15932
|
+
"relative rounded-2xl border border-white/10 bg-white/[0.04] backdrop-blur-xl",
|
|
15933
|
+
"before:pointer-events-none before:absolute before:inset-0 before:rounded-2xl before:p-px",
|
|
15934
|
+
"before:[background:linear-gradient(140deg,rgba(255,255,255,.18),rgba(255,255,255,0)_40%)]",
|
|
15935
|
+
"before:[mask:linear-gradient(#000,#000)_content-box,linear-gradient(#000,#000)] before:[mask-composite:exclude]",
|
|
15936
|
+
shadow,
|
|
15937
|
+
hover && "transition-transform duration-300 hover:-translate-y-1",
|
|
15938
|
+
className
|
|
15939
|
+
),
|
|
15940
|
+
...rest,
|
|
15941
|
+
children
|
|
15942
|
+
}
|
|
15943
|
+
);
|
|
15944
|
+
}
|
|
15945
|
+
GlassCard.displayName = "GlassCard";
|
|
15946
|
+
function Reveal({ className, delayMs = 0, as: Tag = "div", children, style, ...rest }) {
|
|
15947
|
+
const ref = React29.useRef(null);
|
|
15948
|
+
const [state, setState] = React29.useState("static");
|
|
15949
|
+
React29.useEffect(() => {
|
|
15950
|
+
const el = ref.current;
|
|
15951
|
+
if (!el) return;
|
|
15952
|
+
const noMotion = typeof window !== "undefined" && (navigator.webdriver || window.matchMedia?.("(prefers-reduced-motion: reduce)").matches || !("IntersectionObserver" in window));
|
|
15953
|
+
if (noMotion) return;
|
|
15954
|
+
const rect = el.getBoundingClientRect();
|
|
15955
|
+
if (rect.top < window.innerHeight * 0.92 && rect.bottom > 0) {
|
|
15956
|
+
setState("shown");
|
|
15957
|
+
return;
|
|
15958
|
+
}
|
|
15959
|
+
setState("hidden");
|
|
15960
|
+
const io = new IntersectionObserver(
|
|
15961
|
+
(entries) => entries.forEach((e) => {
|
|
15962
|
+
if (e.isIntersecting) {
|
|
15963
|
+
setState("shown");
|
|
15964
|
+
io.disconnect();
|
|
15965
|
+
}
|
|
15966
|
+
}),
|
|
15967
|
+
{ threshold: 0.12, rootMargin: "0px 0px -8% 0px" }
|
|
15968
|
+
);
|
|
15969
|
+
io.observe(el);
|
|
15970
|
+
return () => io.disconnect();
|
|
15971
|
+
}, []);
|
|
15972
|
+
const motion = state === "static" ? "" : state === "hidden" ? "opacity-0 translate-y-5" : "opacity-100 translate-y-0";
|
|
15973
|
+
return /* @__PURE__ */ jsx98(
|
|
15974
|
+
Tag,
|
|
15975
|
+
{
|
|
15976
|
+
ref,
|
|
15977
|
+
style: { transitionDelay: `${delayMs}ms`, ...style },
|
|
15978
|
+
className: cn("transition-all duration-[700ms] ease-out will-change-[opacity,transform]", motion, className),
|
|
15979
|
+
...rest,
|
|
15980
|
+
children
|
|
15981
|
+
}
|
|
15982
|
+
);
|
|
15983
|
+
}
|
|
15984
|
+
Reveal.displayName = "Reveal";
|
|
15985
|
+
function MockupWindow({ className, title, children, ...rest }) {
|
|
15986
|
+
return /* @__PURE__ */ jsxs86(GlassCard, { elevation: "floating", className: cn("overflow-hidden", className), ...rest, children: [
|
|
15987
|
+
/* @__PURE__ */ jsxs86("div", { className: "flex items-center gap-2 px-4 py-3 border-b border-white/10 bg-white/[0.03]", children: [
|
|
15988
|
+
/* @__PURE__ */ jsx98("span", { className: "h-3 w-3 rounded-full bg-[#ff5f57]" }),
|
|
15989
|
+
/* @__PURE__ */ jsx98("span", { className: "h-3 w-3 rounded-full bg-[#febc2e]" }),
|
|
15990
|
+
/* @__PURE__ */ jsx98("span", { className: "h-3 w-3 rounded-full bg-[#28c840]" }),
|
|
15991
|
+
title ? /* @__PURE__ */ jsx98("span", { className: "ms-2 font-mono text-xs text-muted-foreground truncate", children: title }) : null
|
|
15992
|
+
] }),
|
|
15993
|
+
/* @__PURE__ */ jsx98("div", { className: "bg-[#080b0f]/80", children })
|
|
15994
|
+
] });
|
|
15995
|
+
}
|
|
15996
|
+
MockupWindow.displayName = "MockupWindow";
|
|
15997
|
+
function PillButton({ className, variant = "flow", size = "lg", children, ...rest }) {
|
|
15998
|
+
const sz = size === "lg" ? "h-[52px] px-7 text-base" : "h-11 px-5 text-sm";
|
|
15999
|
+
const look = variant === "flow" ? "text-white shadow-[0_12px_34px_-10px_rgba(22,89,200,.7)] hover:-translate-y-0.5" : "text-foreground border border-white/15 bg-white/[0.06] backdrop-blur-md hover:bg-white/[0.1]";
|
|
16000
|
+
return /* @__PURE__ */ jsx98(
|
|
16001
|
+
"a",
|
|
16002
|
+
{
|
|
16003
|
+
style: variant === "flow" ? { backgroundImage: "linear-gradient(110deg,#1FC7DC,#2D8CE6 50%,#1659C8)", ...DISPLAY2 } : DISPLAY2,
|
|
16004
|
+
className: cn("inline-flex items-center justify-center gap-2 rounded-full font-semibold transition-all duration-200", sz, look, className),
|
|
16005
|
+
...rest,
|
|
16006
|
+
children
|
|
16007
|
+
}
|
|
16008
|
+
);
|
|
16009
|
+
}
|
|
16010
|
+
PillButton.displayName = "PillButton";
|
|
15894
16011
|
export {
|
|
15895
16012
|
Accordion,
|
|
15896
16013
|
AccordionContent,
|
|
@@ -15928,6 +16045,7 @@ export {
|
|
|
15928
16045
|
ArtifactTable,
|
|
15929
16046
|
ArtifactViewer_default as ArtifactViewer,
|
|
15930
16047
|
AspectRatio,
|
|
16048
|
+
AuroraBackground,
|
|
15931
16049
|
AuthCard_default as AuthCard,
|
|
15932
16050
|
AuthErrorAlert_default as AuthErrorAlert,
|
|
15933
16051
|
AuthFlow_default as AuthFlow,
|
|
@@ -16061,6 +16179,7 @@ export {
|
|
|
16061
16179
|
FormItem,
|
|
16062
16180
|
FormLabel,
|
|
16063
16181
|
FormMessage,
|
|
16182
|
+
GlassCard,
|
|
16064
16183
|
HoverCard,
|
|
16065
16184
|
HoverCardContent,
|
|
16066
16185
|
HoverCardTrigger,
|
|
@@ -16107,6 +16226,7 @@ export {
|
|
|
16107
16226
|
MenubarSubTrigger,
|
|
16108
16227
|
MenubarTrigger,
|
|
16109
16228
|
MiniBarChart,
|
|
16229
|
+
MockupWindow,
|
|
16110
16230
|
MotorFeedbackLauncher,
|
|
16111
16231
|
NativeSelect,
|
|
16112
16232
|
NavigationMenu,
|
|
@@ -16132,6 +16252,7 @@ export {
|
|
|
16132
16252
|
PasswordInput_default as PasswordInput,
|
|
16133
16253
|
PasswordLockScreen_default as PasswordLockScreen,
|
|
16134
16254
|
PasswordStrengthMeter_default as PasswordStrengthMeter,
|
|
16255
|
+
PillButton,
|
|
16135
16256
|
PluginAppearanceSection,
|
|
16136
16257
|
PluginCard,
|
|
16137
16258
|
PluginDetailLayout,
|
|
@@ -16151,6 +16272,7 @@ export {
|
|
|
16151
16272
|
ResizableHandle,
|
|
16152
16273
|
ResizablePanel,
|
|
16153
16274
|
ResizablePanelGroup,
|
|
16275
|
+
Reveal,
|
|
16154
16276
|
RouteProgress,
|
|
16155
16277
|
SENTRA_BRAND,
|
|
16156
16278
|
STEP_FIELD_REGISTRY,
|