@rvx/ui 0.3.8 → 0.4.0

package/theme/global.css

@@ -0,0 +1,118 @@
+
+:root {
+	font-family: -apple-system, BlinkMacSystemFont, "Ubuntu", "Segoe UI", system-ui, sans-serif;
+	font-size: .875rem;
+	line-height: 1;
+}
+
+* {
+	box-sizing: border-box;
+	--space-scale: 1;
+	--space-above: unset;
+	--space-below: unset;
+}
+
+::selection {
+	background-color: var(--bg-selection);
+}
+
+body {
+	background-color: var(--bg);
+	color: var(--fg);
+	accent-color: var(--accent);
+
+	text-wrap: balance;
+	@supports (text-wrap: pretty) {
+		text-wrap: pretty;
+	}
+
+	--line-gap: calc(8rem / 14);
+
+	--page-padding-block: 2rem;
+	--page-padding-inline: 2rem;
+
+	--content-row-gap: 2rem;
+	--content-column-gap: 2rem;
+	--content-radius: calc(10rem / 14);
+	--content-border: calc(2rem / 14);
+	--content-padding-block: calc(16rem / 14);
+	--content-padding-inline: calc(16rem / 14);
+
+	--group-row-gap: 1rem;
+	--group-column-gap: 1rem;
+	--group-padding-block: calc(16rem / 14);
+	--group-padding-inline: calc(16rem / 14);
+
+	--control-row-gap: calc(10rem / 14);
+	--control-column-gap: calc(10rem / 14);
+	--control-radius: calc(5rem / 14);
+	--control-border: calc(2rem / 14);
+	--control-padding-block: calc(8rem / 14);
+	--control-padding-inline: calc(8rem / 14);
+
+	--transition-color: .1s ease;
+	--transition-layout: .25s ease;
+
+	--separator: calc(2rem / 14);
+
+	--overflow-safe-area: calc(2rem / 14);
+	--input-extension: calc(5rem / 14);
+
+	--focus-outline-offset: calc(2rem / 14);
+}
+
+.rvx-dark {
+	color-scheme: dark;
+
+	--bg: rgb(24 24 24);
+	--bg-alt: rgb(32 32 32);
+	--bg-selection: rgb(64 150 255 / .5);
+
+	--fg: white;
+	--accent: rgb(64 160 255);
+	--fg-danger: rgb(255 64 64);
+
+	--secondary-filter: opacity(.6);
+
+	--overlay-shadow: 0 0 1.5rem rgba(0 0 0 / .3);
+	--overlay-backdrop: rgb(24 24 24 / .8);
+
+	--content-shadow: 0 0 .75rem rgba(0 0 0 / .3);
+
+	--control-disabled: opacity(.5);
+	--control-shadow: 0 0 .2rem rgb(0 0 0 / .5);
+
+	--default-border: rgb(36 36 36);
+
+	--separator-color: rgb(40 40 40);
+
+	--focus-outline: var(--control-border) dashed var(--accent);
+}
+
+.rvx-light {
+	color-scheme: light;
+
+	--bg: white;
+	--bg-alt: rgb(250 250 250);
+	--bg-selection: rgb(0 127 255 / .3);
+
+	--fg: rgb(42 42 42);
+	--accent: rgb(0 127 255);
+	--fg-danger: rgb(255 64 64);
+
+	--secondary-filter: opacity(.65);
+
+	--overlay-shadow: 0 0 3rem rgba(0 0 0 / .2);
+	--overlay-backdrop: rgb(245 245 245 / .7);
+
+	--content-shadow: 0 0 1rem rgba(0 0 0 / .1);
+
+	--control-disabled: opacity(.5);
+	--control-shadow: 0 0 .2rem rgb(0 0 0 / .2);
+
+	--default-border: rgb(215 215 215);
+
+	--separator-color: rgb(230 230 230);
+
+	--focus-outline: var(--control-border) dashed var(--accent);
+}

package/dist/common/theme-test.d.ts

@@ -1,8 +0,0 @@
-import { Theme } from "./theme.js";
-/**
- * Get a class name from the current theme.
- *
- * @throws An error if the current theme doesn't support the specified key.
- */
-export declare function themeClass(key: keyof Theme): string;
-//# sourceMappingURL=theme-test.d.ts.map

package/dist/common/theme-test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"theme-test.d.ts","sourceRoot":"","sources":["../../src/common/theme-test.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAS,KAAK,EAAE,MAAM,YAAY,CAAC;AAE1C;;;;GAIG;AACH,wBAAgB,UAAU,CAAC,GAAG,EAAE,MAAM,KAAK,GAAG,MAAM,CAUnD"}

package/dist/common/theme-test.js

@@ -1,13 +0,0 @@
-import { THEME } from "./theme.js";
-export function themeClass(key) {
-    const theme = THEME.current;
-    if (!theme) {
-        throw new Error("theme is not available in the current context");
-    }
-    const value = theme[key];
-    if (value === undefined) {
-        throw new Error(`${key} is not supported by the current theme`);
-    }
-    return value;
-}
-//# sourceMappingURL=theme-test.js.map

package/dist/common/theme-test.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"theme-test.js","sourceRoot":"","sources":["../../src/common/theme-test.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAS,MAAM,YAAY,CAAC;AAO1C,MAAM,UAAU,UAAU,CAAC,GAAgB;IAC1C,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC;IAC5B,IAAI,CAAC,KAAK,EAAE,CAAC;QACZ,MAAM,IAAI,KAAK,CAAC,+CAA+C,CAAC,CAAC;IAClE,CAAC;IACD,MAAM,KAAK,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC;IACzB,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;QACzB,MAAM,IAAI,KAAK,CAAC,GAAG,GAAG,wCAAwC,CAAC,CAAC;IACjE,CAAC;IACD,OAAO,KAAK,CAAC;AACd,CAAC"}

package/dist/components/checkbox-test.d.ts

@@ -1,4 +0,0 @@
-export declare function isCheckboxChecked(checkbox: Element): boolean | undefined;
-export declare function toggleCheckbox(checkbox: Element, checked?: boolean): void;
-export declare function getCheckboxContent(checkbox: Element): HTMLElement;
-//# sourceMappingURL=checkbox-test.d.ts.map

package/dist/components/checkbox-test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"checkbox-test.d.ts","sourceRoot":"","sources":["../../src/components/checkbox-test.tsx"],"names":[],"mappings":"AAaA,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,OAAO,GAAG,OAAO,GAAG,SAAS,CAIxE;AAED,wBAAgB,cAAc,CAAC,QAAQ,EAAE,OAAO,EAAE,OAAO,CAAC,EAAE,OAAO,GAAG,IAAI,CAUzE;AAED,wBAAgB,kBAAkB,CAAC,QAAQ,EAAE,OAAO,GAAG,WAAW,CAGjE"}

package/dist/components/checkbox-test.js

@@ -1,31 +0,0 @@
-import { ENV } from "rvx";
-import { themeClass } from "../common/theme-test.js";
-function assertCheckbox(checkbox) {
-    if (!checkbox.matches(`.${themeClass("checkbox_label")}`)) {
-        throw new Error("checkbox must be a checkbox root element.");
-    }
-}
-function getInput(checkbox) {
-    return checkbox.querySelector("input");
-}
-export function isCheckboxChecked(checkbox) {
-    assertCheckbox(checkbox);
-    const input = getInput(checkbox);
-    return input.indeterminate ? undefined : input.checked;
-}
-export function toggleCheckbox(checkbox, checked) {
-    assertCheckbox(checkbox);
-    const input = getInput(checkbox);
-    if (input.disabled) {
-        return;
-    }
-    checked ??= !input.checked;
-    input.indeterminate = false;
-    input.checked = checked;
-    input.dispatchEvent(new ENV.current.CustomEvent("input"));
-}
-export function getCheckboxContent(checkbox) {
-    assertCheckbox(checkbox);
-    return checkbox.querySelector(`.${themeClass("checkbox_content")}`);
-}
-//# sourceMappingURL=checkbox-test.js.map

package/dist/components/checkbox-test.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"checkbox-test.js","sourceRoot":"","sources":["../../src/components/checkbox-test.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAErD,SAAS,cAAc,CAAC,QAAiB;IACxC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,UAAU,CAAC,gBAAgB,CAAC,EAAE,CAAC,EAAE,CAAC;QAC3D,MAAM,IAAI,KAAK,CAAC,2CAA2C,CAAC,CAAC;IAC9D,CAAC;AACF,CAAC;AAED,SAAS,QAAQ,CAAC,QAAqB;IACtC,OAAO,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAE,CAAC;AACzC,CAAC;AAED,MAAM,UAAU,iBAAiB,CAAC,QAAiB;IAClD,cAAc,CAAC,QAAQ,CAAC,CAAC;IACzB,MAAM,KAAK,GAAG,QAAQ,CAAC,QAAQ,CAAC,CAAC;IACjC,OAAO,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC;AACxD,CAAC;AAED,MAAM,UAAU,cAAc,CAAC,QAAiB,EAAE,OAAiB;IAClE,cAAc,CAAC,QAAQ,CAAC,CAAC;IACzB,MAAM,KAAK,GAAG,QAAQ,CAAC,QAAQ,CAAC,CAAC;IACjC,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC;QACpB,OAAO;IACR,CAAC;IACD,OAAO,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC;IAC3B,KAAK,CAAC,aAAa,GAAG,KAAK,CAAC;IAC5B,KAAK,CAAC,OAAO,GAAG,OAAO,CAAC;IACxB,KAAK,CAAC,aAAa,CAAC,IAAI,GAAG,CAAC,OAAO,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC;AAC3D,CAAC;AAED,MAAM,UAAU,kBAAkB,CAAC,QAAiB;IACnD,cAAc,CAAC,QAAQ,CAAC,CAAC;IACzB,OAAO,QAAQ,CAAC,aAAa,CAAC,IAAI,UAAU,CAAC,kBAAkB,CAAC,EAAE,CAAgB,CAAC;AACpF,CAAC"}

package/dist/components/collapse-test.d.ts

@@ -1,9 +0,0 @@
-/**
- * Get the content element of a collapse.
- */
-export declare function getCollapseContent(collapse: Element): HTMLDivElement;
-/**
- * Check if a collapse is visible.
- */
-export declare function isCollapseVisible(collapse: Element): boolean;
-//# sourceMappingURL=collapse-test.d.ts.map

package/dist/components/collapse-test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"collapse-test.d.ts","sourceRoot":"","sources":["../../src/components/collapse-test.tsx"],"names":[],"mappings":"AAQA;;GAEG;AACH,wBAAgB,kBAAkB,CAAC,QAAQ,EAAE,OAAO,GAAG,cAAc,CAGpE;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,OAAO,GAAG,OAAO,CAG5D"}

package/dist/components/collapse-test.js

@@ -1,15 +0,0 @@
-import { themeClass } from "../test.js";
-function assertCollapse(collapse) {
-    if (!collapse.matches(`.${themeClass("collapse")}`)) {
-        throw new Error("collapse must be a collapse root element.");
-    }
-}
-export function getCollapseContent(collapse) {
-    assertCollapse(collapse);
-    return collapse.querySelector(`.${themeClass("collapse_content")}`);
-}
-export function isCollapseVisible(collapse) {
-    assertCollapse(collapse);
-    return !collapse.hasAttribute("inert");
-}
-//# sourceMappingURL=collapse-test.js.map

package/dist/components/collapse-test.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"collapse-test.js","sourceRoot":"","sources":["../../src/components/collapse-test.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAExC,SAAS,cAAc,CAAC,QAAiB;IACxC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,UAAU,CAAC,UAAU,CAAC,EAAE,CAAC,EAAE,CAAC;QACrD,MAAM,IAAI,KAAK,CAAC,2CAA2C,CAAC,CAAC;IAC9D,CAAC;AACF,CAAC;AAKD,MAAM,UAAU,kBAAkB,CAAC,QAAiB;IACnD,cAAc,CAAC,QAAQ,CAAC,CAAC;IACzB,OAAO,QAAQ,CAAC,aAAa,CAAiB,IAAI,UAAU,CAAC,kBAAkB,CAAC,EAAE,CAAE,CAAC;AACtF,CAAC;AAKD,MAAM,UAAU,iBAAiB,CAAC,QAAiB;IAClD,cAAc,CAAC,QAAQ,CAAC,CAAC;IACzB,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;AACxC,CAAC"}

package/dist/test.d.ts

@@ -1,4 +0,0 @@
-export * from "./common/theme-test.js";
-export * from "./components/checkbox-test.js";
-export * from "./components/collapse-test.js";
-//# sourceMappingURL=test.d.ts.map

package/dist/test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"test.d.ts","sourceRoot":"","sources":["../src/test.tsx"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,+BAA+B,CAAC"}

package/dist/test.js

@@ -1,4 +0,0 @@
-export * from "./common/theme-test.js";
-export * from "./components/checkbox-test.js";
-export * from "./components/collapse-test.js";
-//# sourceMappingURL=test.js.map

package/dist/test.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"test.js","sourceRoot":"","sources":["../src/test.tsx"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,+BAA+B,CAAC"}