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

package/schemas/composition/odd-segmented-control.v1.json

@@ -0,0 +1,83 @@
+{
+  "$schema": "https://json-schema.org/draft/2020-12/schema",
+  "$id": "https://oddkin.dev/schemas/composition/odd-segmented-control.v1.json",
+  "title": "odd-segmented-control",
+  "description": "One value from a few short options, drawn as joined segments: the radio-group behavior with a segmented look. Options come from `<option>` children or from `options`; an option with an `icon` (`options` only) shows the icon alone, and its `label` names it.",
+  "type": "object",
+  "additionalProperties": false,
+  "required": [
+    "element"
+  ],
+  "properties": {
+    "element": {
+      "const": "odd-segmented-control"
+    },
+    "id": {
+      "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/id"
+    },
+    "slot": {
+      "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/slot"
+    },
+    "attributes": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "name": {
+          "type": "string",
+          "description": "Name submitted with the form. Reflected: a form-associated element submits under its name attribute."
+        },
+        "disabled": {
+          "type": "boolean",
+          "description": "Prevents interaction and submission.",
+          "default": false
+        },
+        "description": {
+          "type": "string",
+          "description": "Help text below the label.",
+          "default": ""
+        },
+        "error": {
+          "type": "string",
+          "description": "Error message; marks the field invalid (custom validity) while set.",
+          "default": ""
+        },
+        "label": {
+          "type": "string",
+          "description": "Visible label; names the group.",
+          "default": ""
+        },
+        "value": {
+          "type": "string",
+          "description": "Value of the checked option; the `value` attribute sets the default.",
+          "default": ""
+        },
+        "required": {
+          "type": "boolean",
+          "description": "An option must be checked to submit.",
+          "default": false
+        },
+        "size": {
+          "enum": [
+            "sm",
+            "md",
+            "lg"
+          ],
+          "description": "Segment height and padding.",
+          "default": "md"
+        }
+      }
+    },
+    "actions": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "change": {
+          "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/action"
+        },
+        "input": {
+          "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/action"
+        }
+      }
+    }
+  }
+}

package/schemas/composition/odd-select.v1.json

@@ -0,0 +1,79 @@
+{
+  "$schema": "https://json-schema.org/draft/2020-12/schema",
+  "$id": "https://oddkin.dev/schemas/composition/odd-select.v1.json",
+  "title": "odd-select",
+  "description": "A compact choice of one option in a form: a styled native `<select>`, so the engine's own picker, keyboard, and assistive-technology support come with it. Options come from `<option>` and `<optgroup>` children, written as for a native select (`selected` marks the default), or from `options`. Where `appearance: base-select` is supported, the open picker is drawn as Oddkin's raised listbox surface with option rows; elsewhere the engine draws it.",
+  "type": "object",
+  "additionalProperties": false,
+  "required": [
+    "element"
+  ],
+  "properties": {
+    "element": {
+      "const": "odd-select"
+    },
+    "id": {
+      "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/id"
+    },
+    "slot": {
+      "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/slot"
+    },
+    "attributes": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "name": {
+          "type": "string",
+          "description": "Name submitted with the form. Reflected: a form-associated element submits under its name attribute."
+        },
+        "disabled": {
+          "type": "boolean",
+          "description": "Prevents interaction and submission.",
+          "default": false
+        },
+        "description": {
+          "type": "string",
+          "description": "Help text below the label.",
+          "default": ""
+        },
+        "error": {
+          "type": "string",
+          "description": "Error message; marks the field invalid (custom validity) while set.",
+          "default": ""
+        },
+        "label": {
+          "type": "string",
+          "description": "Visible label; names the select.",
+          "default": ""
+        },
+        "value": {
+          "type": "string",
+          "description": "Value of the chosen option; the `value` attribute sets the default.",
+          "default": ""
+        },
+        "placeholder": {
+          "type": "string",
+          "description": "Shown, and submitted as an empty value, until an option is chosen; with `required`, it blocks submission. Never a substitute for a label.",
+          "default": ""
+        },
+        "required": {
+          "type": "boolean",
+          "description": "An option must be chosen to submit.",
+          "default": false
+        }
+      }
+    },
+    "actions": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "change": {
+          "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/action"
+        },
+        "input": {
+          "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/action"
+        }
+      }
+    }
+  }
+}

package/schemas/composition/odd-side-nav.v1.json

@@ -0,0 +1,74 @@
+{
+  "$schema": "https://json-schema.org/draft/2020-12/schema",
+  "$id": "https://oddkin.dev/schemas/composition/odd-side-nav.v1.json",
+  "title": "odd-side-nav",
+  "description": "Side navigation: links, actions, and expandable groups from `.items` (or native links in the default slot), arranged by the `side-nav` layout recipe, which responds to the element's own width with container queries only.",
+  "$comment": "Slots: default, \"footer\", \"header\". A child names a slot with \"slot\"; text and children without \"slot\" go to the default slot.",
+  "type": "object",
+  "additionalProperties": false,
+  "required": [
+    "element"
+  ],
+  "properties": {
+    "element": {
+      "const": "odd-side-nav"
+    },
+    "id": {
+      "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/id"
+    },
+    "slot": {
+      "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/slot"
+    },
+    "attributes": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "label": {
+          "type": "string",
+          "description": "Accessible name of the navigation landmark, e.g. \"Primary\".",
+          "default": ""
+        },
+        "current": {
+          "type": "string",
+          "description": "Id of the current link; it gets `aria-current=\"page\"`.",
+          "default": ""
+        }
+      }
+    },
+    "properties": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "items": {
+          "$ref": "https://oddkin.dev/schemas/components/oddkin.navigation.v1.json",
+          "description": "Entries. When set (even to an empty array) it is the only source; slotted entries are not rendered."
+        },
+        "expanded": {
+          "type": "array",
+          "items": {
+            "type": "string"
+          },
+          "description": "Ids of expanded groups, owned by the caller. Omit it to let the element track expansion."
+        }
+      }
+    },
+    "children": {
+      "type": "array",
+      "items": {
+        "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/node"
+      }
+    },
+    "actions": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "odd-action": {
+          "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/action"
+        },
+        "odd-toggle": {
+          "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/action"
+        }
+      }
+    }
+  }
+}

package/schemas/composition/odd-skeleton.v1.json

@@ -0,0 +1,42 @@
+{
+  "$schema": "https://json-schema.org/draft/2020-12/schema",
+  "$id": "https://oddkin.dev/schemas/composition/odd-skeleton.v1.json",
+  "title": "odd-skeleton",
+  "description": "A content-shaped placeholder while a region loads. Hidden from assistive technology: mark the loading region with `aria-busy=\"true\"` and replace the placeholders when the content arrives.",
+  "type": "object",
+  "additionalProperties": false,
+  "required": [
+    "element"
+  ],
+  "properties": {
+    "element": {
+      "const": "odd-skeleton"
+    },
+    "id": {
+      "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/id"
+    },
+    "slot": {
+      "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/slot"
+    },
+    "attributes": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "shape": {
+          "enum": [
+            "circle",
+            "rect",
+            "text"
+          ],
+          "description": "Text lines, a rectangle, or a circle. Size rect and circle with CSS on the element.",
+          "default": "text"
+        },
+        "lines": {
+          "type": "number",
+          "description": "Number of text lines; the last of several is shorter.",
+          "default": 1
+        }
+      }
+    }
+  }
+}

package/schemas/composition/odd-slider.v1.json

@@ -0,0 +1,98 @@
+{
+  "$schema": "https://json-schema.org/draft/2020-12/schema",
+  "$id": "https://oddkin.dev/schemas/composition/odd-slider.v1.json",
+  "title": "odd-slider",
+  "description": "A number from a bounded range, chosen by dragging a thumb along a track or with the keys, with the current value and both endpoints shown. Drawn as an ARIA slider rather than a native `<input type=\"range\">`, whose track and thumb can only be styled through engine-prefixed pseudo-elements. Values follow the native range: snapped to `step` from `min`, clamped to the range; without a `value` attribute the default is halfway.",
+  "type": "object",
+  "additionalProperties": false,
+  "required": [
+    "element"
+  ],
+  "properties": {
+    "element": {
+      "const": "odd-slider"
+    },
+    "id": {
+      "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/id"
+    },
+    "slot": {
+      "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/slot"
+    },
+    "attributes": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "name": {
+          "type": "string",
+          "description": "Name submitted with the form. Reflected: a form-associated element submits under its name attribute."
+        },
+        "disabled": {
+          "type": "boolean",
+          "description": "Prevents interaction and submission.",
+          "default": false
+        },
+        "description": {
+          "type": "string",
+          "description": "Help text below the label.",
+          "default": ""
+        },
+        "error": {
+          "type": "string",
+          "description": "Error message; marks the field invalid (custom validity) while set.",
+          "default": ""
+        },
+        "label": {
+          "type": "string",
+          "description": "Visible label; names the slider.",
+          "default": ""
+        },
+        "value": {
+          "type": "string",
+          "description": "Initial value; the `value` attribute, as on a native range (default: halfway).",
+          "default": ""
+        },
+        "min": {
+          "type": "number",
+          "description": "Lowest value.",
+          "default": 0
+        },
+        "max": {
+          "type": "number",
+          "description": "Highest value.",
+          "default": 100
+        },
+        "step": {
+          "type": "number",
+          "description": "Granularity, counted from `min`.",
+          "default": 1
+        }
+      }
+    },
+    "properties": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "value": {
+          "type": "string",
+          "description": "The current value, as a string (native range). Setting it detaches it from `defaultValue`."
+        },
+        "valueAsNumber": {
+          "type": "number",
+          "description": "The current value as a number."
+        }
+      }
+    },
+    "actions": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "change": {
+          "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/action"
+        },
+        "input": {
+          "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/action"
+        }
+      }
+    }
+  }
+}

package/schemas/composition/odd-spinner.v1.json

@@ -0,0 +1,64 @@
+{
+  "$schema": "https://json-schema.org/draft/2020-12/schema",
+  "$id": "https://oddkin.dev/schemas/composition/odd-spinner.v1.json",
+  "title": "odd-spinner",
+  "description": "An indeterminate busy indicator with a status label. It never shows a percentage; when the amount of work is known, use `odd-progress`.",
+  "$comment": "Slots: default. A child names a slot with \"slot\"; text and children without \"slot\" go to the default slot.",
+  "type": "object",
+  "additionalProperties": false,
+  "required": [
+    "element"
+  ],
+  "properties": {
+    "element": {
+      "const": "odd-spinner"
+    },
+    "id": {
+      "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/id"
+    },
+    "slot": {
+      "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/slot"
+    },
+    "attributes": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "label": {
+          "type": "string",
+          "description": "Accessible name when there is no visible text; default \"Loading\".",
+          "default": ""
+        },
+        "size": {
+          "enum": [
+            "sm",
+            "md",
+            "lg"
+          ],
+          "description": "Ring size: 16, 20, or 24 px.",
+          "default": "md"
+        }
+      }
+    },
+    "properties": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "strings": {
+          "type": "object",
+          "properties": {
+            "loading": {
+              "type": "string"
+            }
+          },
+          "description": "Localized string overrides."
+        }
+      }
+    },
+    "children": {
+      "type": "array",
+      "items": {
+        "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/node"
+      }
+    }
+  }
+}

package/schemas/composition/odd-split-button.v1.json

@@ -0,0 +1,92 @@
+{
+  "$schema": "https://json-schema.org/draft/2020-12/schema",
+  "$id": "https://oddkin.dev/schemas/composition/odd-split-button.v1.json",
+  "title": "odd-split-button",
+  "description": "A primary action with a menu of related actions beside it: two independent targets in one element, a primary button and a menu button (odd-menu, whose parts it forwards). Menu items come from `<option value>` (the value is the item's `id`), `<optgroup label>`, and `<hr>` children, or from `items`; other children are the primary button's content.",
+  "$comment": "Slots: default. A child names a slot with \"slot\"; text and children without \"slot\" go to the default slot.",
+  "type": "object",
+  "additionalProperties": false,
+  "required": [
+    "element"
+  ],
+  "properties": {
+    "element": {
+      "const": "odd-split-button"
+    },
+    "id": {
+      "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/id"
+    },
+    "slot": {
+      "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/slot"
+    },
+    "attributes": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "value": {
+          "type": "string",
+          "description": "Reported as the `odd-action` detail `id` when the primary half is pressed.",
+          "default": ""
+        },
+        "appearance": {
+          "enum": [
+            "primary",
+            "secondary",
+            "ghost"
+          ],
+          "description": "Visual emphasis of both halves, as on odd-button.",
+          "default": "secondary"
+        },
+        "size": {
+          "enum": [
+            "sm",
+            "md",
+            "lg"
+          ],
+          "description": "Size of both halves, as on odd-button.",
+          "default": "md"
+        },
+        "disabled": {
+          "type": "boolean",
+          "description": "Disables both halves.",
+          "default": false
+        },
+        "loading": {
+          "type": "boolean",
+          "description": "Shows a busy indicator in the primary half, which then ignores presses.",
+          "default": false
+        }
+      }
+    },
+    "properties": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "strings": {
+          "type": "object",
+          "properties": {
+            "more": {
+              "type": "string"
+            }
+          },
+          "description": "Localized string overrides."
+        }
+      }
+    },
+    "children": {
+      "type": "array",
+      "items": {
+        "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/node"
+      }
+    },
+    "actions": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "odd-action": {
+          "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/action"
+        }
+      }
+    }
+  }
+}

package/schemas/composition/odd-split-panel.v1.json

@@ -0,0 +1,95 @@
+{
+  "$schema": "https://json-schema.org/draft/2020-12/schema",
+  "$id": "https://oddkin.dev/schemas/composition/odd-split-panel.v1.json",
+  "title": "odd-split-panel",
+  "description": "Two panes side by side or stacked, with a separator the user drags or moves with the keyboard (APG window splitter). Nest split panels for more panes.",
+  "$comment": "Slots: \"end\", \"start\". A child names a slot with \"slot\"; text and children without \"slot\" go to the default slot.",
+  "type": "object",
+  "additionalProperties": false,
+  "required": [
+    "element"
+  ],
+  "properties": {
+    "element": {
+      "const": "odd-split-panel"
+    },
+    "id": {
+      "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/id"
+    },
+    "slot": {
+      "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/slot"
+    },
+    "attributes": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "orientation": {
+          "enum": [
+            "vertical",
+            "horizontal"
+          ],
+          "description": "Panes side by side (horizontal) or stacked (vertical).",
+          "default": "horizontal"
+        },
+        "position": {
+          "type": "number",
+          "description": "Size of the start pane, in percent of the element, between `min` and `max`.",
+          "default": 50
+        },
+        "min": {
+          "type": "number",
+          "description": "Smallest `position`, in percent.",
+          "default": 0
+        },
+        "max": {
+          "type": "number",
+          "description": "Largest `position`, in percent.",
+          "default": 100
+        },
+        "collapsed": {
+          "type": "boolean",
+          "description": "Hides the start pane; Enter on the separator toggles it, keeping `position`.",
+          "default": false
+        },
+        "label": {
+          "type": "string",
+          "description": "Names the separator.",
+          "default": ""
+        }
+      }
+    },
+    "properties": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "strings": {
+          "type": "object",
+          "properties": {
+            "label": {
+              "type": "string"
+            }
+          },
+          "description": "Localized string overrides."
+        }
+      }
+    },
+    "children": {
+      "type": "array",
+      "items": {
+        "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/node"
+      }
+    },
+    "actions": {
+      "type": "object",
+      "additionalProperties": false,
+      "properties": {
+        "change": {
+          "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/action"
+        },
+        "input": {
+          "$ref": "https://oddkin.dev/schemas/composition/composition.v1.json#/$defs/action"
+        }
+      }
+    }
+  }
+}