webadwaita 0.1.0 → 0.2.1

package/dist/native/HeaderBar/index.js

@@ -0,0 +1,79 @@
+import * as React from 'react';
+import { css, html } from 'react-strict-dom';
+import { palette, spacing, typography } from '../tokens.css';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Top-level header bar matching libadwaita's AdwHeaderBar — a thin titled
+ * strip that sits at the top of a window. Centered title with optional
+ * leading/trailing slots.
+ */
+export function HeaderBar(props) {
+  const {
+    title,
+    subtitle,
+    start,
+    end
+  } = props;
+  return /*#__PURE__*/_jsxs(html.header, {
+    style: styles.bar,
+    children: [/*#__PURE__*/_jsx(html.div, {
+      style: styles.side,
+      children: start
+    }), /*#__PURE__*/_jsxs(html.div, {
+      style: styles.titleBlock,
+      children: [title != null && /*#__PURE__*/_jsx(html.span, {
+        style: styles.title,
+        children: title
+      }), subtitle != null && /*#__PURE__*/_jsx(html.span, {
+        style: styles.subtitle,
+        children: subtitle
+      })]
+    }), /*#__PURE__*/_jsx(html.div, {
+      style: [styles.side, styles.sideEnd],
+      children: end
+    })]
+  });
+}
+const styles = css.create({
+  bar: {
+    display: 'flex',
+    flexDirection: 'row',
+    alignItems: 'center',
+    backgroundColor: palette.headerbarBg,
+    borderBottomWidth: 1,
+    borderBottomStyle: 'solid',
+    borderBottomColor: palette.border,
+    paddingBlock: spacing.sm,
+    paddingInline: spacing.md,
+    gap: spacing.sm,
+    minHeight: 46
+  },
+  side: {
+    display: 'flex',
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: spacing.sm,
+    flexBasis: 0,
+    flexGrow: 1
+  },
+  sideEnd: {
+    justifyContent: 'flex-end'
+  },
+  titleBlock: {
+    display: 'flex',
+    flexDirection: 'column',
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  title: {
+    fontFamily: typography.fontFamily,
+    fontSize: typography.bodySize,
+    fontWeight: typography.weightStrong,
+    color: palette.fg
+  },
+  subtitle: {
+    fontFamily: typography.fontFamily,
+    fontSize: typography.captionSize,
+    color: palette.fgMuted
+  }
+});

package/dist/native/Switch/index.js

@@ -0,0 +1,83 @@
+import { css, html } from 'react-strict-dom';
+import { palette, motion } from '../tokens.css';
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Adwaita-style toggle switch — pill-shaped track with a sliding thumb.
+ * Uses an html.button so it works identically on web and native via
+ * react-strict-dom; the inner thumb is positioned absolutely.
+ */
+export function Switch(props) {
+  const {
+    checked,
+    disabled = false,
+    onChange,
+    label
+  } = props;
+  const toggle = () => {
+    if (!disabled) onChange?.(!checked);
+  };
+  return /*#__PURE__*/_jsx(html.button, {
+    type: "button",
+    role: "switch",
+    "aria-checked": checked,
+    "aria-label": label,
+    disabled: disabled,
+    onClick: toggle,
+    style: [styles.track, checked ? styles.trackOn : styles.trackOff, disabled && styles.disabled],
+    children: /*#__PURE__*/_jsx(html.span, {
+      style: [styles.thumb, checked ? styles.thumbOn : styles.thumbOff]
+    })
+  });
+}
+const TRACK_W = 48;
+const TRACK_H = 28;
+const THUMB = 22;
+const PAD = (TRACK_H - THUMB) / 2;
+const styles = css.create({
+  track: {
+    position: 'relative',
+    width: TRACK_W,
+    height: TRACK_H,
+    borderRadius: TRACK_H / 2,
+    borderWidth: 0,
+    cursor: 'pointer',
+    transitionProperty: 'background-color',
+    transitionDuration: motion.durationBase,
+    transitionTimingFunction: motion.easing,
+    padding: 0
+  },
+  trackOff: {
+    backgroundColor: {
+      default: palette.subtleBgHover,
+      ':hover': palette.subtleBgActive
+    }
+  },
+  trackOn: {
+    backgroundColor: {
+      default: palette.accentBg,
+      ':hover': palette.accentBgHover
+    }
+  },
+  thumb: {
+    position: 'absolute',
+    top: PAD,
+    width: THUMB,
+    height: THUMB,
+    borderRadius: THUMB / 2,
+    backgroundColor: '#ffffff',
+    boxShadow: '0 1px 2px rgba(0, 0, 0, 0.25)',
+    transitionProperty: 'left, transform',
+    transitionDuration: motion.durationBase,
+    transitionTimingFunction: motion.easing
+  },
+  thumbOff: {
+    left: PAD
+  },
+  thumbOn: {
+    left: TRACK_W - THUMB - PAD
+  },
+  disabled: {
+    opacity: 0.5,
+    cursor: 'not-allowed'
+  }
+});

package/dist/native/index.js

@@ -0,0 +1,8 @@
+export { Button } from './Button';
+export { Entry } from './Entry';
+export { Switch } from './Switch';
+export { Checkbox } from './Checkbox';
+export { Card } from './Card';
+export { HeaderBar } from './HeaderBar';
+export { Box } from './Box';
+export { theme, palette, radius, spacing, typography, motion } from './theme';

package/dist/native/theme.js

@@ -0,0 +1,16 @@
+/**
+ * Re-export of the design tokens for runtime use by consumer code (e.g. for
+ * computing inline styles, reading the accent color in a custom component).
+ *
+ * The stylex-aware tokens live in `tokens.stylex.ts`. At runtime, defineConsts
+ * returns a plain object with the same keys/values — so we just re-export.
+ */
+export { palette, radius, spacing, typography, motion } from './tokens.css';
+import { palette, radius, spacing, typography, motion } from './tokens.css';
+export const theme = {
+  palette,
+  radius,
+  spacing,
+  typography,
+  motion
+};

package/dist/native/tokens.css.js

@@ -0,0 +1,77 @@
+import { css } from 'react-strict-dom';
+
+/**
+ * Adwaita-inspired design tokens, exposed via `css.defineConsts` so they can
+ * be referenced inside `css.create({...})` calls. StyleX requires shared
+ * values to live in a `.stylex.ts` file and to be defined this way.
+ *
+ * NOTE: defineConsts only accepts string values. Numeric tokens (sizes,
+ * weights, line heights) are encoded as strings — CSS accepts them either
+ * way, and react-strict-dom forwards them through to RN as well.
+ */
+
+export const palette = css.defineConsts({
+  accentBg: '#3584e4',
+  accentBgHover: '#4a90e9',
+  accentBgActive: '#1a6bb8',
+  accentFg: '#ffffff',
+  destructiveBg: '#e01b24',
+  destructiveBgHover: '#e8434b',
+  destructiveBgActive: '#b81920',
+  destructiveFg: '#ffffff',
+  successBg: '#26a269',
+  warningBg: '#cd9309',
+  windowBg: '#fafafa',
+  viewBg: '#ffffff',
+  cardBg: '#ffffff',
+  headerbarBg: '#ebebeb',
+  sidebarBg: '#ebebeb',
+  fg: 'rgba(0, 0, 0, 0.8)',
+  fgMuted: 'rgba(0, 0, 0, 0.55)',
+  fgDisabled: 'rgba(0, 0, 0, 0.35)',
+  fgOnAccent: '#ffffff',
+  border: 'rgba(0, 0, 0, 0.15)',
+  borderStrong: 'rgba(0, 0, 0, 0.25)',
+  shadow: 'rgba(0, 0, 0, 0.07)',
+  subtleBg: 'rgba(0, 0, 0, 0.07)',
+  subtleBgHover: 'rgba(0, 0, 0, 0.12)',
+  subtleBgActive: 'rgba(0, 0, 0, 0.18)'
+});
+export const radius = css.defineConsts({
+  sm: '6px',
+  md: '9px',
+  lg: '12px',
+  pill: '9999px'
+});
+export const spacing = css.defineConsts({
+  xs: '4px',
+  sm: '8px',
+  md: '12px',
+  lg: '16px',
+  xl: '24px',
+  xxl: '32px'
+});
+export const typography = css.defineConsts({
+  fontFamily: '"Adwaita Sans", "Cantarell", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif',
+  fontFamilyMono: '"Adwaita Mono", "Source Code Pro", ui-monospace, SFMono-Regular, Menlo, monospace',
+  weightRegular: '400',
+  weightStrong: '600',
+  weightBold: '700',
+  bodySize: '14px',
+  bodyLineHeight: '1.5',
+  captionSize: '12px',
+  captionLineHeight: '1.4',
+  title4Size: '16px',
+  title4LineHeight: '1.3',
+  title3Size: '18px',
+  title3LineHeight: '1.3',
+  title2Size: '22px',
+  title2LineHeight: '1.25',
+  title1Size: '28px',
+  title1LineHeight: '1.2'
+});
+export const motion = css.defineConsts({
+  durationFast: '120ms',
+  durationBase: '180ms',
+  easing: 'cubic-bezier(0.4, 0, 0.2, 1)'
+});

package/dist/types/Box/index.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+type SpacingKey = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
+type Direction = 'row' | 'column';
+type Align = 'flex-start' | 'center' | 'flex-end' | 'stretch' | 'baseline';
+type Justify = 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
+export type BoxProps = {
+    children?: React.ReactNode;
+    direction?: Direction;
+    gap?: SpacingKey;
+    padding?: SpacingKey;
+    align?: Align;
+    justify?: Justify;
+    grow?: boolean;
+    wrap?: boolean;
+    style?: any;
+};
+/**
+ * Layout primitive — a flex container, the building block for everything else.
+ * Adwaita-inspired apps lean heavily on simple horizontal/vertical stacks.
+ */
+export declare function Box(props: BoxProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/types/Box/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Box/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,KAAK,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;AAC3D,KAAK,SAAS,GAAG,KAAK,GAAG,QAAQ,CAAC;AAClC,KAAK,KAAK,GAAG,YAAY,GAAG,QAAQ,GAAG,UAAU,GAAG,SAAS,GAAG,UAAU,CAAC;AAC3E,KAAK,OAAO,GACR,YAAY,GACZ,QAAQ,GACR,UAAU,GACV,eAAe,GACf,cAAc,GACd,cAAc,CAAC;AAEnB,MAAM,MAAM,QAAQ,GAAG;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,GAAG,CAAC,EAAE,UAAU,CAAC;IACjB,OAAO,CAAC,EAAE,UAAU,CAAC;IACrB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,GAAG,CAAC;CACb,CAAC;AAEF;;;GAGG;AACH,wBAAgB,GAAG,CAAC,KAAK,EAAE,QAAQ,2CA8BlC"}

package/dist/types/Button/index.d.ts

@@ -0,0 +1,22 @@
+import * as React from 'react';
+export type ButtonVariant = 'default' | 'suggested' | 'destructive' | 'flat' | 'pill';
+export type ButtonSize = 'sm' | 'md' | 'lg';
+export type ButtonProps = {
+    children?: React.ReactNode;
+    variant?: ButtonVariant;
+    size?: ButtonSize;
+    disabled?: boolean;
+    fullWidth?: boolean;
+    onPress?: () => void;
+    type?: 'button' | 'submit';
+};
+/**
+ * Adwaita-style button. Variants follow libadwaita conventions:
+ *  - default:    flat-ish neutral surface
+ *  - suggested:  blue accent (primary)
+ *  - destructive: red, for irreversible actions
+ *  - flat:       no background, only on hover
+ *  - pill:       fully rounded (Adwaita "circular" buttons)
+ */
+export declare function Button(props: ButtonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/types/Button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,MAAM,aAAa,GACrB,SAAS,GACT,WAAW,GACX,aAAa,GACb,MAAM,GACN,MAAM,CAAC;AAEX,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE5C,MAAM,MAAM,WAAW,GAAG;IACxB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;CAC5B,CAAC;AAEF;;;;;;;GAOG;AACH,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,2CA6BxC"}

package/dist/types/Card/index.d.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+export type CardProps = {
+    children?: React.ReactNode;
+    title?: React.ReactNode;
+    /** "boxed" matches AdwBoxedList — solid surface w/ visible border. */
+    variant?: 'boxed' | 'flat';
+    padding?: boolean;
+};
+/**
+ * Adwaita-style card surface. Default has a soft shadow + rounded corners;
+ * "flat" drops the shadow for use inside other surfaces.
+ */
+export declare function Card(props: CardProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/types/Card/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Card/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,MAAM,SAAS,GAAG;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,sEAAsE;IACtE,OAAO,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF;;;GAGG;AACH,wBAAgB,IAAI,CAAC,KAAK,EAAE,SAAS,2CAapC"}

package/dist/types/Checkbox/index.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+export type CheckboxProps = {
+    checked: boolean;
+    disabled?: boolean;
+    onChange?: (checked: boolean) => void;
+    label?: React.ReactNode;
+};
+/**
+ * Adwaita-style checkbox. Solid blue square with a unicode check when on,
+ * subtle outlined square when off.
+ */
+export declare function Checkbox(props: CheckboxProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/types/Checkbox/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Checkbox/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,MAAM,aAAa,GAAG;IAC1B,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACzB,CAAC;AAEF;;;GAGG;AACH,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,2CAyC5C"}

package/dist/types/Entry/index.d.ts

@@ -0,0 +1,17 @@
+export type EntryProps = {
+    value?: string;
+    defaultValue?: string;
+    placeholder?: string;
+    disabled?: boolean;
+    readOnly?: boolean;
+    invalid?: boolean;
+    type?: 'text' | 'password' | 'email' | 'search' | 'tel' | 'url' | 'number';
+    onChange?: (value: string) => void;
+    onSubmit?: (value: string) => void;
+};
+/**
+ * Adwaita-style text entry. Underline focus indicator + subtle filled surface,
+ * like libadwaita's `AdwEntry`.
+ */
+export declare function Entry(props: EntryProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/types/Entry/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Entry/index.tsx"],"names":[],"mappings":"AAIA,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,KAAK,GAAG,QAAQ,CAAC;IAC3E,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC,CAAC;AAEF;;;GAGG;AACH,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,2CAqCtC"}

package/dist/types/HeaderBar/index.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+export type HeaderBarProps = {
+    title?: React.ReactNode;
+    subtitle?: React.ReactNode;
+    /** Buttons / actions to place at the start (left) of the bar. */
+    start?: React.ReactNode;
+    /** Buttons / actions to place at the end (right) of the bar. */
+    end?: React.ReactNode;
+};
+/**
+ * Top-level header bar matching libadwaita's AdwHeaderBar — a thin titled
+ * strip that sits at the top of a window. Centered title with optional
+ * leading/trailing slots.
+ */
+export declare function HeaderBar(props: HeaderBarProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/types/HeaderBar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/HeaderBar/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,iEAAiE;IACjE,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,gEAAgE;IAChE,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACvB,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,2CAiB9C"}

package/dist/types/Switch/index.d.ts

@@ -0,0 +1,13 @@
+export type SwitchProps = {
+    checked: boolean;
+    disabled?: boolean;
+    onChange?: (checked: boolean) => void;
+    label?: string;
+};
+/**
+ * Adwaita-style toggle switch — pill-shaped track with a sliding thumb.
+ * Uses an html.button so it works identically on web and native via
+ * react-strict-dom; the inner thumb is positioned absolutely.
+ */
+export declare function Switch(props: SwitchProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/types/Switch/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Switch/index.tsx"],"names":[],"mappings":"AAGA,MAAM,MAAM,WAAW,GAAG;IACxB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF;;;;GAIG;AACH,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,2CA0BxC"}

package/dist/types/index.d.ts

@@ -0,0 +1,17 @@
+export { Button } from './Button';
+export type { ButtonProps, ButtonVariant, ButtonSize } from './Button';
+export { Entry } from './Entry';
+export type { EntryProps } from './Entry';
+export { Switch } from './Switch';
+export type { SwitchProps } from './Switch';
+export { Checkbox } from './Checkbox';
+export type { CheckboxProps } from './Checkbox';
+export { Card } from './Card';
+export type { CardProps } from './Card';
+export { HeaderBar } from './HeaderBar';
+export type { HeaderBarProps } from './HeaderBar';
+export { Box } from './Box';
+export type { BoxProps } from './Box';
+export { theme, palette, radius, spacing, typography, motion } from './theme';
+export type { Theme } from './theme';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAEvE,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAChC,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,YAAY,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAExC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAElD,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAC5B,YAAY,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAC9E,YAAY,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC"}

package/dist/types/theme.d.ts

@@ -0,0 +1,77 @@
+/**
+ * Re-export of the design tokens for runtime use by consumer code (e.g. for
+ * computing inline styles, reading the accent color in a custom component).
+ *
+ * The stylex-aware tokens live in `tokens.stylex.ts`. At runtime, defineConsts
+ * returns a plain object with the same keys/values — so we just re-export.
+ */
+export { palette, radius, spacing, typography, motion } from './tokens.css';
+export declare const theme: {
+    readonly palette: import("@stylexjs/stylex").VarGroup<Readonly<{
+        accentBg: string;
+        accentBgHover: string;
+        accentBgActive: string;
+        accentFg: string;
+        destructiveBg: string;
+        destructiveBgHover: string;
+        destructiveBgActive: string;
+        destructiveFg: string;
+        successBg: string;
+        warningBg: string;
+        windowBg: string;
+        viewBg: string;
+        cardBg: string;
+        headerbarBg: string;
+        sidebarBg: string;
+        fg: string;
+        fgMuted: string;
+        fgDisabled: string;
+        fgOnAccent: string;
+        border: string;
+        borderStrong: string;
+        shadow: string;
+        subtleBg: string;
+        subtleBgHover: string;
+        subtleBgActive: string;
+    }>, symbol>;
+    readonly radius: import("@stylexjs/stylex").VarGroup<Readonly<{
+        sm: string;
+        md: string;
+        lg: string;
+        pill: string;
+    }>, symbol>;
+    readonly spacing: import("@stylexjs/stylex").VarGroup<Readonly<{
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+        xxl: string;
+    }>, symbol>;
+    readonly typography: import("@stylexjs/stylex").VarGroup<Readonly<{
+        fontFamily: string;
+        fontFamilyMono: string;
+        weightRegular: string;
+        weightStrong: string;
+        weightBold: string;
+        bodySize: string;
+        bodyLineHeight: string;
+        captionSize: string;
+        captionLineHeight: string;
+        title4Size: string;
+        title4LineHeight: string;
+        title3Size: string;
+        title3LineHeight: string;
+        title2Size: string;
+        title2LineHeight: string;
+        title1Size: string;
+        title1LineHeight: string;
+    }>, symbol>;
+    readonly motion: import("@stylexjs/stylex").VarGroup<Readonly<{
+        durationFast: string;
+        durationBase: string;
+        easing: string;
+    }>, symbol>;
+};
+export type Theme = typeof theme;
+//# sourceMappingURL=theme.d.ts.map

package/dist/types/theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../src/theme.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,EACL,OAAO,EACP,MAAM,EACN,OAAO,EACP,UAAU,EACV,MAAM,EACP,MAAM,cAAc,CAAC;AAItB,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAA4D,CAAC;AAC/E,MAAM,MAAM,KAAK,GAAG,OAAO,KAAK,CAAC"}

package/dist/types/tokens.css.d.ts

@@ -0,0 +1,76 @@
+import { css } from 'react-strict-dom';
+/**
+ * Adwaita-inspired design tokens, exposed via `css.defineConsts` so they can
+ * be referenced inside `css.create({...})` calls. StyleX requires shared
+ * values to live in a `.stylex.ts` file and to be defined this way.
+ *
+ * NOTE: defineConsts only accepts string values. Numeric tokens (sizes,
+ * weights, line heights) are encoded as strings — CSS accepts them either
+ * way, and react-strict-dom forwards them through to RN as well.
+ */
+export declare const palette: css.VarGroup<Readonly<{
+    accentBg: string;
+    accentBgHover: string;
+    accentBgActive: string;
+    accentFg: string;
+    destructiveBg: string;
+    destructiveBgHover: string;
+    destructiveBgActive: string;
+    destructiveFg: string;
+    successBg: string;
+    warningBg: string;
+    windowBg: string;
+    viewBg: string;
+    cardBg: string;
+    headerbarBg: string;
+    sidebarBg: string;
+    fg: string;
+    fgMuted: string;
+    fgDisabled: string;
+    fgOnAccent: string;
+    border: string;
+    borderStrong: string;
+    shadow: string;
+    subtleBg: string;
+    subtleBgHover: string;
+    subtleBgActive: string;
+}>, symbol>;
+export declare const radius: css.VarGroup<Readonly<{
+    sm: string;
+    md: string;
+    lg: string;
+    pill: string;
+}>, symbol>;
+export declare const spacing: css.VarGroup<Readonly<{
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+    xxl: string;
+}>, symbol>;
+export declare const typography: css.VarGroup<Readonly<{
+    fontFamily: string;
+    fontFamilyMono: string;
+    weightRegular: string;
+    weightStrong: string;
+    weightBold: string;
+    bodySize: string;
+    bodyLineHeight: string;
+    captionSize: string;
+    captionLineHeight: string;
+    title4Size: string;
+    title4LineHeight: string;
+    title3Size: string;
+    title3LineHeight: string;
+    title2Size: string;
+    title2LineHeight: string;
+    title1Size: string;
+    title1LineHeight: string;
+}>, symbol>;
+export declare const motion: css.VarGroup<Readonly<{
+    durationFast: string;
+    durationBase: string;
+    easing: string;
+}>, symbol>;
+//# sourceMappingURL=tokens.css.d.ts.map

package/dist/types/tokens.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.css.d.ts","sourceRoot":"","sources":["../../src/tokens.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAEvC;;;;;;;;GAQG;AAEH,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;WAgClB,CAAC;AAEH,eAAO,MAAM,MAAM;;;;;WAKjB,CAAC;AAEH,eAAO,MAAM,OAAO;;;;;;;WAOlB,CAAC;AAEH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;WAsBrB,CAAC;AAEH,eAAO,MAAM,MAAM;;;;WAIjB,CAAC"}