Numeric slider

IntroductionLinked dataHuman and agentComponents

Controls / clio.slider.v1

Let a person vary a numeric parameter and see the related view change.

Live exampleHow it worksSkill

When to use it

Let a person vary a numeric parameter and see the related view change.

What the agent supplies

A fractional-step numeric control, or a two-value range, with typed value boxes.

The agent chooses the content and binds it to the component. CLIO then renders the view and its available controls.

What the agent receives

The exact output of load_skill, including resolved local definitions.

load_skill("a2ui-catalog-clio-workspace", file="catalog.json#/components/clio.slider.v1")

{
  "allOf": [
    {
      "$ref": "https://a2ui.org/specification/v0_9/common_types.json#/$defs/ComponentCommon"
    },
    {
      "properties": {
        "weight": {
          "description": "Relative flex weight of this component inside a Row or Column. Only meaningful as a direct child of one.",
          "type": "number"
        }
      },
      "type": "object"
    },
    {
      "properties": {
        "component": {
          "const": "clio.slider.v1"
        },
        "label": {
          "$ref": "https://a2ui.org/specification/v0_9/common_types.json#/$defs/DynamicString"
        },
        "max": {
          "type": "number"
        },
        "min": {
          "type": "number"
        },
        "range": {
          "type": "boolean"
        },
        "step": {
          "type": "number"
        },
        "unit": {
          "type": "string"
        },
        "value": {
          "oneOf": [
            {
              "$ref": "https://a2ui.org/specification/v0_9/common_types.json#/$defs/DynamicNumber"
            },
            {
              "items": {
                "type": "number"
              },
              "maxItems": 2,
              "minItems": 2,
              "type": "array"
            }
          ]
        }
      },
      "required": [
        "component",
        "label",
        "value",
        "min",
        "max"
      ],
      "type": "object"
    }
  ],
  "description": "A fractional-step numeric control, or a two-value range, with typed value boxes.",
  "type": "object",
  "unevaluatedProperties": false
}

Standard refs (not loadable here): https://a2ui.org/specification/v0_9/common_types.json#/$defs/ComponentCommon, https://a2ui.org/specification/v0_9/common_types.json#/$defs/DynamicNumber, https://a2ui.org/specification/v0_9/common_types.json#/$defs/DynamicString