@oddkin/components 0.0.0-stage → 1.0.0-beta.0

package/dist/icon/icon.d.ts

@@ -0,0 +1,32 @@
+import { OddkinElement } from '@oddkin/core/element';
+import type { Scope } from '@oddkin/core/scope';
+declare const OddkinIcon_base: import("@oddkin/core/element").WithProps<typeof OddkinElement, {
+    readonly src: import("@oddkin/core/element").PropDefinition<string>;
+    readonly label: import("@oddkin/core/element").PropDefinition<string>;
+    readonly size: import("@oddkin/core/element").PropDefinition<"lg" | "md" | "sm">;
+}>;
+/**
+ * An icon drawn in the current text colour: an SVG file by URL (`src`), or an inline `<svg>`
+ * placed inside. Oddkin ships no icon set; bring your own, and pay only for the icons you use.
+ *
+ * @slot - An inline `<svg>`, used when `src` is empty.
+ * @csspart base - The icon box.
+ * @cssprop --odd-icon-size - Edge length; overrides `size`.
+ * @a11y With `label` the icon is an image named by it; without, it is hidden from assistive technology. Beside text that already says the same, leave `label` empty.
+ * @limitation `src` is drawn as a CSS mask, so the page's Content-Security-Policy must allow the URL in `img-src`, and the file's own colours are ignored (one colour, `currentColor`).
+ * @previewRole icon
+ * @useFor Pictograms beside text, or alone with `label`.
+ * @notFor The only name of a control (give the control its own label); decoration that belongs in CSS.
+ * @category Display
+ * @customization 1 2 3
+ */
+export declare class OddkinIcon extends OddkinIcon_base {
+    protected mounted(scope: Scope): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'odd-icon': OddkinIcon;
+    }
+}
+export {};
+//# sourceMappingURL=icon.d.ts.map

package/dist/icon/icon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../src/icon/icon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAQ,MAAM,sBAAsB,CAAC;AAC3D,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;;;;;;AAEhD;;;;;;;;;;;;;;GAcG;AACH,qBAAa,UAAW,SAAQ,eAc9B;IACA,UAAmB,OAAO,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,CAO7C;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,UAAU,CAAC;KACxB;CACF"}

package/dist/icon/icon.define.d.ts

@@ -0,0 +1,3 @@
+/// <reference path="icon.d.ts" preserve="true" />
+export {};
+//# sourceMappingURL=icon.define.d.ts.map

package/dist/icon/icon.define.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.define.d.ts","sourceRoot":"","sources":["../../src/icon/icon.define.ts"],"names":[],"mappings":""}

package/dist/icon/icon.define.js

@@ -0,0 +1,5 @@
+/// <reference path="./icon.ts" preserve="true" />
+import { define } from '@oddkin/core/element';
+import { iconDefinition } from './icon.definition.js';
+define(iconDefinition);
+//# sourceMappingURL=icon.define.js.map

package/dist/icon/icon.define.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.define.js","sourceRoot":"","sources":["../../src/icon/icon.define.ts"],"names":[],"mappings":"AAAA,kDAAkD;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAEtD,MAAM,CAAC,cAAc,CAAC,CAAC"}

package/dist/icon/icon.definition.d.ts

@@ -0,0 +1,3 @@
+import { OddkinIcon } from './icon.js';
+export declare const iconDefinition: import("@oddkin/core/element").ElementDefinition<OddkinIcon>;
+//# sourceMappingURL=icon.definition.d.ts.map

package/dist/icon/icon.definition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.definition.d.ts","sourceRoot":"","sources":["../../src/icon/icon.definition.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAKvC,eAAO,MAAM,cAAc,8DAKzB,CAAC"}

package/dist/icon/icon.definition.js

@@ -0,0 +1,13 @@
+import { compose } from '@oddkin/core/element';
+import { hostStyles } from '../styles/host.styles.js';
+import { OddkinIcon } from './icon.js';
+import { iconStructuralStyles } from './icon.structural.styles.js';
+import { iconStyles } from './icon.styles.js';
+import { iconTemplate } from './icon.template.js';
+export const iconDefinition = compose({
+    name: 'odd-icon',
+    element: OddkinIcon,
+    template: iconTemplate,
+    styles: [hostStyles, iconStructuralStyles, iconStyles],
+});
+//# sourceMappingURL=icon.definition.js.map

package/dist/icon/icon.definition.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.definition.js","sourceRoot":"","sources":["../../src/icon/icon.definition.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AACvC,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAElD,MAAM,CAAC,MAAM,cAAc,GAAG,OAAO,CAAC;IACpC,IAAI,EAAE,UAAU;IAChB,OAAO,EAAE,UAAU;IACnB,QAAQ,EAAE,YAAY;IACtB,MAAM,EAAE,CAAC,UAAU,EAAE,oBAAoB,EAAE,UAAU,CAAC;CACvD,CAAC,CAAC"}

package/dist/icon/icon.js

@@ -0,0 +1,41 @@
+import { OddkinElement, prop } from '@oddkin/core/element';
+/**
+ * An icon drawn in the current text colour: an SVG file by URL (`src`), or an inline `<svg>`
+ * placed inside. Oddkin ships no icon set; bring your own, and pay only for the icons you use.
+ *
+ * @slot - An inline `<svg>`, used when `src` is empty.
+ * @csspart base - The icon box.
+ * @cssprop --odd-icon-size - Edge length; overrides `size`.
+ * @a11y With `label` the icon is an image named by it; without, it is hidden from assistive technology. Beside text that already says the same, leave `label` empty.
+ * @limitation `src` is drawn as a CSS mask, so the page's Content-Security-Policy must allow the URL in `img-src`, and the file's own colours are ignored (one colour, `currentColor`).
+ * @previewRole icon
+ * @useFor Pictograms beside text, or alone with `label`.
+ * @notFor The only name of a control (give the control its own label); decoration that belongs in CSS.
+ * @category Display
+ * @customization 1 2 3
+ */
+export class OddkinIcon extends OddkinElement.with({
+    src: prop.string({
+        default: '',
+        description: 'URL of an SVG, drawn in the current text colour; empty uses the slotted `<svg>`.',
+    }),
+    label: prop.string({
+        default: '',
+        description: 'Accessible name; empty marks the icon decorative.',
+    }),
+    size: prop.enum(['sm', 'md', 'lg'], {
+        default: 'md',
+        reflect: true,
+        description: 'Edge length: 16, 20, or 24 px (the icon size tokens).',
+    }),
+}) {
+    mounted(scope) {
+        scope.effect(() => {
+            const named = this.label !== '';
+            this.internals.role = named ? 'img' : null;
+            this.internals.ariaLabel = named ? this.label : null;
+            this.internals.ariaHidden = named ? null : 'true';
+        });
+    }
+}
+//# sourceMappingURL=icon.js.map

package/dist/icon/icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.js","sourceRoot":"","sources":["../../src/icon/icon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAG3D;;;;;;;;;;;;;;GAcG;AACH,MAAM,OAAO,UAAW,SAAQ,aAAa,CAAC,IAAI,CAAC;IACjD,GAAG,EAAE,IAAI,CAAC,MAAM,CAAC;QACf,OAAO,EAAE,EAAE;QACX,WAAW,EAAE,kFAAkF;KAChG,CAAC;IACF,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC;QACjB,OAAO,EAAE,EAAE;QACX,WAAW,EAAE,mDAAmD;KACjE,CAAC;IACF,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,EAAE;QAClC,OAAO,EAAE,IAAI;QACb,OAAO,EAAE,IAAI;QACb,WAAW,EAAE,uDAAuD;KACrE,CAAC;CACH,CAAC;IACmB,OAAO,CAAC,KAAY;QACrC,KAAK,CAAC,MAAM,CAAC,GAAG,EAAE;YAChB,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,KAAK,EAAE,CAAC;YAChC,IAAI,CAAC,SAAS,CAAC,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC;YAC3C,IAAI,CAAC,SAAS,CAAC,SAAS,GAAG,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC;YACrD,IAAI,CAAC,SAAS,CAAC,UAAU,GAAG,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC;QACpD,CAAC,CAAC,CAAC;IACL,CAAC;CACF"}

package/dist/icon/icon.structural.styles.d.ts

@@ -0,0 +1,6 @@
+/**
+ * The icon box and the mask that draws `src` in `currentColor`; a slotted `<svg>` fills the box.
+ * In forced colours the mask takes the system text colour. No brand or visual tokens.
+ */
+export declare const iconStructuralStyles: import("@oddkin/core/styles").CSSResult;
+//# sourceMappingURL=icon.structural.styles.d.ts.map

package/dist/icon/icon.structural.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.structural.styles.d.ts","sourceRoot":"","sources":["../../src/icon/icon.structural.styles.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,eAAO,MAAM,oBAAoB,yCA4BhC,CAAC"}

package/dist/icon/icon.structural.styles.js

@@ -0,0 +1,35 @@
+import { css } from '@oddkin/core/styles';
+/**
+ * The icon box and the mask that draws `src` in `currentColor`; a slotted `<svg>` fills the box.
+ * In forced colours the mask takes the system text colour. No brand or visual tokens.
+ */
+export const iconStructuralStyles = css `
+  :host {
+    display: inline-block;
+    flex: none;
+    vertical-align: middle;
+    line-height: 0;
+  }
+  .icon,
+  .mask {
+    display: block;
+    inline-size: var(--_icon-size, 1em);
+    block-size: var(--_icon-size, 1em);
+  }
+  .mask {
+    background-color: currentColor;
+    mask: var(--_icon-src) center / contain no-repeat;
+  }
+  ::slotted(svg) {
+    display: block;
+    inline-size: 100%;
+    block-size: 100%;
+  }
+  /* Forced colours replace a currentColor background with Canvas; a system colour is kept. */
+  @media (forced-colors: active) {
+    .mask {
+      background-color: CanvasText;
+    }
+  }
+`;
+//# sourceMappingURL=icon.structural.styles.js.map

package/dist/icon/icon.structural.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.structural.styles.js","sourceRoot":"","sources":["../../src/icon/icon.structural.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAE1C;;;GAGG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4BtC,CAAC"}

package/dist/icon/icon.styles.d.ts

@@ -0,0 +1,3 @@
+/** Oddkin's default icon sizes: Figma `icon` (16, 20, 24 px from `icon.size.*`). */
+export declare const iconStyles: import("@oddkin/core/styles").CSSResult;
+//# sourceMappingURL=icon.styles.d.ts.map

package/dist/icon/icon.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.styles.d.ts","sourceRoot":"","sources":["../../src/icon/icon.styles.ts"],"names":[],"mappings":"AAGA,oFAAoF;AACpF,eAAO,MAAM,UAAU,yCAUtB,CAAC"}

package/dist/icon/icon.styles.js

@@ -0,0 +1,15 @@
+import { css } from '@oddkin/core/styles';
+import { token } from '@oddkin/tokens/refs';
+/** Oddkin's default icon sizes: Figma `icon` (16, 20, 24 px from `icon.size.*`). */
+export const iconStyles = css `
+  :host {
+    --_icon-size: var(--odd-icon-size, ${token('icon.size.md')});
+  }
+  :host([size='sm']) {
+    --_icon-size: var(--odd-icon-size, ${token('icon.size.sm')});
+  }
+  :host([size='lg']) {
+    --_icon-size: var(--odd-icon-size, ${token('icon.size.lg')});
+  }
+`;
+//# sourceMappingURL=icon.styles.js.map

package/dist/icon/icon.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.styles.js","sourceRoot":"","sources":["../../src/icon/icon.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAC1C,OAAO,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAC;AAE5C,oFAAoF;AACpF,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,CAAA;;yCAEY,KAAK,CAAC,cAAc,CAAC;;;yCAGrB,KAAK,CAAC,cAAc,CAAC;;;yCAGrB,KAAK,CAAC,cAAc,CAAC;;CAE7D,CAAC"}

package/dist/icon/icon.template.d.ts

@@ -0,0 +1,4 @@
+import type { OddkinIcon } from './icon.js';
+/** Anatomy: `part="base"`, a mask of `src` in `currentColor`, or the default slot without `src`. */
+export declare const iconTemplate: (icon: OddkinIcon) => import("@oddkin/core/template").TemplateResult;
+//# sourceMappingURL=icon.template.d.ts.map

package/dist/icon/icon.template.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.template.d.ts","sourceRoot":"","sources":["../../src/icon/icon.template.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAM5C,oGAAoG;AACpG,eAAO,MAAM,YAAY,SAAU,UAAU,mDAOzC,CAAC"}

package/dist/icon/icon.template.js

@@ -0,0 +1,11 @@
+import { styleMap } from '@oddkin/core/helpers/style-map';
+import { html } from '@oddkin/core/template';
+/** A CSS `url()` with the characters that could end the string escaped. */
+const cssUrl = (url) => `url("${url.replace(/["\\\n\r\f]/g, (c) => `\\${c.charCodeAt(0).toString(16)} `)}")`;
+/** Anatomy: `part="base"`, a mask of `src` in `currentColor`, or the default slot without `src`. */
+export const iconTemplate = (icon) => html `<span part="base" class="icon"
+    >${icon.src
+    ? html `<span class="mask" style=${styleMap({ '--_icon-src': cssUrl(icon.src) })}></span>`
+    : html `<slot></slot>`}</span
+  >`;
+//# sourceMappingURL=icon.template.js.map

package/dist/icon/icon.template.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.template.js","sourceRoot":"","sources":["../../src/icon/icon.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAC1D,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAG7C,2EAA2E;AAC3E,MAAM,MAAM,GAAG,CAAC,GAAW,EAAE,EAAE,CAC7B,QAAQ,GAAG,CAAC,OAAO,CAAC,cAAc,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,GAAG,CAAC,IAAI,CAAC;AAEvF,oGAAoG;AACpG,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,IAAgB,EAAE,EAAE,CAC/C,IAAI,CAAA;OAEA,IAAI,CAAC,GAAG;IACN,CAAC,CAAC,IAAI,CAAA,4BAA4B,QAAQ,CAAC,EAAE,aAAa,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,UAAU;IACzF,CAAC,CAAC,IAAI,CAAA,eACV;IACA,CAAC"}

package/dist/icon/index.d.ts

@@ -0,0 +1,6 @@
+export { OddkinIcon } from './icon.js';
+export { iconTemplate } from './icon.template.js';
+export { iconStructuralStyles } from './icon.structural.styles.js';
+export { iconStyles } from './icon.styles.js';
+export { iconDefinition } from './icon.definition.js';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/icon/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/icon/index.js

@@ -0,0 +1,7 @@
+// Side-effect free. Register with `@oddkin/components/define/icon`.
+export { OddkinIcon } from './icon.js';
+export { iconTemplate } from './icon.template.js';
+export { iconStructuralStyles } from './icon.structural.styles.js';
+export { iconStyles } from './icon.styles.js';
+export { iconDefinition } from './icon.definition.js';
+//# sourceMappingURL=index.js.map

package/dist/icon/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/icon/index.ts"],"names":[],"mappings":"AAAA,oEAAoE;AACpE,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Workspace skeleton marker (M1). Replaced by real entry points when the
+ * package's milestone implements them; it is not a public API.
+ * @internal
+ */
+export declare const packageName = "@oddkin/components";
+/** @internal Internal packages this package is allowed to depend on. */
+export declare const internalDependencies: readonly string[];
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,eAAO,MAAM,WAAW,uBAAuB,CAAC;AAEhD,wEAAwE;AACxE,eAAO,MAAM,oBAAoB,EAAE,SAAS,MAAM,EAAiC,CAAC"}

package/dist/index.js

@@ -0,0 +1,11 @@
+import { packageName as corePackage } from '@oddkin/core';
+import { packageName as tokensPackage } from '@oddkin/tokens';
+/**
+ * Workspace skeleton marker (M1). Replaced by real entry points when the
+ * package's milestone implements them; it is not a public API.
+ * @internal
+ */
+export const packageName = '@oddkin/components';
+/** @internal Internal packages this package is allowed to depend on. */
+export const internalDependencies = [corePackage, tokensPackage];
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,IAAI,WAAW,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,WAAW,IAAI,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC9D;;;;GAIG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,oBAAoB,CAAC;AAEhD,wEAAwE;AACxE,MAAM,CAAC,MAAM,oBAAoB,GAAsB,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC"}

package/dist/input/foundation.d.ts

@@ -0,0 +1,7 @@
+export { hostStyles } from '../styles/host.styles.js';
+export { fieldStructuralStyles } from '../styles/field.structural.styles.js';
+export { glyphStyles } from '../styles/glyphs.js';
+export { OddkinInput, INPUT_STRINGS, inputEvent, changeEvent } from './input.js';
+export { inputTemplate } from './input.template.js';
+export { inputStructuralStyles } from './input.structural.styles.js';
+//# sourceMappingURL=foundation.d.ts.map

package/dist/input/foundation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"foundation.d.ts","sourceRoot":"","sources":["../../src/input/foundation.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAC7E,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AACjF,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,qBAAqB,EAAE,MAAM,8BAA8B,CAAC"}

package/dist/input/foundation.js

@@ -0,0 +1,9 @@
+// Skin-free foundation: behavior, anatomy, and structural styles (shared host defaults first).
+// Loads no default visual styles and registers nothing (multi-product.md §4).
+export { hostStyles } from '../styles/host.styles.js';
+export { fieldStructuralStyles } from '../styles/field.structural.styles.js';
+export { glyphStyles } from '../styles/glyphs.js';
+export { OddkinInput, INPUT_STRINGS, inputEvent, changeEvent } from './input.js';
+export { inputTemplate } from './input.template.js';
+export { inputStructuralStyles } from './input.structural.styles.js';
+//# sourceMappingURL=foundation.js.map

package/dist/input/foundation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"foundation.js","sourceRoot":"","sources":["../../src/input/foundation.ts"],"names":[],"mappings":"AAAA,+FAA+F;AAC/F,8EAA8E;AAC9E,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAC7E,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AACjF,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,qBAAqB,EAAE,MAAM,8BAA8B,CAAC"}

package/dist/input/index.d.ts

@@ -0,0 +1,6 @@
+export { OddkinInput, INPUT_STRINGS, inputEvent, changeEvent } from './input.js';
+export { inputTemplate } from './input.template.js';
+export { inputStructuralStyles } from './input.structural.styles.js';
+export { inputStyles } from './input.styles.js';
+export { inputDefinition } from './input.definition.js';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/input/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AACjF,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,qBAAqB,EAAE,MAAM,8BAA8B,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC"}

package/dist/input/index.js

@@ -0,0 +1,7 @@
+// Side-effect free. Register with `@oddkin/components/define/input`.
+export { OddkinInput, INPUT_STRINGS, inputEvent, changeEvent } from './input.js';
+export { inputTemplate } from './input.template.js';
+export { inputStructuralStyles } from './input.structural.styles.js';
+export { inputStyles } from './input.styles.js';
+export { inputDefinition } from './input.definition.js';
+//# sourceMappingURL=index.js.map

package/dist/input/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/input/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AACjF,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,qBAAqB,EAAE,MAAM,8BAA8B,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC"}

package/dist/input/input.d.ts

@@ -0,0 +1,110 @@
+import { type ElementEvents } from '@oddkin/core/element';
+import type { FormControlOptions } from '../form-control/form-control.js';
+import { OddkinTextControl, changeEvent, inputEvent } from '../form-control/text-control.js';
+export { changeEvent, inputEvent };
+export declare const INPUT_STRINGS: {
+    clear: string;
+    decrement: string;
+    increment: string;
+    badInput: string;
+};
+declare const OddkinInput_base: import("@oddkin/core/element").WithProps<typeof OddkinTextControl, {
+    readonly type: import("@oddkin/core/element").PropDefinition<"date" | "datetime-local" | "email" | "month" | "number" | "password" | "search" | "tel" | "text" | "time" | "url" | "week">;
+    readonly min: import("@oddkin/core/element").PropDefinition<string | undefined>;
+    readonly max: import("@oddkin/core/element").PropDefinition<string | undefined>;
+    readonly step: import("@oddkin/core/element").PropDefinition<string | undefined>;
+    readonly pattern: import("@oddkin/core/element").PropDefinition<string | undefined>;
+    readonly strings: import("@oddkin/core/element").PropDefinition<Partial<{
+        clear: string;
+        decrement: string;
+        increment: string;
+        badInput: string;
+    }> | undefined>;
+}>;
+/**
+ * A labelled single-line text field that participates in forms like a native input.
+ *
+ * @csspart field - Wrapper of label, description, control, and error.
+ * @csspart label - The visible label.
+ * @csspart description - Help text, referenced by `aria-describedby`.
+ * @csspart control - The native `<input>`.
+ * @csspart icon - The search glyph at the start (`type="search"`).
+ * @csspart clear - The button that clears a search value (`type="search"`), shown while there is a value to clear.
+ * @csspart stepper - The segment at the end of a number field holding its two buttons (`type="number"`).
+ * @csspart decrement - The button that steps a number down, disabled where a step down cannot move the value (`type="number"`).
+ * @csspart increment - The button that steps a number up, disabled where a step up cannot move the value (`type="number"`).
+ * @csspart error - The error message, referenced by `aria-describedby`.
+ * @cssprop --odd-field-height - Minimum height (never below the target-size token). Shared by every form control and the field recipe.
+ * @cssprop --odd-field-radius - Corner radius. Shared by every form control and the field recipe.
+ * @cssprop --odd-field-border-color - Border colour. Shared by every form control and the field recipe.
+ * @cssprop --odd-field-background - Background colour. Shared by every form control and the field recipe.
+ * @cssstate user-invalid - The field shows its error: `error` is set, or the value is invalid after the user left the field or a validity check failed. Matches `aria-invalid` on the inner control; style it with `odd-input:state(user-invalid)`.
+ * @a11y `label` names the native input inside the shadow root; a `<label for>` outside it cannot. Description and error are announced through `aria-describedby`; `aria-invalid` is set for `error`, or for an invalid value after the user leaves the field or a validity check fails (any `invalid` event, including `checkValidity()`, unlike native `:user-invalid`); reset clears it.
+ * @a11y A number field is the WAI-ARIA spinbutton: a text input with `role="spinbutton"`, the decimal input mode (unless the host sets `inputmode`), `aria-valuenow`, `aria-valuemin`, and `aria-valuemax` (and `aria-valuetext` when the text is not the plain number). Its decrement and increment buttons are named by `strings` and are not Tab stops; pressing one keeps focus in the field.
+ * @keyboard Native text-input behavior; arrow keys step a date. In a number field, Up and Down step by `step`, Page Up and Page Down by ten steps, and Home and End go to the lowest and highest values on the grid when `min` and `max` are set; each step that moves the value dispatches `input` and `change`, as a native number field's arrow keys do. In a search field, Escape clears the value (and then reaches outer handlers, such as a dialog, when empty).
+ * @previewRole textInput
+ * @useFor Short values in forms: names, email addresses, search terms, numbers, dates, and times.
+ * @notFor Multi-line text (use odd-textarea); choices from a fixed list (use odd-select or odd-radio-group).
+ * @a11y The global `inputmode`, `enterkeyhint`, `autocapitalize`, `autocorrect`, and `spellcheck` attributes on the host are forwarded to the inner input (`enterkeyhint` defaults to `search` in a search field).
+ * @limitation A number field reads HTML number syntax (a full stop before decimals, an optional exponent), not the page language's format; other text is bad input, which the value and the submission leave out, as in a native number field. Holding a stepper button steps once.
+ * @limitation Validation bubbles anchor to the inner input. `formStateRestoreCallback` restores the value; autofill depends on the inner input's `autocomplete`.
+ * @limitation Enter in the field does not submit the form (no implicit submission): the native input inside the shadow root has no form owner. Give the form a submit button.
+ * @category Forms
+ * @customization 1 2 3
+ */
+export declare class OddkinInput extends OddkinInput_base {
+    #private;
+    readonly _events?: ElementEvents<typeof OddkinInput>;
+    protected _constraints(): unknown[];
+    protected _sanitize(text: string, typed?: boolean): string;
+    protected _formOptions(): FormControlOptions;
+    /** The value as a number (a date or time as milliseconds), as on native inputs; `NaN` when empty. */
+    get valueAsNumber(): number;
+    set valueAsNumber(value: number);
+    /** Steps the value up `n` steps (default 1), as on native inputs; dispatches no events. */
+    stepUp(n?: number): void;
+    /** Steps the value down `n` steps (default 1), as on native inputs; dispatches no events. */
+    stepDown(n?: number): void;
+    /** @internal Template handler: the field took focus. */
+    readonly _onFocus: () => void;
+    /**
+     * @internal Template handler: the user committed a change. As on the native number field, a
+     * number field reports a change of its value, not of text that leaves the value as it was.
+     */
+    readonly _onChange: () => void;
+    /** @internal The number field's ARIA value attributes and which stepper buttons can act. */
+    get _spin(): {
+        now: string | null;
+        text: string | null;
+        min: string | null;
+        max: string | null;
+        down: boolean;
+        up: boolean;
+    };
+    /** @internal The stepper buttons' names. */
+    get _stepLabels(): {
+        decrement: string;
+        increment: string;
+    };
+    /** @internal Template handler: a press on a stepper button leaves focus in the field. */
+    readonly _onStepPress: (event: Event) => void;
+    /** @internal Template handler: a stepper button (its `data-step`); disabled when it cannot act. */
+    readonly _onStep: (event: Event) => void;
+    /** @internal The clear button shows while a search value can be cleared. */
+    get _clearable(): boolean;
+    /** @internal The clear button's name. */
+    get _clearLabel(): string;
+    /** @internal Template handler: the clear button, or Escape in a search field. */
+    readonly _onClear: () => void;
+    /**
+     * @internal Template handler: the number field's stepping keys, and Escape, which clears a
+     * search value as native search fields do.
+     */
+    readonly _onKeydown: (event: KeyboardEvent) => void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'odd-input': OddkinInput;
+    }
+}
+//# sourceMappingURL=input.d.ts.map

package/dist/input/input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../src/input/input.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAEhE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAE1E,OAAO,EAAE,iBAAiB,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAE7F,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,CAAC;AAEnC,eAAO,MAAM,aAAa;IACxB,KAAK;IACL,SAAS;IACT,SAAS;IACT,QAAQ;CACT,CAAC;;;;;;;;;;;;;;AAKF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,qBAAa,WAAY,SAAQ,gBAiC/B;;IACA,SAAiB,OAAO,CAAC,EAAE,aAAa,CAAC,OAAO,WAAW,CAAC,CAAC;IAO7D,UAAmB,YAAY,IAAI,OAAO,EAAE,CAE3C;IAED,UAAmB,SAAS,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,UAAQ,GAAG,MAAM,CAOhE;IAED,UAAmB,YAAY,IAAI,kBAAkB,CAgBpD;IAED,qGAAqG;IACrG,IAAI,aAAa,IAAI,MAAM,CAE1B;IACD,IAAI,aAAa,CAAC,KAAK,EAAE,MAAM,EAI9B;IAED,2FAA2F;IAC3F,MAAM,CAAC,CAAC,CAAC,EAAE,MAAM,GAAG,IAAI,CAEvB;IACD,6FAA6F;IAC7F,QAAQ,CAAC,CAAC,CAAC,EAAE,MAAM,GAAG,IAAI,CAEzB;IAgED,wDAAwD;IACxD,QAAQ,CAAC,QAAQ,QAAO,IAAI,CAE1B;IACF;;;OAGG;IACH,SAAkB,SAAS,QAAO,IAAI,CAIpC;IAEF,4FAA4F;IAC5F,IAAI,KAAK,IAAI;QACX,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;QACnB,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;QACpB,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;QACnB,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;QACnB,IAAI,EAAE,OAAO,CAAC;QACd,EAAE,EAAE,OAAO,CAAC;KACb,CAkBA;IACD,4CAA4C;IAC5C,IAAI,WAAW,IAAI;QAAE,SAAS,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,CAE1D;IACD,yFAAyF;IACzF,QAAQ,CAAC,YAAY,UAAW,KAAK,KAAG,IAAI,CAE1C;IACF,mGAAmG;IACnG,QAAQ,CAAC,OAAO,UAAW,KAAK,KAAG,IAAI,CAIrC;IAEF,4EAA4E;IAC5E,IAAI,UAAU,IAAI,OAAO,CAIxB;IACD,yCAAyC;IACzC,IAAI,WAAW,IAAI,MAAM,CAExB;IACD,iFAAiF;IACjF,QAAQ,CAAC,QAAQ,QAAO,IAAI,CAK1B;IACF;;;OAGG;IACH,QAAQ,CAAC,UAAU,UAAW,aAAa,KAAG,IAAI,CAgBhD;CACH;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,WAAW,CAAC;KAC1B;CACF"}

package/dist/input/input.define.d.ts

@@ -0,0 +1,3 @@
+/// <reference path="input.d.ts" preserve="true" />
+export {};
+//# sourceMappingURL=input.define.d.ts.map

package/dist/input/input.define.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.define.d.ts","sourceRoot":"","sources":["../../src/input/input.define.ts"],"names":[],"mappings":""}

package/dist/input/input.define.js

@@ -0,0 +1,5 @@
+/// <reference path="./input.ts" preserve="true" />
+import { define } from '@oddkin/core/element';
+import { inputDefinition } from './input.definition.js';
+define(inputDefinition);
+//# sourceMappingURL=input.define.js.map

package/dist/input/input.define.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.define.js","sourceRoot":"","sources":["../../src/input/input.define.ts"],"names":[],"mappings":"AAAA,mDAAmD;AACnD,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAExD,MAAM,CAAC,eAAe,CAAC,CAAC"}

package/dist/input/input.definition.d.ts

@@ -0,0 +1,3 @@
+import { OddkinInput } from './input.js';
+export declare const inputDefinition: import("@oddkin/core/element").ElementDefinition<OddkinInput>;
+//# sourceMappingURL=input.definition.d.ts.map

package/dist/input/input.definition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.definition.d.ts","sourceRoot":"","sources":["../../src/input/input.definition.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAKzC,eAAO,MAAM,eAAe,+DAa1B,CAAC"}

package/dist/input/input.definition.js

@@ -0,0 +1,25 @@
+import { compose } from '@oddkin/core/element';
+import { controlStyles } from '../styles/control.styles.js';
+import { fieldStructuralStyles } from '../styles/field.structural.styles.js';
+import { focusRingStyles } from '../styles/focus-ring.styles.js';
+import { glyphStyles } from '../styles/glyphs.js';
+import { hostStyles } from '../styles/host.styles.js';
+import { OddkinInput } from './input.js';
+import { inputStructuralStyles } from './input.structural.styles.js';
+import { inputStyles } from './input.styles.js';
+import { inputTemplate } from './input.template.js';
+export const inputDefinition = compose({
+    name: 'odd-input',
+    element: OddkinInput,
+    template: inputTemplate,
+    styles: [
+        hostStyles,
+        fieldStructuralStyles,
+        inputStructuralStyles,
+        glyphStyles,
+        focusRingStyles,
+        controlStyles,
+        inputStyles,
+    ],
+});
+//# sourceMappingURL=input.definition.js.map

package/dist/input/input.definition.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.definition.js","sourceRoot":"","sources":["../../src/input/input.definition.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAC7E,OAAO,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAC;AACjE,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AACzC,OAAO,EAAE,qBAAqB,EAAE,MAAM,8BAA8B,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEpD,MAAM,CAAC,MAAM,eAAe,GAAG,OAAO,CAAC;IACrC,IAAI,EAAE,WAAW;IACjB,OAAO,EAAE,WAAW;IACpB,QAAQ,EAAE,aAAa;IACvB,MAAM,EAAE;QACN,UAAU;QACV,qBAAqB;QACrB,qBAAqB;QACrB,WAAW;QACX,eAAe;QACf,aAAa;QACb,WAAW;KACZ;CACF,CAAC,CAAC"}