### Binding System for Conditional Visibility

Source: https://context7.com/pipangry/starlibv2/llms.txt

Implements conditional visibility and state management based on form data using StarLib's binding utilities. This example demonstrates binding a panel's visibility to a specific data key.

```jsonc
{
  "conditional_panel@global.binding": {
    "$key": "show_advanced",
    "$control": "my_advanced_settings_panel",
    "bindings": [
      {
        "binding_collection_name": "form_buttons",
        "binding_name": "#form_button_text",
        "binding_type": "collection"
      },
      {
        "binding_type": "view",
        "source_property_name": "(not((#form_button_text - $key) = #form_button_text))",
        "target_property_name": "#visible"
      }
    ]
  }
}
```

--------------------------------

### Extract Substrings with Range Binding

Source: https://context7.com/pipangry/starlibv2/llms.txt

Enables the extraction of substrings from form data based on character ranges, useful for displaying partial text content. This component utilizes a range selection binding to precisely define the start and end points for text slicing. It's particularly helpful for formatting long text fields into concise labels or descriptions.

```jsonc
{
  "description_label@global.range_selection_binding": {
    "$from": "10",
    "$to": "50",
    "bindings": [
      {
        "binding_collection_name": "form_buttons",
        "binding_name": "#form_button_text",
        "binding_type": "collection"
      },
      {
        "binding_type": "view",
        "source_property_name": "((('%.' + $to + 's') * #form_button_text) - (('%.' + $from + 's') * #form_button_text)) - '\t'",
        "target_property_name": "#text"
      }
    ]
  }
}
```

--------------------------------

### Build Responsive Grid Layouts

Source: https://context7.com/pipangry/starlibv2/llms.txt

Constructs responsive grid layouts capable of displaying collections of items with automatic sizing and wrapping. This component is ideal for presenting item grids, galleries, or dashboards. It supports different rescaling types, defines item templates, and can bind properties like the maximum number of items in the grid.

```jsonc
{
  "item_grid@global.grid": {
    "$grid_item": "my_grid_item_template",
    "grid_rescaling_type": "horizontal",
    "size": ["100%", "100%c"],
    "bindings": [
      {
        "binding_name_override": "#maximum_grid_items",
        "binding_name": "#form_button_length"
      }
    ]
  },
  "my_grid_item_template@starlib_pkg_button_common.common_button": {
    "size": [64, 64]
  }
}
```

--------------------------------

### Create Search Input Fields

Source: https://context7.com/pipangry/starlibv2/llms.txt

Provides a configurable search input box with placeholder text and an optional clear button. This component is designed for user input and searching within applications. It allows customization of size, placeholder text, and enables a clear button for quick deletion of input content, specifying its control name.

```jsonc
{
  "search_field@starlib_pkg_custom_edit_box.common_search_box": {
    "$COMMON_SEARCH_BOX_size": ["100%", 32],
    "$COMMON_SEARCH_BOX_place_holder_text": "Search items...",
    "$COMMON_SEARCH_BOX_name": "item_search_field",
    "$COMMON_SEARCH_BOX_clear_button_enabled": true,
    "$COMMON_SEARCH_BOX_clear_button_control": "button.clear_search"
  }
}
```

--------------------------------

### Form Template for Complex UI Layouts

Source: https://context7.com/pipangry/starlibv2/llms.txt

Creates customizable forms with header, content, and optional sub-content sections. This template allows for detailed configuration of form size, root size, and background textures.

```jsonc
{
  "my_form@starlib_pkg_screen_template.form_template": {
    "$form_size": [300, 255],
    "$FORM_TEMPLATE_root_size": ["100%", "100%"],
    "$FORM_TEMPLATE_header_control": "starlib_pkg_screen_template.header_template",
    "$FORM_TEMPLATE_content_control": "starlib_pkg_screen_template.content_template",
    "$FORM_TEMPLATE_sub_content_control": "global.empty_panel",
    "$FORM_TEMPLATE_background_texture": "textures/ui/white",
    "$FORM_TEMPLATE_form_background_texture": "textures/ui/form_bg",
    "$FORM_TEMPLATE_between_contents_padding_size": [0, 4],
    "$FORM_TEMPLATE_appear_header_padding": true
  }
}
```

--------------------------------

### Create Dynamic List Items

Source: https://context7.com/pipangry/starlibv2/llms.txt

Generates dynamic list items with customizable padding, backgrounds, and flexible content areas. This component is suitable for data-driven user interfaces where list item appearance needs to adapt based on content or state. It utilizes a factory pattern for item creation and defines specific properties for background textures and padding.

```jsonc
{
  "my_dynamic_list@global.button_factory": {
    "$factory_item": "my_dynamic_item"
  },
  "my_dynamic_item@starlib_pkg_dynamic_structure.dynamic_item_with_background": {
    "$DYNAMIC_ITEM_root_control": "my_item_content",
    "$DYNAMIC_ITEM_background_texture": "textures/ui/item_bg",
    "$DYNAMIC_ITEM_top_padding_key": "show_top_padding",
    "$DYNAMIC_ITEM_top_padding_size": ["100%", 3],
    "$DYNAMIC_ITEM_bottom_padding_key": "show_bottom_padding",
    "$DYNAMIC_ITEM_bottom_padding_size": ["100%", 3],
    "$DYNAMIC_ITEM_side_paddings_size": [5, 0]
  }
}
```

--------------------------------

### Screen Template for JsonUI Forms

Source: https://context7.com/pipangry/starlibv2/llms.txt

Defines the base structure for custom form screens, supporting headers, content areas, fade effects, and background images. It utilizes package templates for screen and form configurations.

```jsonc
{
  "my_custom_screen@starlib_pkg_screen_template.screen": {
    "$SCREEN_TEMPLATE_fade_enabled": true,
    "$SCREEN_TEMPLATE_fade_alpha": 0.3,
    "$SCREEN_TEMPLATE_frame_enabled": true,
    "$SCREEN_TEMPLATE_background_texture": "textures/ui/my_background",
    "$forms_holder_controls": [
      {
        "main_form@starlib_pkg_screen_template.form_template": {
          "$form_size": [300, 255],
          "$FORM_TEMPLATE_header_control": "starlib_pkg_screen_template.header_template",
          "$FORM_TEMPLATE_content_control": "starlib_pkg_screen_template.content_template",
          "$FORM_TEMPLATE_background_texture": "textures/ui/form_background"
        }
      }
    ]
  }
}
```

--------------------------------

### Button Factory for Dynamic Button Lists

Source: https://context7.com/pipangry/starlibv2/llms.txt

Generates dynamic button lists from form data collections using a factory pattern. It defines a custom button structure with styling, content, sounds, and hover effects.

```jsonc
{
  "my_buttons@global.button_factory": {
    "$factory_item": "my_custom_button",
    "size": ["100%", "100%c"]
  },
  "my_custom_button@starlib_pkg_button_common.common_button": {
    "$COMMON_BUTTON_style_control": "starlib_pkg_button_style.common_button_style",
    "$COMMON_BUTTON_content_control": "starlib_pkg_button_common.button_text",
    "$COMMON_BUTTON_sound_name": "random.click",
    "$COMMON_BUTTON_hover_control": "style.hightlight",
    "size": ["100%", 32],
    "bindings": [
      {
        "binding_collection_name": "form_buttons",
        "binding_type": "collection_details"
      }
    ]
  }
}
```

--------------------------------

### Common Button for Interactive UI Elements

Source: https://context7.com/pipangry/starlibv2/llms.txt

Provides a reusable component for interactive buttons, including hover effects, press states, and support for text, images, and custom bindings. This allows for consistent button design across forms.

```jsonc
{
  "my_button@starlib_pkg_button_common.common_button": {
    "size": ["100%", 32],
    "$COMMON_BUTTON_panel_control": "starlib_pkg_button_common.common_button_panel",
    "$COMMON_BUTTON_style_control": "starlib_pkg_button_style.common_button_style",
    "$COMMON_BUTTON_content_control": "my_button_content",
    "$COMMON_BUTTON_sound_name": "random.click",
    "$COMMON_BUTTON_hover_control": "style.hightlight",
    "$COMMON_BUTTON_bindings": [
      {
        "binding_collection_name": "form_buttons",
        "binding_type": "collection_details"
      }
    ]
  },
  "my_button_content": {
    "type": "panel",
    "controls": [
      { "text@starlib_pkg_button_common.button_text": {} },
      { "icon@starlib_pkg_button_common.button_image": { "size": [16, 16] } }
    ]
  }
}
```

--------------------------------

### Create Scrollable Content Panels

Source: https://context7.com/pipangry/starlibv2/llms.txt

Designs scrollable content areas with adjustable scroll bars and viewport sizing, suitable for long lists or content that exceeds screen real estate. This component allows for customization of scroll bar appearance and padding, ensuring a smooth user experience for navigating extensive content. It defines both the scrolling panel and its content template.

```jsonc
{
  "content_scroll@global.scrolling_panel": {
    "$scrolling_content": "my_scrollable_content",
    "$scroll_size": [5, "100%"],
    "$scroll_bar_left_padding_size": [3, 0],
    "$scroll_bar_right_padding_size": [0, 0],
    "$scrolling_pane_size": ["100%", "100%"],
    "size": ["100%", "100%"]
  },
  "my_scrollable_content@starlib_pkg_screen_template.scrolling_content_template": {
    "$SCROLLING_CONTENT_form_text_control": "my_form_text",
    "$SCROLLING_CONTENT_main_control": "global.button_factory"
  }
}
```

--------------------------------

### Implement Custom Toggle Buttons

Source: https://context7.com/pipangry/starlibv2/llms.txt

Implements radio button style toggles for navigation or option selection. This component includes text labels, unique names for state management, and enables radio button behavior for exclusive selection. It is often used in conjunction with a binding to control the visibility of associated content based on the toggle's state.

```jsonc
{
  "tab_toggle@starlib_pkg_custom_toggles.common_toggle": {
    "$COMMON_TOGGLE_size": ["100%", 24],
    "$COMMON_TOGGLE_toggle_text": "Settings",
    "$COMMON_TOGGLE_toggle_name": "main_tabs",
    "$COMMON_TOGGLE_toggle_index": 0,
    "$COMMON_TOGGLE_default_state": 1,
    "$COMMON_TOGGLE_enable_radio": true
  },
  "settings_content@global.binding": {
    "bindings": [
      {
        "binding_type": "view",
        "source_control_name": "main_tabs",
        "source_property_name": "#toggle_state",
        "target_property_name": "#visible"
      }
    ]
  }
}
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.