@xtyle/core 0.5.0

package/dist/css/components/swatch.js

@@ -0,0 +1,102 @@
+export const swatchCss = `
+[data-swatch] { display: contents; }
+.xtyle-swatch {
+	display: inline-flex;
+	align-items: center;
+	gap: 0.5em;
+	min-width: 0;
+	position: relative;
+}
+.xtyle-swatch__dot {
+	flex: none;
+	width: 1em;
+	height: 1em;
+	border: var(--border-thin) solid var(--line-2);
+	border-radius: var(--radius-sm);
+}
+.xtyle-swatch__label {
+	color: var(--fg-1);
+	font-size: var(--text-sm);
+	line-height: var(--leading-tight);
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+.xtyle-swatch__value {
+	color: var(--fg-2);
+	font-family: var(--font-mono);
+	font-size: var(--text-xs);
+	line-height: var(--leading-tight);
+	white-space: nowrap;
+}
+.xtyle-swatch--sm { font-size: var(--text-xs); }
+.xtyle-swatch--lg { font-size: var(--text-lg); }
+.xtyle-swatch--interactive {
+	cursor: pointer;
+	border: none;
+	background: none;
+	padding: 0;
+	margin: 0;
+	font: inherit;
+	color: inherit;
+	text-align: left;
+	border-radius: var(--radius-sm);
+}
+.xtyle-swatch--interactive:focus-visible {
+	outline: var(--border-normal) solid transparent;
+	box-shadow: 0 0 0 var(--border-thick) var(--ring);
+}
+.xtyle-swatch--selected .xtyle-swatch__dot {
+	box-shadow:
+		0 0 0 var(--border-thin) var(--bg-1),
+		0 0 0 calc(var(--border-thin) + var(--border-thick)) var(--accent);
+}
+.xtyle-swatch__details {
+	position: absolute;
+	z-index: 1;
+	bottom: 100%;
+	left: 0;
+	margin-bottom: var(--space-2);
+	display: grid;
+	grid-template-columns: auto auto;
+	gap: var(--space-1) var(--space-2);
+	width: max-content;
+	max-width: min(16rem, calc(100vw - var(--space-8)));
+	padding: var(--space-1) var(--space-2);
+	background: var(--surface-overlay);
+	border: var(--border-thin) solid var(--surface-overlay-border);
+	border-radius: var(--radius-md);
+	box-shadow: var(--elevation-2);
+	opacity: 0;
+	visibility: hidden;
+	transition:
+		opacity var(--duration-fast) var(--ease-standard),
+		visibility var(--duration-fast) var(--ease-standard);
+}
+.xtyle-swatch[data-details-below] .xtyle-swatch__details {
+	top: 100%;
+	bottom: auto;
+	margin-top: var(--space-2);
+	margin-bottom: 0;
+}
+.xtyle-swatch:hover .xtyle-swatch__details,
+.xtyle-swatch:focus-within .xtyle-swatch__details {
+	opacity: 1;
+	visibility: visible;
+}
+.xtyle-swatch__detail-model,
+.xtyle-swatch__detail-value {
+	font-size: var(--text-xs);
+	line-height: var(--leading-tight);
+}
+.xtyle-swatch__detail-model {
+	color: var(--fg-2);
+	font-family: var(--font-sans);
+}
+.xtyle-swatch__detail-value {
+	color: var(--fg-1);
+	font-family: var(--font-mono);
+	white-space: nowrap;
+}
+`.trim();
+//# sourceMappingURL=swatch.js.map

package/dist/css/components/swatch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"swatch.js","sourceRoot":"","sources":["../../../src/css/components/swatch.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoGxB,CAAC,IAAI,EAAE,CAAC"}

package/dist/css/components/switch.d.ts

@@ -0,0 +1,2 @@
+export declare const switchCss: string;
+//# sourceMappingURL=switch.d.ts.map

package/dist/css/components/switch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../../src/css/components/switch.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,SAAS,QA4Id,CAAC"}

package/dist/css/components/switch.js

@@ -0,0 +1,144 @@
+import { FULL_TONES } from "../../vocab.js";
+const switchToneVars = FULL_TONES.map((t) => `.xtyle-switch--${t} { --switch-fill: var(--${t}); --switch-ink: var(--${t}-fg); }`).join("\n");
+export const switchCss = `
+.xtyle-switch {
+	--switch-fill: var(--accent);
+	--switch-ink: var(--accent-fg);
+	display: inline-flex;
+	align-items: center;
+	gap: var(--space-2);
+	font-family: var(--font-sans);
+	font-size: var(--text-body);
+	line-height: var(--leading-tight);
+	color: var(--fg-0);
+}
+.xtyle-switch__track {
+	--track-h: var(--space-5);
+	--track-w: var(--space-7);
+	--thumb: calc(var(--track-h) - var(--space-2));
+	appearance: none;
+	flex: none;
+	width: var(--track-w);
+	height: var(--track-h);
+	padding: 0;
+	border: var(--border-thin) solid var(--line-2);
+	border-radius: var(--radius-full);
+	background: var(--neutral-bg);
+	cursor: pointer;
+	position: relative;
+	isolation: isolate;
+	transition:
+		background-color var(--duration-base) var(--ease-emphasized),
+		border-color var(--duration-base) var(--ease-emphasized),
+		box-shadow var(--duration-fast) var(--ease-standard);
+}
+.xtyle-switch__track::after {
+	content: "";
+	position: absolute;
+	inset: 0;
+	border-radius: inherit;
+	background: transparent;
+	transition: background-color var(--duration-fast) var(--ease-standard);
+	z-index: -1;
+}
+.xtyle-switch__thumb {
+	position: absolute;
+	top: 50%;
+	left: var(--space-1);
+	transform: translateY(-50%);
+	width: var(--thumb);
+	height: var(--thumb);
+	border-radius: var(--radius-full);
+	background: var(--switch-ink);
+	background: oklch(from var(--switch-fill) calc(l - 0.28) c h);
+	box-shadow: var(--elevation-1);
+	transition:
+		left var(--duration-base) var(--ease-emphasized),
+		top var(--duration-base) var(--ease-emphasized),
+		background-color var(--duration-base) var(--ease-emphasized);
+}
+.xtyle-switch--sm .xtyle-switch__track {
+	--track-h: var(--space-4);
+	--track-w: var(--space-6);
+}
+.xtyle-switch__track[aria-checked="true"] {
+	background: var(--switch-fill);
+	border-color: var(--switch-fill);
+}
+.xtyle-switch__track[aria-checked="true"] .xtyle-switch__thumb {
+	left: calc(100% - var(--thumb) - var(--space-1));
+}
+.xtyle-switch__track:hover::after { background: var(--state-hover); }
+.xtyle-switch__track:active::after { background: var(--state-press); }
+.xtyle-switch__track:focus-visible {
+	outline: var(--border-normal) solid transparent;
+	box-shadow: 0 0 0 var(--border-thick) var(--ring);
+}
+.xtyle-switch__label {
+	display: inline-flex;
+	align-items: center;
+	cursor: pointer;
+}
+.xtyle-switch__state {
+	color: var(--fg-2);
+	font-size: var(--text-sm);
+}
+.xtyle-switch--disabled {
+	color: var(--fg-disabled);
+}
+.xtyle-switch__track:disabled,
+.xtyle-switch__track[aria-disabled="true"] {
+	cursor: not-allowed;
+	background: var(--state-disabled);
+	border-color: transparent;
+}
+.xtyle-switch__track:disabled .xtyle-switch__thumb,
+.xtyle-switch__track[aria-disabled="true"] .xtyle-switch__thumb {
+	background: var(--fg-disabled);
+	box-shadow: none;
+}
+.xtyle-switch__track:disabled::after,
+.xtyle-switch__track[aria-disabled="true"]::after { background: transparent; }
+.xtyle-switch--disabled .xtyle-switch__label,
+.xtyle-switch--disabled .xtyle-switch__state {
+	cursor: not-allowed;
+}
+.xtyle-switch--label-end {
+	flex-direction: row-reverse;
+}
+.xtyle-switch--square .xtyle-switch__track,
+.xtyle-switch--square .xtyle-switch__thumb {
+	border-radius: var(--radius-sm);
+}
+/* Reverse the on/off direction (polarity); the label is unaffected. Horizontal only —
+ * vertical reverse is handled in the vertical block below. */
+.xtyle-switch--reverse:not(.xtyle-switch--vertical) .xtyle-switch__thumb {
+	left: calc(100% - var(--thumb) - var(--space-1));
+}
+.xtyle-switch--reverse:not(.xtyle-switch--vertical) .xtyle-switch__track[aria-checked="true"] .xtyle-switch__thumb {
+	left: var(--space-1);
+}
+.xtyle-switch--vertical .xtyle-switch__track {
+	width: var(--track-h);
+	height: var(--track-w);
+}
+/* Vertical default follows a wall switch: down = off, up = on. */
+.xtyle-switch--vertical .xtyle-switch__thumb {
+	top: calc(100% - var(--thumb) - var(--space-1));
+	left: 50%;
+	transform: translateX(-50%);
+}
+.xtyle-switch--vertical .xtyle-switch__track[aria-checked="true"] .xtyle-switch__thumb {
+	top: var(--space-1);
+	left: 50%;
+}
+/* Vertical reversed: up = off, down = on. */
+.xtyle-switch--vertical.xtyle-switch--reverse .xtyle-switch__thumb {
+	top: var(--space-1);
+}
+.xtyle-switch--vertical.xtyle-switch--reverse .xtyle-switch__track[aria-checked="true"] .xtyle-switch__thumb {
+	top: calc(100% - var(--thumb) - var(--space-1));
+}
+${switchToneVars}
+`.trim();
+//# sourceMappingURL=switch.js.map

package/dist/css/components/switch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../../src/css/components/switch.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,MAAM,cAAc,GAAG,UAAU,CAAC,GAAG,CACpC,CAAC,CAAC,EAAE,EAAE,CAAC,kBAAkB,CAAC,2BAA2B,CAAC,0BAA0B,CAAC,SAAS,CAC1F,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAEb,MAAM,CAAC,MAAM,SAAS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2IvB,cAAc;CACf,CAAC,IAAI,EAAE,CAAC"}

package/dist/css/components/table.d.ts

@@ -0,0 +1,2 @@
+export declare const tableCss: string;
+//# sourceMappingURL=table.d.ts.map

package/dist/css/components/table.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../../src/css/components/table.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,QAAQ,QA4Ib,CAAC"}

package/dist/css/components/table.js

@@ -0,0 +1,142 @@
+export const tableCss = `
+.xtyle-table-wrap {
+	--xtyle-table-max-height: none;
+	display: block;
+	max-width: 100%;
+	max-height: var(--xtyle-table-max-height);
+	overflow: auto;
+	border-radius: var(--radius-lg);
+}
+.xtyle-table {
+	width: 100%;
+	border-collapse: separate;
+	border-spacing: 0;
+	font-family: var(--font-sans);
+	font-size: var(--text-body);
+	line-height: var(--leading-normal);
+	color: var(--fg-0);
+	background: var(--bg-1);
+}
+.xtyle-table__caption {
+	caption-side: top;
+	text-align: start;
+	padding: var(--space-2) var(--space-4);
+	font-size: var(--text-sm);
+	color: var(--fg-2);
+}
+.xtyle-table__cell,
+.xtyle-table__header-cell {
+	padding: var(--space-3) var(--space-4);
+	text-align: start;
+	vertical-align: middle;
+	border-bottom: var(--border-thin) solid var(--line);
+}
+.xtyle-table__header-cell {
+	font-weight: var(--weight-semibold);
+	color: var(--fg-1);
+	background: var(--bg-2);
+	white-space: nowrap;
+}
+.xtyle-table__head .xtyle-table__row:last-child .xtyle-table__header-cell {
+	border-bottom: var(--border-normal) solid var(--line-2);
+}
+.xtyle-table__row:last-child .xtyle-table__cell {
+	border-bottom: 0;
+}
+.xtyle-table--compact .xtyle-table__cell,
+.xtyle-table--compact .xtyle-table__header-cell {
+	padding: var(--space-1) var(--space-3);
+}
+.xtyle-table--compact .xtyle-table__caption {
+	padding: var(--space-1) var(--space-3);
+}
+.xtyle-table--bordered {
+	border-top: var(--border-thin) solid var(--line);
+	border-left: var(--border-thin) solid var(--line);
+}
+.xtyle-table--bordered .xtyle-table__cell,
+.xtyle-table--bordered .xtyle-table__header-cell {
+	border-right: var(--border-thin) solid var(--line);
+	border-bottom: var(--border-thin) solid var(--line);
+}
+.xtyle-table--bordered .xtyle-table__head .xtyle-table__header-cell {
+	border-bottom: var(--border-normal) solid var(--line-2);
+}
+.xtyle-table--striped .xtyle-table__body .xtyle-table__row:nth-child(odd) {
+	background: var(--bg-1);
+}
+.xtyle-table--striped .xtyle-table__body .xtyle-table__row:nth-child(even) {
+	background: var(--bg-2);
+}
+.xtyle-table--hover .xtyle-table__body .xtyle-table__row {
+	transition: background-color var(--duration-fast) var(--ease-standard);
+}
+.xtyle-table--hover .xtyle-table__body .xtyle-table__row:hover {
+	background: var(--state-hover);
+}
+.xtyle-table--sticky .xtyle-table__head .xtyle-table__header-cell {
+	position: sticky;
+	top: 0;
+	z-index: 1;
+}
+.xtyle-table__header-cell--sortable {
+	cursor: pointer;
+	user-select: none;
+	position: relative;
+	isolation: isolate;
+	transition: background-color var(--duration-fast) var(--ease-standard);
+}
+.xtyle-table__header-cell--sortable::after {
+	content: "";
+	position: absolute;
+	inset: 0;
+	background: transparent;
+	transition: background-color var(--duration-fast) var(--ease-standard);
+	z-index: -1;
+}
+.xtyle-table__header-cell--sortable:hover::after {
+	background: var(--state-hover);
+}
+.xtyle-table__header-cell--sortable:focus-visible {
+	outline: var(--border-normal) solid transparent;
+	box-shadow: inset 0 0 0 var(--border-thick) var(--ring);
+}
+.xtyle-table__header-content {
+	display: inline-flex;
+	align-items: center;
+	gap: var(--space-2);
+}
+.xtyle-table__sort {
+	display: inline-flex;
+	width: 1em;
+	height: 1em;
+	flex: none;
+	color: var(--fg-3);
+	transition:
+		color var(--duration-fast) var(--ease-standard),
+		transform var(--duration-fast) var(--ease-standard);
+}
+.xtyle-table__sort svg {
+	width: 1em;
+	height: 1em;
+}
+.xtyle-table__header-cell[aria-sort="ascending"] .xtyle-table__sort,
+.xtyle-table__header-cell[aria-sort="descending"] .xtyle-table__sort {
+	color: var(--accent-text);
+}
+.xtyle-table__header-cell[aria-sort="descending"] .xtyle-table__sort {
+	transform: rotate(180deg);
+}
+.xtyle-table__footer-cell {
+	padding: var(--space-3) var(--space-4);
+	text-align: start;
+	font-weight: var(--weight-medium);
+	color: var(--fg-1);
+	background: var(--bg-2);
+	border-top: var(--border-normal) solid var(--line-2);
+}
+.xtyle-table--compact .xtyle-table__footer-cell {
+	padding: var(--space-1) var(--space-3);
+}
+`.trim();
+//# sourceMappingURL=table.js.map

package/dist/css/components/table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table.js","sourceRoot":"","sources":["../../../src/css/components/table.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,QAAQ,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4IvB,CAAC,IAAI,EAAE,CAAC"}

package/dist/css/components/tabs.d.ts

@@ -0,0 +1,2 @@
+export declare const tabsCss: string;
+//# sourceMappingURL=tabs.d.ts.map

package/dist/css/components/tabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../../src/css/components/tabs.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO,QA4JZ,CAAC"}

package/dist/css/components/tabs.js

@@ -0,0 +1,158 @@
+export const tabsCss = `
+.xtyle-tabs {
+	display: flex;
+	flex-direction: column;
+	gap: var(--space-3);
+	font-family: var(--font-sans);
+	color: var(--fg-0);
+}
+.xtyle-tabs__tablist {
+	display: flex;
+	align-items: stretch;
+	gap: var(--space-1);
+	position: relative;
+}
+.xtyle-tabs__tab {
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	gap: var(--space-2);
+	font-family: inherit;
+	font-size: var(--text-body);
+	font-weight: var(--weight-medium);
+	line-height: var(--leading-tight);
+	white-space: nowrap;
+	color: var(--fg-2);
+	background: transparent;
+	border: var(--border-thin) solid transparent;
+	border-radius: var(--radius-md);
+	padding: var(--space-2) var(--space-4);
+	cursor: pointer;
+	position: relative;
+	isolation: isolate;
+	transition:
+		color var(--duration-fast) var(--ease-standard),
+		background-color var(--duration-fast) var(--ease-standard),
+		border-color var(--duration-fast) var(--ease-standard),
+		box-shadow var(--duration-fast) var(--ease-standard);
+}
+.xtyle-tabs__tab::after {
+	content: "";
+	position: absolute;
+	inset: 0;
+	border-radius: inherit;
+	background: transparent;
+	transition: background-color var(--duration-fast) var(--ease-standard);
+	z-index: -1;
+}
+.xtyle-tabs__tab:hover { color: var(--fg-0); }
+.xtyle-tabs__tab:hover::after { background: var(--state-hover); }
+.xtyle-tabs__tab:active::after { background: var(--state-press); }
+.xtyle-tabs__tab:focus-visible {
+	outline: var(--border-normal) solid transparent;
+	box-shadow: 0 0 0 var(--border-thick) var(--ring);
+}
+.xtyle-tabs__tab[aria-selected="true"] { color: var(--accent-text); }
+.xtyle-tabs__tab:disabled,
+.xtyle-tabs__tab[aria-disabled="true"] {
+	cursor: not-allowed;
+	color: var(--fg-disabled);
+}
+.xtyle-tabs__tab:disabled::after,
+.xtyle-tabs__tab[aria-disabled="true"]::after { background: transparent; }
+.xtyle-tabs__icon {
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	flex: none;
+}
+.xtyle-tabs__panels {
+	display: grid;
+	grid-template-columns: minmax(0, 1fr);
+}
+.xtyle-tabs__panel {
+	grid-area: 1 / 1;
+	min-width: 0;
+	color: var(--fg-1);
+}
+.xtyle-tabs__panel:focus-visible {
+	outline: var(--border-normal) solid transparent;
+	box-shadow: 0 0 0 var(--border-thick) var(--ring);
+	border-radius: var(--radius-sm);
+}
+.xtyle-tabs__panel[hidden] {
+	display: block;
+	visibility: hidden;
+}
+.xtyle-tabs--underline .xtyle-tabs__tablist {
+	gap: var(--space-2);
+	border-bottom: var(--border-thin) solid var(--line);
+}
+.xtyle-tabs--underline .xtyle-tabs__tab {
+	border-radius: var(--radius-none);
+	border-bottom: var(--border-normal) solid transparent;
+	margin-bottom: calc(-1 * var(--border-thin));
+	padding: var(--space-2) var(--space-2);
+}
+.xtyle-tabs--underline .xtyle-tabs__tab[aria-selected="true"] {
+	color: var(--accent-text);
+	border-bottom-color: var(--accent);
+}
+.xtyle-tabs--pill .xtyle-tabs__tablist {
+	gap: var(--space-1);
+	padding: var(--space-1);
+	background: var(--bg-2);
+	border-radius: var(--radius-lg);
+}
+.xtyle-tabs--pill .xtyle-tabs__tab {
+	border-radius: var(--radius-md);
+}
+.xtyle-tabs--pill .xtyle-tabs__tab[aria-selected="true"] {
+	color: var(--accent-fg);
+	background: var(--accent);
+}
+.xtyle-tabs--pill .xtyle-tabs__tab[aria-selected="true"]:hover::after,
+.xtyle-tabs--pill .xtyle-tabs__tab[aria-selected="true"]:active::after { background: transparent; }
+.xtyle-tabs--enclosed .xtyle-tabs__tablist {
+	gap: var(--space-0);
+	border-bottom: var(--border-thin) solid var(--line);
+}
+.xtyle-tabs--enclosed .xtyle-tabs__tab {
+	border-radius: var(--radius-md) var(--radius-md) var(--radius-none) var(--radius-none);
+	border-color: transparent;
+	margin-bottom: calc(-1 * var(--border-thin));
+}
+.xtyle-tabs--enclosed .xtyle-tabs__tab[aria-selected="true"] {
+	color: var(--accent-text);
+	background: var(--bg-1);
+	border-color: var(--line);
+	border-bottom-color: var(--bg-1);
+}
+.xtyle-tabs--enclosed .xtyle-tabs__tab[aria-selected="true"]:hover::after,
+.xtyle-tabs--enclosed .xtyle-tabs__tab[aria-selected="true"]:active::after { background: transparent; }
+.xtyle-tabs--sm .xtyle-tabs__tab {
+	font-size: var(--text-sm);
+	gap: var(--space-1);
+	padding: var(--space-1) var(--space-3);
+}
+.xtyle-tabs--sm.xtyle-tabs--underline .xtyle-tabs__tab {
+	padding: var(--space-1) var(--space-2);
+}
+.xtyle-tabs--sticky .xtyle-tabs__tablist {
+	position: sticky;
+	top: 0;
+	z-index: 1;
+}
+.xtyle-tabs--sticky.xtyle-tabs--underline .xtyle-tabs__tablist,
+.xtyle-tabs--sticky.xtyle-tabs--enclosed .xtyle-tabs__tablist {
+	background: var(--bg-1);
+}
+@container style(--selection-cue: marker) {
+	.xtyle-tabs__tab[aria-selected="true"]::before {
+		content: "✓";
+		flex: none;
+		font-size: 0.85em;
+	}
+}
+`.trim();
+//# sourceMappingURL=tabs.js.map

package/dist/css/components/tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../../src/css/components/tabs.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,OAAO,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4JtB,CAAC,IAAI,EAAE,CAAC"}

package/dist/css/components/text.d.ts

@@ -0,0 +1,2 @@
+export declare const textCss: string;
+//# sourceMappingURL=text.d.ts.map

package/dist/css/components/text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"text.d.ts","sourceRoot":"","sources":["../../../src/css/components/text.ts"],"names":[],"mappings":"AAeA,eAAO,MAAM,OAAO,QA0BZ,CAAC"}

package/dist/css/components/text.js

@@ -0,0 +1,35 @@
+import { FULL_TONES } from "../../vocab.js";
+const EMPHASIS = [
+    ["muted", "--fg-2"],
+    ["subtle", "--fg-3"],
+];
+const emphasisRules = EMPHASIS.map(([name, token]) => `.xtyle-text--${name} { color: var(${token}); }`).join("\n");
+const toneRules = FULL_TONES.map((t) => `.xtyle-text--${t} { color: var(--${t}-vivid); }`).join("\n");
+export const textCss = `
+[data-text] { display: contents; }
+.xtyle-text {
+	margin: 0;
+	font-family: var(--font-sans);
+	font-size: var(--text-body);
+	font-weight: var(--weight-normal);
+	line-height: var(--leading-normal);
+	color: var(--fg-0);
+}
+.xtyle-text--xs { font-size: var(--text-xs); }
+.xtyle-text--sm { font-size: var(--text-sm); }
+.xtyle-text--body { font-size: var(--text-body); }
+.xtyle-text--lg { font-size: var(--text-lg); }
+.xtyle-text--normal { font-weight: var(--weight-normal); }
+.xtyle-text--medium { font-weight: var(--weight-medium); }
+.xtyle-text--semibold { font-weight: var(--weight-semibold); }
+.xtyle-text--bold { font-weight: var(--weight-bold); }
+.xtyle-text--tight { line-height: var(--leading-tight); }
+.xtyle-text--snug { line-height: var(--leading-normal); }
+.xtyle-text--loose { line-height: var(--leading-loose); }
+${emphasisRules}
+${toneRules}
+.xtyle-text--mono {
+	font-family: var(--font-mono);
+}
+`.trim();
+//# sourceMappingURL=text.js.map

package/dist/css/components/text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text.js","sourceRoot":"","sources":["../../../src/css/components/text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,MAAM,QAAQ,GAAG;IAChB,CAAC,OAAO,EAAE,QAAQ,CAAC;IACnB,CAAC,QAAQ,EAAE,QAAQ,CAAC;CACX,CAAC;AAEX,MAAM,aAAa,GAAG,QAAQ,CAAC,GAAG,CACjC,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,gBAAgB,IAAI,iBAAiB,KAAK,MAAM,CACnE,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAEb,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,CAC/B,CAAC,CAAC,EAAE,EAAE,CAAC,gBAAgB,CAAC,mBAAmB,CAAC,YAAY,CACxD,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAEb,MAAM,CAAC,MAAM,OAAO,GAAG;;;;;;;;;;;;;;;;;;;;;EAqBrB,aAAa;EACb,SAAS;;;;CAIV,CAAC,IAAI,EAAE,CAAC"}

package/dist/css/components/textarea.d.ts

@@ -0,0 +1,2 @@
+export declare const textareaCss: string;
+//# sourceMappingURL=textarea.d.ts.map

package/dist/css/components/textarea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../src/css/components/textarea.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,WAAW,QAuDhB,CAAC"}