> ## Documentation Index
> Fetch the complete documentation index at: https://zero-true.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Slider

> Learn how to use the Slider component in your applications

<Card title="Example Usage" icon="code">
  ```python theme={null}
  #An Example Slider: 
  from zero_true import Slider


  example = Slider(min=0, max=1, step=0.01, value=0.5, label="Sample_Range")

  ```
</Card>

<Card title="Example Output" icon="computer">
  <iframe src="https://published.zero-true.com/srrey/exampleslider/" width="100%" height="300" />
</Card>

## Overview

`pydantic model zero_true.Slider`

<Note> Slider can provide unique range of values that can be inputed and used elsewhere.</Note>

## JSON Schema

<Accordion title="Field Defenitions">
  ```json theme={null}
  {
     "title": "Slider",
     "description": "A slider component that allows you to capture numeric input from a user",
     "type": "object",
     "properties": {
        "id": {
           "description": "Unique id for a component",
           "title": "Id",
           "type": "string"
        },
        "variable_name": {
           "default": "",
           "description": "Optional variable name associated with a component",
           "title": "Variable Name",
           "type": "string"
        },
        "component": {
           "default": "v-slider",
           "description": "Vue component name",
           "title": "Component",
           "type": "string"
        },
        "value": {
           "anyOf": [
              {
                 "type": "integer"
              },
              {
                 "type": "number"
              }
           ],
           "default": 0,
           "description": "Current value of the slider",
           "title": "Value"
        },
        "min": {
           "anyOf": [
              {
                 "type": "integer"
              },
              {
                 "type": "number"
              }
           ],
           "default": 0,
           "description": "Minimum value of the slider",
           "title": "Min"
        },
        "max": {
           "anyOf": [
              {
                 "type": "integer"
              },
              {
                 "type": "number"
              }
           ],
           "default": 100,
           "description": "Maximum value of the slider",
           "title": "Max"
        },
        "step": {
           "anyOf": [
              {
                 "type": "integer"
              },
              {
                 "type": "number"
              }
           ],
           "default": 1,
           "description": "Step increment of the slider",
           "title": "Step"
        },
        "thumb_label": {
           "default": false,
           "description": "Displays the thumb label",
           "title": "Thumb Label",
           "type": "boolean"
        },
        "thumb_size": {
           "default": 0,
           "description": "Size of the thumb",
           "title": "Thumb Size",
           "type": "integer"
        },
        "tick_labels": {
           "default": "always",
           "description": "Displays the tick labels",
           "title": "Tick Labels",
           "type": "string"
        },
        "ticks": {
           "default": [],
           "description": "Displays the ticks",
           "items": {},
           "title": "Ticks",
           "type": "array"
        },
        "color": {
           "default": "primary",
           "description": "Color of the range slider. Can be custom or standard Material color",
           "pre": true,
           "title": "Color",
           "type": "string"
        },
        "size": {
           "default": "large",
           "description": "Size of the slider",
           "title": "Size",
           "type": "string"
        },
        "label": {
           "anyOf": [
              {
                 "type": "string"
              },
              {
                 "type": "null"
              }
           ],
           "default": null,
           "description": "A label for your slider",
           "title": "Label"
        },
        "rounded": {
           "default": true,
           "description": "Determines if the slider has rounded edges",
           "title": "Rounded",
           "type": "boolean"
        },
        "triggerEvent": {
           "default": "end",
           "description": "Trigger event for when to run the slider",
           "title": "Triggerevent",
           "type": "string"
        }
     },
     "required": [
        "id"
     ]
  }
  ```
</Accordion>

<Info>Bellow are the various attributes you can assign to the component. Utlizing them can allow for modifications to the pre-created object.</Info>

<ResponseField name="zero_true.Slider" type="Zero True Component">
  <Expandable title="properties">
    <AccordionGroup>
      <Accordion title="field color">
        **field color:** str = 'primary'

        Color of the range slider. Can be custom or standard Material color.

        **VALIDATED BY:** validate\_color
      </Accordion>

      <Accordion title="field components">
        **field component:** str = 'v-slider'

        Vue component name.
      </Accordion>

      <Accordion title="field label">
        **field label:** str | None = None

        A label for your slider.
      </Accordion>

      <Accordion title="field max">
        **field max:** int | float = 100

        Maximum value of the slider.
      </Accordion>

      <Accordion title="field min">
        **field min:** int | float = 0

        Minimum value of the slider.
      </Accordion>

      <Accordion title="field rounded">
        **field rounded:** bool = True

        Determines if the slider has rounded edges.
      </Accordion>

      <Accordion title="field size">
        **field size:** str = 'large'

        Size of the slider.
      </Accordion>

      <Accordion title="field step">
        **field step:** int | float = 1

        Step increment of the slider.
      </Accordion>

      <Accordion title="field thumb_label">
        **field thumb\_label:** bool = False

        Displays the thumb label.
      </Accordion>

      <Accordion title="field thumb_size">
        **field thumb\_size:** int = 0

        Size of the thumb.
      </Accordion>

      <Accordion title="field tick_labels">
        **field tick\_labels:** str = 'always'

        Displays the tick labels.
      </Accordion>

      <Accordion title="field ticks">
        **field ticks:** list = \[]

        Displays the ticks.
      </Accordion>

      <Accordion title="field triggerEvent">
        **field triggerEvent:** str = 'end'

        Trigger event for when to run the slider.
      </Accordion>

      <Accordion title="field value">
        **field value:** int | float = 0

        Current value of the slider.
      </Accordion>
    </AccordionGroup>
  </Expandable>
</ResponseField>

<Card title="Methods">
  classmethod *get\_value\_from\_global\_state*(value, values)
</Card>