> ## 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.

# Timer

<Card title="Example Usage" icon="code">
  ```python theme={null}
  import zero_true as zt
  import time

  # Initialize state
  zt_state = zt.state()
  zt_state.setdefault('timer_triggered', 0)

  # Create a Timer component
  timer = zt.Timer(
    id="sample_timer",
    interval=1000,  # Interval in milliseconds (5000ms = 5s)
    triggerEvent='interval',  # Trigger event based on the interval
    value=True # Start the timer
  )


  # Create a Text component to display the timer's current second
  timer_text = zt.Text(
    id="timer_text",
    text= f"Timer Interval is: {timer.interval}",
    color="primary"
  )

  # Layout including the Timer component
  layout = zt.Layout(rows=[
    zt.Row(components=[timer_text.id])
  ])

  if timer.value:
    timer_text = "Interval Passed!"
  ```
</Card>

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

## Overview

`pydantic model zero_true.Timer`

The Timer component is designed to handle periodic execution of code at specified intervals, providing a robust mechanism for time-based operations without any visual output. This functionality is crucial for applications that require regular updates or checks, such as data polling, automatic refresh, or scheduled tasks. The component is configured via an interval set in milliseconds and can be triggered by specific events, offering precise control over timing operations within web applications.

## JSON Schema

<Accordion title="Field Defenitions">
  ```json theme={null}
  {
     "title": "Timer",
     "description": "Timer is a component that allows for execution of code at a set interval. This does not have any visual output",
     "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-timer",
           "description": "Vue component name",
           "title": "Component",
           "type": "string"
        },
        "interval": {
           "default": 100000,
           "description": "Interval in milliseconds",
           "title": "Interval",
           "type": "integer"
        },
        "value": {
           "default": false,
           "description": "Flag for execution under interval",
           "title": "Value",
           "type": "boolean"
        },
        "triggerEvent": {
           "default": "click",
           "description": "Trigger event for when to execute a run",
           "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.Timer" type="Zero True Component">
  <Expandable title="properties">
    <AccordionGroup>
      <Accordion title="field component">
        **field component:** str = 'v-timer';
        Vue component name.
      </Accordion>

      <Accordion title="field interval">
        **field interval:** int = 100000;
        Interval in milliseconds.
      </Accordion>

      <Accordion title="field triggerEvent">
        **field triggerEvent:** str = 'click';
        Trigger event for when to execute a run.
      </Accordion>

      <Accordion title="field value">
        **field value:** bool = False;
        Flag for execution under interval.
      </Accordion>
    </AccordionGroup>
  </Expandable>
</ResponseField>

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