@ucdjs-internal/shared-ui 0.1.0

package/dist/styles/globals.css

@@ -0,0 +1,219 @@
+@import "tailwindcss";
+@import "tw-animate-css";
+@import "./shadcn-vendored.css";
+@import "@fontsource-variable/inter";
+
+@source "../ui/**/*.{ts,js,mjs,jsx,tsx}";
+@source "../components/**/*.{ts,js,mjs,jsx,tsx}";
+
+@custom-variant dark (&:is(.dark *));
+
+:root {
+  --background: oklch(1 0 0);
+  --foreground: oklch(0.145 0 0);
+  --card: oklch(1 0 0);
+  --card-foreground: oklch(0.145 0 0);
+  --popover: oklch(1 0 0);
+  --popover-foreground: oklch(0.145 0 0);
+  --primary: oklch(0.6 0.13 163);
+  --primary-foreground: oklch(0.98 0.02 166);
+  --secondary: oklch(0.967 0.001 286.375);
+  --secondary-foreground: oklch(0.21 0.006 285.885);
+  --muted: oklch(0.97 0 0);
+  --muted-foreground: oklch(0.556 0 0);
+  --accent: oklch(0.97 0 0);
+  --accent-foreground: oklch(0.205 0 0);
+  --destructive: oklch(0.58 0.22 27);
+  --border: oklch(0.922 0 0);
+  --input: oklch(0.922 0 0);
+  --ring: oklch(0.708 0 0);
+  --chart-1: oklch(0.85 0.13 165);
+  --chart-2: oklch(0.77 0.15 163);
+  --chart-3: oklch(0.7 0.15 162);
+  --chart-4: oklch(0.6 0.13 163);
+  --chart-5: oklch(0.51 0.1 166);
+  --radius: 0.625rem;
+  --sidebar: oklch(0.985 0 0);
+  --sidebar-foreground: oklch(0.145 0 0);
+  --sidebar-primary: oklch(0.6 0.13 163);
+  --sidebar-primary-foreground: oklch(0.98 0.02 166);
+  --sidebar-accent: oklch(0.97 0 0);
+  --sidebar-accent-foreground: oklch(0.205 0 0);
+  --sidebar-border: oklch(0.922 0 0);
+  --sidebar-ring: oklch(0.708 0 0);
+  --shiki-background: var(--card);
+  --shiki-foreground: var(--card-foreground);
+  --shiki-token-comment: #6b7280;
+  --shiki-token-string: #0f766e;
+  --shiki-token-string-expression: #0e7490;
+  --shiki-token-constant: #c2410c;
+  --shiki-token-keyword: #1d4ed8;
+  --shiki-token-parameter: #334155;
+  --shiki-token-function: #0369a1;
+  --shiki-token-punctuation: #94a3b8;
+  --shiki-token-link: #2563eb;
+  --shiki-token-inserted: #15803d;
+  --shiki-token-deleted: #b91c1c;
+  --shiki-token-changed: #a16207;
+}
+
+.dark {
+  --background: oklch(0.145 0 0);
+  --foreground: oklch(0.985 0 0);
+  --card: oklch(0.205 0 0);
+  --card-foreground: oklch(0.985 0 0);
+  --popover: oklch(0.205 0 0);
+  --popover-foreground: oklch(0.985 0 0);
+  --primary: oklch(0.7 0.15 162);
+  --primary-foreground: oklch(0.26 0.05 173);
+  --secondary: oklch(0.274 0.006 286.033);
+  --secondary-foreground: oklch(0.985 0 0);
+  --muted: oklch(0.269 0 0);
+  --muted-foreground: oklch(0.708 0 0);
+  --accent: oklch(0.371 0 0);
+  --accent-foreground: oklch(0.985 0 0);
+  --destructive: oklch(0.704 0.191 22.216);
+  --border: oklch(1 0 0 / 10%);
+  --input: oklch(1 0 0 / 15%);
+  --ring: oklch(0.556 0 0);
+  --chart-1: oklch(0.85 0.13 165);
+  --chart-2: oklch(0.77 0.15 163);
+  --chart-3: oklch(0.7 0.15 162);
+  --chart-4: oklch(0.6 0.13 163);
+  --chart-5: oklch(0.51 0.1 166);
+  --sidebar: oklch(0.205 0 0);
+  --sidebar-foreground: oklch(0.985 0 0);
+  --sidebar-primary: oklch(0.77 0.15 163);
+  --sidebar-primary-foreground: oklch(0.26 0.05 173);
+  --sidebar-accent: oklch(0.269 0 0);
+  --sidebar-accent-foreground: oklch(0.985 0 0);
+  --sidebar-border: oklch(1 0 0 / 10%);
+  --sidebar-ring: oklch(0.556 0 0);
+  --shiki-background: var(--card);
+  --shiki-foreground: var(--card-foreground);
+  --shiki-token-comment: #94a3b8;
+  --shiki-token-string: #2dd4bf;
+  --shiki-token-string-expression: #22d3ee;
+  --shiki-token-constant: #fb923c;
+  --shiki-token-keyword: #60a5fa;
+  --shiki-token-parameter: #cbd5e1;
+  --shiki-token-function: #38bdf8;
+  --shiki-token-punctuation: #64748b;
+  --shiki-token-link: #93c5fd;
+  --shiki-token-inserted: #4ade80;
+  --shiki-token-deleted: #f87171;
+  --shiki-token-changed: #fbbf24;
+}
+
+@theme inline {
+  --font-sans: "Inter Variable", sans-serif;
+  --color-sidebar-ring: var(--sidebar-ring);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar: var(--sidebar);
+  --color-chart-5: var(--chart-5);
+  --color-chart-4: var(--chart-4);
+  --color-chart-3: var(--chart-3);
+  --color-chart-2: var(--chart-2);
+  --color-chart-1: var(--chart-1);
+  --color-ring: var(--ring);
+  --color-input: var(--input);
+  --color-border: var(--border);
+  --color-destructive: var(--destructive);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-accent: var(--accent);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-muted: var(--muted);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-secondary: var(--secondary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-primary: var(--primary);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-popover: var(--popover);
+  --color-card-foreground: var(--card-foreground);
+  --color-card: var(--card);
+  --color-foreground: var(--foreground);
+  --color-background: var(--background);
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
+  --radius-2xl: calc(var(--radius) + 8px);
+  --radius-3xl: calc(var(--radius) + 12px);
+  --radius-4xl: calc(var(--radius) + 16px);
+}
+
+
+@layer base {
+  * {
+    @apply border-border outline-ring/50;
+  }
+
+  body {
+    @apply font-sans bg-background text-foreground;
+  }
+
+  html {
+    @apply font-sans;
+  }
+}
+
+@layer components {
+  .shiki.shiki-code,
+  .shiki-root pre {
+    @apply text-foreground rounded-md text-[12px] leading-[13px] overflow-auto border;
+    white-space: pre;
+    word-break: normal;
+    overflow-wrap: normal;
+    background: var(--card);
+    box-shadow: none;
+    position: relative;
+    padding: 0.5rem 0.75rem 0.5rem 2.25rem;
+    counter-reset: shiki-line;
+  }
+
+  .shiki.shiki-code code,
+  .shiki-root pre > code {
+    @apply font-mono;
+    white-space: inherit;
+    word-break: normal;
+    overflow-wrap: normal;
+  }
+
+  .shiki-code__line {
+    @apply block px-1 -mx-1 rounded;
+    position: relative;
+    counter-increment: shiki-line;
+  }
+
+  .shiki-code__line::before {
+    content: counter(shiki-line);
+    @apply absolute -left-8 top-0 w-6 text-right text-[0.65rem] text-muted-foreground/70;
+  }
+
+  .shiki-decor {
+    @apply relative inline-flex items-center rounded-sm;
+    padding: 0 0.1rem;
+    background: color-mix(in oklab, var(--primary) 8%, transparent);
+    border-bottom: 1px solid color-mix(in oklab, var(--primary) 30%, transparent);
+  }
+
+  .shiki-decor::after {
+    content: "";
+    display: none;
+  }
+
+  .shiki-decor-route {
+    border-bottom-color: color-mix(in oklab, var(--primary) 45%, transparent);
+  }
+
+  .shiki-decor-route::after,
+  .shiki-decor-id::after,
+  .shiki-decor-name::after {
+    content: "";
+  }
+}

package/dist/styles/shadcn-vendored.css

@@ -0,0 +1,95 @@
+@theme inline {
+  @keyframes accordion-down {
+    from {
+      height: 0;
+    }
+    to {
+      height: var(
+        --radix-accordion-content-height,
+        var(--accordion-panel-height, auto)
+      );
+    }
+  }
+
+  @keyframes accordion-up {
+    from {
+      height: var(
+        --radix-accordion-content-height,
+        var(--accordion-panel-height, auto)
+      );
+    }
+    to {
+      height: 0;
+    }
+  }
+}
+
+/* Custom variants */
+@custom-variant data-open {
+  &:where([data-state="open"]),
+  &:where([data-open]:not([data-open="false"])) {
+    @slot;
+  }
+}
+
+@custom-variant data-closed {
+  &:where([data-state="closed"]),
+  &:where([data-closed]:not([data-closed="false"])) {
+    @slot;
+  }
+}
+
+@custom-variant data-checked {
+  &:where([data-state="checked"]),
+  &:where([data-checked]:not([data-checked="false"])) {
+    @slot;
+  }
+}
+
+@custom-variant data-unchecked {
+  &:where([data-state="unchecked"]),
+  &:where([data-unchecked]:not([data-unchecked="false"])) {
+    @slot;
+  }
+}
+
+@custom-variant data-selected {
+  &:where([data-selected="true"]) {
+    @slot;
+  }
+}
+
+@custom-variant data-disabled {
+  &:where([data-disabled="true"]),
+  &:where([data-disabled]:not([data-disabled="false"])) {
+    @slot;
+  }
+}
+
+@custom-variant data-active {
+  &:where([data-state="active"]),
+  &:where([data-active]:not([data-active="false"])) {
+    @slot;
+  }
+}
+
+@custom-variant data-horizontal {
+  &:where([data-orientation="horizontal"]) {
+    @slot;
+  }
+}
+
+@custom-variant data-vertical {
+  &:where([data-orientation="vertical"]) {
+    @slot;
+  }
+}
+
+@utility no-scrollbar {
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+
+  &::-webkit-scrollbar {
+    display: none;
+  }
+}

package/dist/ui/alert-dialog.d.mts

@@ -0,0 +1,58 @@
+import { Button } from "./button.mjs";
+import * as React from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { AlertDialog as AlertDialog$1 } from "@base-ui/react/alert-dialog";
+
+//#region src/ui/alert-dialog.d.ts
+declare function AlertDialog({
+  ...props
+}: AlertDialog$1.Root.Props): react_jsx_runtime0.JSX.Element;
+declare function AlertDialogTrigger({
+  ...props
+}: AlertDialog$1.Trigger.Props): react_jsx_runtime0.JSX.Element;
+declare function AlertDialogPortal({
+  ...props
+}: AlertDialog$1.Portal.Props): react_jsx_runtime0.JSX.Element;
+declare function AlertDialogOverlay({
+  className,
+  ...props
+}: AlertDialog$1.Backdrop.Props): react_jsx_runtime0.JSX.Element;
+declare function AlertDialogContent({
+  className,
+  size,
+  ...props
+}: AlertDialog$1.Popup.Props & {
+  size?: "default" | "sm";
+}): react_jsx_runtime0.JSX.Element;
+declare function AlertDialogHeader({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function AlertDialogFooter({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function AlertDialogMedia({
+  className,
+  ...props
+}: React.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function AlertDialogTitle({
+  className,
+  ...props
+}: React.ComponentProps<typeof AlertDialog$1.Title>): react_jsx_runtime0.JSX.Element;
+declare function AlertDialogDescription({
+  className,
+  ...props
+}: React.ComponentProps<typeof AlertDialog$1.Description>): react_jsx_runtime0.JSX.Element;
+declare function AlertDialogAction({
+  className,
+  ...props
+}: React.ComponentProps<typeof Button>): react_jsx_runtime0.JSX.Element;
+declare function AlertDialogCancel({
+  className,
+  variant,
+  size,
+  ...props
+}: AlertDialog$1.Close.Props & Pick<React.ComponentProps<typeof Button>, "variant" | "size">): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger };