@ps1ui/core 0.0.0 → 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Koki Sato
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,49 @@
+<h1 align="center">
+@ps1ui/core
+</h1>
+
+<p align="center">
+<i>For engineers who think in monospace.</i>
+</p>
+
+<p align="center">
+<a href="https://koki-develop.github.io/ps1ui/">Documentation</a> | <a href="https://koki-develop.github.io/ps1ui/getting-started/">Getting Started</a> | <a href="https://koki-develop.github.io/ps1ui/components/">Components</a> | <a href="https://koki-develop.github.io/ps1ui/storybook/">Storybook</a>
+</p>
+
+## Install
+
+React 19 is a peer dependency — install it alongside the package.
+
+```bash
+pnpm add @ps1ui/core react react-dom
+```
+
+## Getting Started
+
+Import the stylesheet once at your app's entry point. The JS entry ships no styles — the CSS brings the design tokens, the dark canvas, and every component's styles.
+
+```tsx
+import "@ps1ui/core/styles.css";
+```
+
+Wrap your tree in `PS1Root`. It establishes the container-query context that responsive props resolve against — without it, responsive props silently fall back to their `base` values.
+
+```tsx
+import "@ps1ui/core/styles.css";
+import { PS1Root, Button, Heading } from "@ps1ui/core";
+
+export function App() {
+  return (
+    <PS1Root>
+      <Heading level={1}>Hello, PS1 UI</Heading>
+      <Button variant="primary">Click me</Button>
+    </PS1Root>
+  );
+}
+```
+
+Browse the full component catalog at [koki-develop.github.io/ps1ui/components](https://koki-develop.github.io/ps1ui/components/).
+
+## License
+
+[MIT](./LICENSE)

package/dist/base.css

@@ -0,0 +1,378 @@
+@import "@fontsource-variable/jetbrains-mono";
+/* Palette hexes are mirrored in .storybook/ps1uiTheme.ts — see note there. */
+:root {
+  --ps1ui-font-mono:
+    "JetBrains Mono Variable", ui-monospace, "SF Mono", Menlo, Monaco, "Cascadia Mono", Consolas,
+    monospace;
+
+  --ps1ui-color-bg: #0b0f14;
+  --ps1ui-color-surface: #0f1520;
+  --ps1ui-color-border: #21262d;
+  --ps1ui-color-border-strong: #30363d;
+  --ps1ui-color-fg: #c7d5df;
+  --ps1ui-color-fg-muted: #8b98a5;
+  /* fg-subtle must maintain ≥ 4.5:1 (WCAG AA) vs BOTH --ps1ui-color-bg and --ps1ui-color-surface.
+     Surface is the tighter case; verified by Text.contrast.test.tsx. */
+  --ps1ui-color-fg-subtle: #7a8593;
+  --ps1ui-color-primary: #7ee787;
+  --ps1ui-color-primary-hover: #56d364;
+  --ps1ui-color-primary-active: #3fb950;
+  --ps1ui-color-primary-fg: #0b0f14;
+  --ps1ui-color-accent: #ffa657;
+  --ps1ui-color-focus-ring-soft: color-mix(in srgb, var(--ps1ui-color-primary) 14%, transparent);
+  --ps1ui-shadow-focus-ring: 0 0 0 3px var(--ps1ui-color-focus-ring-soft);
+
+  /* Syntax-highlight palette for CodeBlock. Every value is verified ≥ 4.5:1 vs
+     BOTH --ps1ui-color-bg and --ps1ui-color-surface by CodeBlock.contrast.test.tsx. */
+  --ps1ui-code-comment: #7a8593;
+  --ps1ui-code-string: #f0c880;
+  --ps1ui-code-keyword: #ff7b95;
+  --ps1ui-code-function: #79c0ff;
+  --ps1ui-code-constant: #ffa657;
+  --ps1ui-code-type: #5eead4;
+  --ps1ui-code-tag: #ff9587;
+  --ps1ui-code-attr: #ffdc99;
+  --ps1ui-code-punctuation: #7a8593;
+  /* Diff-specific: green = added, rose = removed. Kept separate from tag/string so
+     the semantic overlap doesn't leak between grammars (a removed diff line has
+     nothing to do with an HTML <tag>, and an added line isn't a string literal). */
+  --ps1ui-code-inserted: #7ee787;
+  --ps1ui-code-deleted: #ff8896;
+
+  --ps1ui-radius-md: 3px;
+  --ps1ui-radius-lg: 4px;
+
+  --ps1ui-space-xs: 4px;
+  --ps1ui-space-sm: 8px;
+  --ps1ui-space-md: 12px;
+  --ps1ui-space-lg: 16px;
+  --ps1ui-space-xl: 24px;
+  --ps1ui-space-2xl: 32px;
+
+  /* Vertical padding for 1px-bordered controls (Button, Input): border +
+     padding = --ps1ui-space-sm (8px), so this is a derived value, not a new
+     spacing step. */
+  --ps1ui-control-padding-y: 7px;
+
+  /* Container max-widths, in rem so they scale with the user's browser
+     font-size preference (WCAG-friendly). Numeric equivalents at the
+     browser-default 16px root: 40 = 640, 48 = 768, 64 = 1024, 80 = 1280.
+     Doubles as the breakpoint scale — see --ps1ui-breakpoint-* below. */
+  --ps1ui-container-sm: 40rem;
+  --ps1ui-container-md: 48rem;
+  --ps1ui-container-lg: 64rem;
+  --ps1ui-container-xl: 80rem;
+
+  /* Responsive breakpoints, in rem for the same accessibility reason.
+     Values are identical to --ps1ui-container-* by design: a Container
+     of size=lg (64rem) fills at exactly the `lg` breakpoint. These are
+     documentation tokens — @container / @media conditions cannot use
+     `var()` per the CSS spec, so the same numeric values are also
+     hardcoded in each component's CSS. Keep in sync. */
+  --ps1ui-breakpoint-sm: 40rem;
+  --ps1ui-breakpoint-md: 48rem;
+  --ps1ui-breakpoint-lg: 64rem;
+  --ps1ui-breakpoint-xl: 80rem;
+
+  /* Type scale, in rem so text tracks the user's browser font-size preference
+     (same rationale as the container/breakpoint tokens above). All values sit
+     on the 0.125rem (2px) grid; px equivalents at the default 16px root:
+     12 / 14 / 16 / 18 / 22 / 26 / 32. */
+  --ps1ui-font-size-xs: 0.75rem;
+  --ps1ui-font-size-sm: 0.875rem;
+  --ps1ui-font-size-md: 1rem;
+  --ps1ui-font-size-lg: 1.125rem;
+  --ps1ui-font-size-xl: 1.375rem;
+  --ps1ui-font-size-2xl: 1.625rem;
+  --ps1ui-font-size-3xl: 2rem;
+
+  --ps1ui-transition-fast: 120ms ease;
+}
+/* ==========================================================================
+ * Reset
+ * --------------------------------------------------------------------------
+ * Included in base.css (and therefore in styles.css) so consumers who commit
+ * fully to the PS1 UI look get a consistent baseline across browsers.
+ *
+ * NEVER duplicate any of these rules in components.css — that entry is for
+ * consumers embedding PS1 UI into a foreign design system, where a global
+ * reset would collide with the host system. The invariant is enforced by
+ * scripts/check-css-split.mjs at build time.
+ *
+ * Consumer heads-up: raw semantic tags rendered outside PS1 UI's own
+ * components lose their UA appearance under this reset — a bare <a> paints
+ * with inherited color/no underline (route through <Anchor>), a bare <h1>
+ * collapses to body text (route through <Heading>), a bare <button> has no
+ * chrome (route through <Button>), <img> becomes block (breaks inline avatar
+ * layouts unless you set display:inline explicitly), <ul>/<ol> lose their
+ * bullets. Locked in by src/styles/reset.test.tsx.
+ * ========================================================================== */
+/* Box model + border baseline. Applied to `*` only — NOT to ::before/::after
+   /::backdrop/::file-selector-button. Pseudo-elements with border-drawn
+   glyphs (the classic rotated-L checkmark, tooltip carets, radio-dot rings)
+   need the initial `box-sizing: content-box` so their declared width/height
+   sit INSIDE the border. Josh Comeau's reset excludes pseudos for this
+   exact reason; Tailwind Preflight includes them but then has to document
+   the "authors doing border tricks must override" caveat. We pick the
+   Comeau side because ps1ui components (Checkbox) already use the trick.
+   Locked in by reset.test.tsx's "reset does not touch pseudos" block. */
+* {
+  box-sizing: border-box;
+  border: 0 solid;
+}
+body,
+blockquote,
+dl,
+dd,
+figure,
+fieldset,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+hr,
+menu,
+ol,
+p,
+pre,
+ul {
+  margin: 0;
+}
+fieldset,
+legend,
+menu,
+ol,
+ul {
+  padding: 0;
+}
+html {
+  color-scheme: dark;
+  line-height: 1.5;
+  -webkit-text-size-adjust: 100%;
+  -webkit-tap-highlight-color: transparent;
+  -moz-tab-size: 4;
+    -o-tab-size: 4;
+       tab-size: 4;
+  text-rendering: optimizeLegibility;
+}
+body {
+  min-height: 100dvh;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+/* Heading responsibility belongs to <Heading>; raw h1..h6 inherit so a bare
+   <h1> outside <Heading> doesn't blow up to the UA default. */
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-size: inherit;
+  font-weight: inherit;
+  text-wrap: balance;
+  overflow-wrap: break-word;
+}
+p {
+  text-wrap: pretty;
+  overflow-wrap: break-word;
+}
+ol,
+ul,
+menu {
+  list-style: none;
+}
+img,
+svg,
+video,
+canvas,
+audio,
+iframe,
+embed,
+object {
+  display: block;
+  vertical-align: middle;
+}
+img,
+video {
+  max-width: 100%;
+  height: auto;
+}
+/* Anchor responsibility belongs to <Anchor>; raw <a> inherits color/decoration
+   so it doesn't paint as UA blue underline against the dark canvas. */
+a {
+  color: inherit;
+  text-decoration: inherit;
+}
+/* UA still refuses to inherit font/color into form controls in 2026.
+   Inherit font-feature-settings / font-variation-settings too so JetBrains
+   Mono Variable's axes stay live inside <input> / <textarea>. */
+button,
+input,
+optgroup,
+select,
+textarea,
+::file-selector-button {
+  font: inherit;
+  font-feature-settings: inherit;
+  font-variation-settings: inherit;
+  letter-spacing: inherit;
+  color: inherit;
+  background-color: transparent;
+  border-radius: 0;
+  opacity: 1;
+}
+:where(select:is([multiple], [size])) optgroup {
+  font-weight: bolder;
+}
+button,
+select {
+  text-transform: none;
+}
+button,
+input:where([type="button"], [type="reset"], [type="submit"]),
+::file-selector-button {
+  -moz-appearance: button;
+       appearance: button;
+  -webkit-appearance: button;
+}
+button {
+  cursor: pointer;
+}
+textarea {
+  resize: vertical;
+}
+/* `in srgb` for consistency with the library's other color-mix calls. The
+   space is irrelevant when mixing with `transparent` (premultiplied-alpha
+   interpolation, CSS Color 4), so diverging from Tailwind Preflight's oklab
+   here is visually a no-op. */
+::-moz-placeholder {
+  opacity: 1;
+  color: color-mix(in srgb, currentcolor 55%, transparent);
+}
+::placeholder {
+  opacity: 1;
+  color: color-mix(in srgb, currentcolor 55%, transparent);
+}
+::-webkit-date-and-time-value {
+  min-height: 1lh;
+  text-align: inherit;
+}
+::-webkit-datetime-edit {
+  display: inline-flex;
+  padding: 0;
+}
+::-webkit-datetime-edit-fields-wrapper {
+  padding: 0;
+}
+::-webkit-inner-spin-button,
+::-webkit-outer-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+  height: auto;
+}
+/* number spinner: Chromium is already handled by ::-webkit-inner/outer-spin-button
+   { appearance: none } above. Firefox needs its own vendor prefix — the unprefixed
+   `appearance: textfield` is deprecated per CSS UI Level 4 (moved to compatibility
+   appendix) and dropped by Tailwind v4 Preflight, so we omit it. */
+input[type="number"] {
+  -moz-appearance: textfield;
+}
+[type="search"] {
+  -webkit-appearance: textfield;
+  outline-offset: -2px;
+}
+::-webkit-search-decoration,
+::-webkit-search-cancel-button {
+  -webkit-appearance: none;
+}
+:-moz-ui-invalid {
+  box-shadow: none;
+}
+:-moz-focusring:where(:not(iframe)) {
+  outline: auto;
+}
+b,
+strong {
+  font-weight: bolder;
+}
+small {
+  font-size: 80%;
+}
+code,
+kbd,
+samp,
+pre {
+  font-family: var(--ps1ui-font-mono);
+  font-size: 1em;
+}
+abbr:where([title]) {
+  -webkit-text-decoration: underline dotted;
+          text-decoration: underline dotted;
+}
+q::before,
+q::after {
+  content: "";
+}
+/* Keeps sub/sup from expanding the parent line-height. */
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+sub {
+  bottom: -0.25em;
+}
+sup {
+  top: -0.5em;
+}
+table {
+  text-indent: 0;
+  border-color: inherit;
+  border-collapse: collapse;
+}
+hr {
+  height: 0;
+  color: inherit;
+  border-top: 1px solid;
+}
+summary {
+  display: list-item;
+}
+/* [hidden] would lose to `display: flex` etc. without this. */
+[hidden]:where(:not([hidden="until-found"])) {
+  display: none !important;
+}
+@media (prefers-reduced-motion: no-preference) {
+  html {
+    interpolate-size: allow-keywords;
+  }
+}
+/* ==========================================================================
+ * Ambient environment
+ * --------------------------------------------------------------------------
+ * `background`/`color`/`font-family` intentionally live on `html`, not `body`.
+ * Rationale: the reset above zeros `body { margin }`, but the browser still
+ * paints the area beyond `body` (macOS/iOS rubber-band overscroll region,
+ * horizontal-scroll overflow, viewport slack) using the canvas root's
+ * background — which is `html`. If these rules were on `body`, that overscroll
+ * area would reveal the light UA default and flash white on scroll. `color`
+ * and `font-family` cascade down to `body` and descendants naturally.
+ * ========================================================================== */
+html {
+  background: var(--ps1ui-color-bg);
+  color: var(--ps1ui-color-fg);
+  font-family: var(--ps1ui-font-mono);
+}
+::-moz-selection {
+  background: var(--ps1ui-color-primary);
+  color: var(--ps1ui-color-primary-fg);
+}
+::selection {
+  background: var(--ps1ui-color-primary);
+  color: var(--ps1ui-color-primary-fg);
+}

package/dist/components/Anchor/Anchor.d.mts

@@ -0,0 +1,14 @@
+import { ComponentPropsWithoutRef, ElementType } from "react";
+//#region src/components/Anchor/Anchor.d.ts
+type AnchorVariant = "primary" | "subtle";
+type AnchorOwnProps<E extends ElementType> = {
+  /** Element or component to render instead of the native <a> — e.g. a router Link. */
+  as?: E;
+  /** Visual style: "primary" for standalone links, "subtle" for links inside running text. */
+  variant?: AnchorVariant;
+};
+type AnchorProps<E extends ElementType = "a"> = AnchorOwnProps<E> & Omit<ComponentPropsWithoutRef<E>, keyof AnchorOwnProps<E>>;
+declare function Anchor<E extends ElementType = "a">({ as, variant, className, ...rest }: AnchorProps<E>): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+//#endregion
+export { Anchor, AnchorProps, AnchorVariant };
+//# sourceMappingURL=Anchor.d.mts.map

package/dist/components/Anchor/Anchor.mjs

@@ -0,0 +1,15 @@
+import { cx } from "../../utils/cx.mjs";
+import { createElement } from "react";
+//#region src/components/Anchor/Anchor.tsx
+function Anchor({ as, variant = "primary", className, ...rest }) {
+	const tag = as ?? "a";
+	const classes = cx("ps1ui-anchor", `ps1ui-anchor--${variant}`, className);
+	return createElement(tag, {
+		...rest,
+		className: classes
+	});
+}
+//#endregion
+export { Anchor };
+
+//# sourceMappingURL=Anchor.mjs.map

package/dist/components/Anchor/Anchor.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Anchor.mjs","names":[],"sources":["../../../src/components/Anchor/Anchor.tsx"],"sourcesContent":["import { createElement } from \"react\";\nimport type { ComponentPropsWithoutRef, ElementType } from \"react\";\nimport { cx } from \"../../utils/cx\";\n\nexport type AnchorVariant = \"primary\" | \"subtle\";\n\ntype AnchorOwnProps<E extends ElementType> = {\n  /** Element or component to render instead of the native <a> — e.g. a router Link. */\n  as?: E;\n  /** Visual style: \"primary\" for standalone links, \"subtle\" for links inside running text. */\n  variant?: AnchorVariant;\n};\n\n// Deliberate exception to the general \"use ComponentProps<'tag'>\" rule other components follow —\n// same reasoning as Text: with a polymorphic `as` prop TypeScript cannot correctly narrow the\n// `ref` prop's type. Anchor accepts both string tags and React component types (`as={NextLink}`),\n// so a loose ref type would silently accept mismatched refs; dropping ref from the prop type is\n// safer than a misleading loose type.\nexport type AnchorProps<E extends ElementType = \"a\"> = AnchorOwnProps<E> &\n  Omit<ComponentPropsWithoutRef<E>, keyof AnchorOwnProps<E>>;\n\nexport function Anchor<E extends ElementType = \"a\">({\n  as,\n  variant = \"primary\",\n  className,\n  ...rest\n}: AnchorProps<E>) {\n  const tag = as ?? \"a\";\n  const classes = cx(\"ps1ui-anchor\", `ps1ui-anchor--${variant}`, className);\n  return createElement(tag, { ...rest, className: classes });\n}\n"],"mappings":";;;AAqBA,SAAgB,OAAoC,EAClD,IACA,UAAU,WACV,WACA,GAAG,QACc;CACjB,MAAM,MAAM,MAAM;CAClB,MAAM,UAAU,GAAG,gBAAgB,iBAAiB,WAAW,SAAS;CACxE,OAAO,cAAc,KAAK;EAAE,GAAG;EAAM,WAAW;CAAQ,CAAC;AAC3D"}

package/dist/components/Button/Button.d.mts

@@ -0,0 +1,30 @@
+import { ComponentPropsWithoutRef, ElementType } from "react";
+//#region src/components/Button/Button.d.ts
+type ButtonVariant = "primary" | "secondary";
+type ButtonOwnProps<E extends ElementType> = {
+  /** Element or component to render instead of the native <button> — e.g. "a" or a router Link. */
+  as?: E;
+  /** Visual style: "primary" for the main action, "secondary" for supporting actions. */
+  variant?: ButtonVariant;
+};
+/**
+ * Props for {@link Button}. Derived from the props of the rendered element `E`,
+ * so what's accepted follows the `as` target.
+ *
+ * `disabled` and polymorphism: `disabled` only exists on form elements, so
+ * `<Button as="a" href="…" disabled>` is a type error (`ComponentPropsWithoutRef<"a">`
+ * has no `disabled` — locked in by `Button.test-d.tsx`). This is intentional and
+ * matches the ARIA Authoring Practices: links are not disabled. When the action is
+ * unavailable, render a native `<Button disabled>` (or no link at all) instead of a
+ * link. Untyped JS callers and `as={Component}` escapes that pass `disabled` anyway
+ * get a leaked no-op attribute — no visual or behavioral disabling happens.
+ *
+ * `type` on the native tag: when rendering a native <button>, `type` defaults to
+ * "button" (not the browser's implicit "submit"), so a Button inside a <form>
+ * never submits implicitly — pass type="submit" explicitly to submit.
+ */
+type ButtonProps<E extends ElementType = "button"> = ButtonOwnProps<E> & Omit<ComponentPropsWithoutRef<E>, keyof ButtonOwnProps<E>>;
+declare function Button<E extends ElementType = "button">({ as, variant, className, ...rest }: ButtonProps<E>): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+//#endregion
+export { Button, ButtonProps, ButtonVariant };
+//# sourceMappingURL=Button.d.mts.map

package/dist/components/Button/Button.mjs

@@ -0,0 +1,17 @@
+import { cx } from "../../utils/cx.mjs";
+import { createElement } from "react";
+//#region src/components/Button/Button.tsx
+function Button({ as, variant = "primary", className, ...rest }) {
+	const tag = as ?? "button";
+	const classes = cx("ps1ui-button", `ps1ui-button--${variant}`, className);
+	const props = {
+		...rest,
+		className: classes
+	};
+	if (tag === "button" && props.type === void 0) props.type = "button";
+	return createElement(tag, props);
+}
+//#endregion
+export { Button };
+
+//# sourceMappingURL=Button.mjs.map

package/dist/components/Button/Button.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.mjs","names":[],"sources":["../../../src/components/Button/Button.tsx"],"sourcesContent":["import { createElement } from \"react\";\nimport type { ComponentPropsWithoutRef, ElementType } from \"react\";\nimport { cx } from \"../../utils/cx\";\n\nexport type ButtonVariant = \"primary\" | \"secondary\";\n\ntype ButtonOwnProps<E extends ElementType> = {\n  /** Element or component to render instead of the native <button> — e.g. \"a\" or a router Link. */\n  as?: E;\n  /** Visual style: \"primary\" for the main action, \"secondary\" for supporting actions. */\n  variant?: ButtonVariant;\n};\n\n// Deliberate exception to the general \"use ComponentProps<'tag'>\" rule other components follow —\n// same reasoning as Anchor / Text: with a polymorphic `as` prop TypeScript cannot correctly\n// narrow the `ref` prop's type against the resolved element E. Button accepts both string tags\n// (`as=\"a\"`) and React component types (`as={NextLink}`) so consumers can render a link that\n// looks like a button; a loose ref type would silently accept mismatched refs, so dropping ref\n// from the prop type is safer than a misleading loose type.\n/**\n * Props for {@link Button}. Derived from the props of the rendered element `E`,\n * so what's accepted follows the `as` target.\n *\n * `disabled` and polymorphism: `disabled` only exists on form elements, so\n * `<Button as=\"a\" href=\"…\" disabled>` is a type error (`ComponentPropsWithoutRef<\"a\">`\n * has no `disabled` — locked in by `Button.test-d.tsx`). This is intentional and\n * matches the ARIA Authoring Practices: links are not disabled. When the action is\n * unavailable, render a native `<Button disabled>` (or no link at all) instead of a\n * link. Untyped JS callers and `as={Component}` escapes that pass `disabled` anyway\n * get a leaked no-op attribute — no visual or behavioral disabling happens.\n *\n * `type` on the native tag: when rendering a native <button>, `type` defaults to\n * \"button\" (not the browser's implicit \"submit\"), so a Button inside a <form>\n * never submits implicitly — pass type=\"submit\" explicitly to submit.\n */\nexport type ButtonProps<E extends ElementType = \"button\"> = ButtonOwnProps<E> &\n  Omit<ComponentPropsWithoutRef<E>, keyof ButtonOwnProps<E>>;\n\nexport function Button<E extends ElementType = \"button\">({\n  as,\n  variant = \"primary\",\n  className,\n  ...rest\n}: ButtonProps<E>) {\n  const tag: ElementType = as ?? \"button\";\n  const classes = cx(\"ps1ui-button\", `ps1ui-button--${variant}`, className);\n  const props: Record<string, unknown> = { ...rest, className: classes };\n  // `type=\"button\"` is a defensive default so a native <button> inside a <form> never\n  // submits implicitly. It only makes sense on the native tag — <a>, <NextLink>, and\n  // other host/component targets have no such attribute, and stamping one on them\n  // would leak an invalid attribute through to the DOM. Explicit callers still win.\n  if (tag === \"button\" && props.type === undefined) {\n    props.type = \"button\";\n  }\n  return createElement(tag, props);\n}\n"],"mappings":";;;AAsCA,SAAgB,OAAyC,EACvD,IACA,UAAU,WACV,WACA,GAAG,QACc;CACjB,MAAM,MAAmB,MAAM;CAC/B,MAAM,UAAU,GAAG,gBAAgB,iBAAiB,WAAW,SAAS;CACxE,MAAM,QAAiC;EAAE,GAAG;EAAM,WAAW;CAAQ;CAKrE,IAAI,QAAQ,YAAY,MAAM,SAAS,KAAA,GACrC,MAAM,OAAO;CAEf,OAAO,cAAc,KAAK,KAAK;AACjC"}

package/dist/components/Card/Card.d.mts

@@ -0,0 +1,7 @@
+import { ComponentProps } from "react";
+//#region src/components/Card/Card.d.ts
+type CardProps = ComponentProps<"div">;
+declare function Card({ className, ...rest }: CardProps): import("react").JSX.Element;
+//#endregion
+export { Card, CardProps };
+//# sourceMappingURL=Card.d.mts.map

package/dist/components/Card/Card.mjs

@@ -0,0 +1,14 @@
+import { cx } from "../../utils/cx.mjs";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/Card/Card.tsx
+function Card({ className, ...rest }) {
+	const classes = cx("ps1ui-card", className);
+	return /* @__PURE__ */ jsx("div", {
+		...rest,
+		className: classes
+	});
+}
+//#endregion
+export { Card };
+
+//# sourceMappingURL=Card.mjs.map

package/dist/components/Card/Card.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.mjs","names":[],"sources":["../../../src/components/Card/Card.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\nimport { cx } from \"../../utils/cx\";\n\nexport type CardProps = ComponentProps<\"div\">;\n\nexport function Card({ className, ...rest }: CardProps) {\n  const classes = cx(\"ps1ui-card\", className);\n  return <div {...rest} className={classes} />;\n}\n"],"mappings":";;;AAKA,SAAgB,KAAK,EAAE,WAAW,GAAG,QAAmB;CACtD,MAAM,UAAU,GAAG,cAAc,SAAS;CAC1C,OAAO,oBAAC,OAAD;EAAK,GAAI;EAAM,WAAW;CAAU,CAAA;AAC7C"}

package/dist/components/Checkbox/Checkbox.d.mts

@@ -0,0 +1,10 @@
+import { ComponentProps } from "react";
+//#region src/components/Checkbox/Checkbox.d.ts
+type CheckboxProps = Omit<ComponentProps<"input">, "type"> & {
+  /** Render the indeterminate ("mixed") visual state. Purely visual — checked is unaffected. */
+  indeterminate?: boolean;
+};
+declare function Checkbox({ className, indeterminate, ref: forwardedRef, ...rest }: CheckboxProps): import("react").JSX.Element;
+//#endregion
+export { Checkbox, CheckboxProps };
+//# sourceMappingURL=Checkbox.d.mts.map

package/dist/components/Checkbox/Checkbox.mjs

@@ -0,0 +1,23 @@
+"use client";
+import { cx } from "../../utils/cx.mjs";
+import { useMergedRef } from "../../utils/useMergedRef.mjs";
+import { jsx } from "react/jsx-runtime";
+import { useLayoutEffect, useRef } from "react";
+//#region src/components/Checkbox/Checkbox.tsx
+function Checkbox({ className, indeterminate = false, ref: forwardedRef, ...rest }) {
+	const localRef = useRef(null);
+	useLayoutEffect(() => {
+		localRef.current.indeterminate = indeterminate;
+	}, [indeterminate]);
+	const mergedRef = useMergedRef(localRef, forwardedRef);
+	return /* @__PURE__ */ jsx("input", {
+		...rest,
+		ref: mergedRef,
+		type: "checkbox",
+		className: cx("ps1ui-checkbox", className)
+	});
+}
+//#endregion
+export { Checkbox };
+
+//# sourceMappingURL=Checkbox.mjs.map

package/dist/components/Checkbox/Checkbox.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.mjs","names":[],"sources":["../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["\"use client\";\n\nimport { useLayoutEffect, useRef, type ComponentProps } from \"react\";\nimport { cx } from \"../../utils/cx\";\nimport { useMergedRef } from \"../../utils/useMergedRef\";\n\nexport type CheckboxProps = Omit<ComponentProps<\"input\">, \"type\"> & {\n  /** Render the indeterminate (\"mixed\") visual state. Purely visual — checked is unaffected. */\n  indeterminate?: boolean;\n};\n\nexport function Checkbox({\n  className,\n  indeterminate = false,\n  ref: forwardedRef,\n  ...rest\n}: CheckboxProps) {\n  const localRef = useRef<HTMLInputElement>(null);\n\n  // useLayoutEffect syncs .indeterminate before paint, avoiding a ✓-glyph flash on mount.\n  useLayoutEffect(() => {\n    localRef.current!.indeterminate = indeterminate;\n  }, [indeterminate]);\n\n  // Both the indeterminate sync above and the caller get the <input> node.\n  const mergedRef = useMergedRef(localRef, forwardedRef);\n\n  return (\n    <input {...rest} ref={mergedRef} type=\"checkbox\" className={cx(\"ps1ui-checkbox\", className)} />\n  );\n}\n"],"mappings":";;;;;;AAWA,SAAgB,SAAS,EACvB,WACA,gBAAgB,OAChB,KAAK,cACL,GAAG,QACa;CAChB,MAAM,WAAW,OAAyB,IAAI;CAG9C,sBAAsB;EACpB,SAAS,QAAS,gBAAgB;CACpC,GAAG,CAAC,aAAa,CAAC;CAGlB,MAAM,YAAY,aAAa,UAAU,YAAY;CAErD,OACE,oBAAC,SAAD;EAAO,GAAI;EAAM,KAAK;EAAW,MAAK;EAAW,WAAW,GAAG,kBAAkB,SAAS;CAAI,CAAA;AAElG"}

package/dist/components/Code/Code.d.mts

@@ -0,0 +1,7 @@
+import { ComponentProps } from "react";
+//#region src/components/Code/Code.d.ts
+type CodeProps = ComponentProps<"code">;
+declare function Code({ className, ...rest }: CodeProps): import("react").JSX.Element;
+//#endregion
+export { Code, CodeProps };
+//# sourceMappingURL=Code.d.mts.map

package/dist/components/Code/Code.mjs

@@ -0,0 +1,14 @@
+import { cx } from "../../utils/cx.mjs";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/Code/Code.tsx
+function Code({ className, ...rest }) {
+	const classes = cx("ps1ui-code", className);
+	return /* @__PURE__ */ jsx("code", {
+		...rest,
+		className: classes
+	});
+}
+//#endregion
+export { Code };
+
+//# sourceMappingURL=Code.mjs.map

package/dist/components/Code/Code.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Code.mjs","names":[],"sources":["../../../src/components/Code/Code.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\nimport { cx } from \"../../utils/cx\";\n\nexport type CodeProps = ComponentProps<\"code\">;\n\nexport function Code({ className, ...rest }: CodeProps) {\n  const classes = cx(\"ps1ui-code\", className);\n  return <code {...rest} className={classes} />;\n}\n"],"mappings":";;;AAKA,SAAgB,KAAK,EAAE,WAAW,GAAG,QAAmB;CACtD,MAAM,UAAU,GAAG,cAAc,SAAS;CAC1C,OAAO,oBAAC,QAAD;EAAM,GAAI;EAAM,WAAW;CAAU,CAAA;AAC9C"}

package/dist/components/CodeBlock/CodeBlock.d.mts

@@ -0,0 +1,15 @@
+import { CodeBlockLanguage } from "./refractor.mjs";
+import { ComponentProps } from "react";
+//#region src/components/CodeBlock/CodeBlock.d.ts
+type CodeBlockProps = Omit<ComponentProps<"pre">, "children"> & {
+  /** Code to render. Takes precedence over children; use it where JSX children get rewrapped (e.g. Astro islands). */
+  code?: string;
+  /** Code to render, as the element's only child. */
+  children?: string;
+  /** Prism language name or alias. Unknown or omitted values render as plain text. */
+  language?: CodeBlockLanguage | (string & {});
+};
+declare function CodeBlock({ code, children, language, className, onBlur, ref: forwardedRef, ...rest }: CodeBlockProps): import("react").JSX.Element;
+//#endregion
+export { CodeBlock, type CodeBlockLanguage, CodeBlockProps };
+//# sourceMappingURL=CodeBlock.d.mts.map