diff --git a/404.html b/404.html index 44153e1..8dec52d 100644 --- a/404.html +++ b/404.html @@ -4,13 +4,13 @@ Page Not Found | StudioComponents - - + +
Skip to main content

Page Not Found

We could not find what you were looking for.

Please contact the owner of the site that linked you to the original URL and let them know their link is broken.

- - + + \ No newline at end of file diff --git a/CHANGELOG/index.html b/CHANGELOG/index.html index ac34688..47069b6 100644 --- a/CHANGELOG/index.html +++ b/CHANGELOG/index.html @@ -3,17 +3,17 @@ -Changelog | StudioComponents - - +Changelog | StudioComponents + +
-
Skip to main content

Changelog

1.0.0​

Migrated from Roact to react-lua +

Changelog

Unreleased​

  • Fixed image links in documentation

1.0.0​

Migrated from Roact to react-lua and rewrote the library from the ground up.

There are many API differences; consult the docs on this. Removal of some components was either due to no longer being in scope for this project or requiring an API redesign which didn't make it -into v1.0.0.

Added​

  • Full type annotations
  • Components: DropShadowFrame, LoadingDots, NumberSequencePicker, NumericInput, ProgressBar
  • Hooks: useMouseIcon

Removed​

  • Components: BaseButton, Tooltip, VerticalCollapsibleSection, VerticalExpandingList, Widget, withTheme
  • Contexts: ThemeContext
  • Hooks: usePlugin

0.1.0 - 0.1.4​

Initial release through to the final Roact version. Added various components and changed APIs.

Copyright © 2024 sircfenner. Built with Moonwave and Docusaurus.
- - +into v1.0.0.

Added​

  • Full type annotations
  • Components: DropShadowFrame, LoadingDots, NumberSequencePicker, NumericInput, ProgressBar
  • Hooks: useMouseIcon

Removed​

  • Components: BaseButton, Tooltip, VerticalCollapsibleSection, VerticalExpandingList, Widget, withTheme
  • Contexts: ThemeContext
  • Hooks: usePlugin

0.1.0 - 0.1.4​

Initial release through to the final Roact version. Added various components and changed APIs.

+ + \ No newline at end of file diff --git a/api/Background/index.html b/api/Background/index.html index 89beccf..ecf607a 100644 --- a/api/Background/index.html +++ b/api/Background/index.html @@ -7,7 +7,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/background/dark.png) | ![Light](/components/background/light.png) | +| ![Dark](/StudioComponents/components/background/dark.png) | ![Light](/StudioComponents/components/background/light.png) | Any children passed will be parented to the frame, which makes it suitable for use as, for example, the root component in a plugin Widget. For example: @@ -22,7 +22,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/background/dark.png) | ![Light](/components/background/light.png) | +| ![Dark](/StudioComponents/components/background/dark.png) | ![Light](/StudioComponents/components/background/light.png) | Any children passed will be parented to the frame, which makes it suitable for use as, for example, the root component in a plugin Widget. For example: @@ -34,8 +34,8 @@ }) end ```"> - - + +
@@ -51,10 +51,10 @@ - Dark + Dark - Light + Light @@ -98,13 +98,13 @@ } ], "name": "Background", - "desc": "A borderless frame matching the default background color of Studio widgets.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/components/background/dark.png) | ![Light](/components/background/light.png) |\n\nAny children passed will be parented to the frame, which makes it suitable for use as, \nfor example, the root component in a plugin Widget. For example:\n\n```lua\nlocal function MyComponent()\n\treturn React.createElement(StudioComponents.Background, {}, {\n\t\tMyChild = React.createElement(...),\n\t})\nend\n```", + "desc": "A borderless frame matching the default background color of Studio widgets.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/StudioComponents/components/background/dark.png) | ![Light](/StudioComponents/components/background/light.png) |\n\nAny children passed will be parented to the frame, which makes it suitable for use as, \nfor example, the root component in a plugin Widget. For example:\n\n```lua\nlocal function MyComponent()\n\treturn React.createElement(StudioComponents.Background, {}, {\n\t\tMyChild = React.createElement(...),\n\t})\nend\n```", "source": { "line": 21, "path": "src/Components/Background.luau" } }
- - + + \ No newline at end of file diff --git a/api/Button/index.html b/api/Button/index.html index db2792a..713b8e3 100644 --- a/api/Button/index.html +++ b/api/Button/index.html @@ -8,7 +8,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/button/dark.png) | ![Light](/components/button/light.png) | +| ![Dark](/StudioComponents/components/button/dark.png) | ![Light](/StudioComponents/components/button/light.png) | The `OnActivated` prop should be a callback which is run when the button is clicked. For example: @@ -37,7 +37,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/button/dark.png) | ![Light](/components/button/light.png) | +| ![Dark](/StudioComponents/components/button/dark.png) | ![Light](/StudioComponents/components/button/light.png) | The `OnActivated` prop should be a callback which is run when the button is clicked. For example: @@ -62,8 +62,8 @@ `Enum.AutomaticSize.X` will override the button's width to fit the text and/or icon. Passing a value of `Enum.AutomaticSize.Y` will do the same but with the button's height. Passing `Enum.AutomaticSize.XY` will override both axes."> - - + +
@@ -82,10 +82,10 @@ - Dark + Dark - Light + Light @@ -207,13 +207,13 @@ } ], "name": "Button", - "desc": "A basic button that supports text, an icon, or both. This should be used as a standalone button\nor as a secondary button alongside a [MainButton] for the primary action in a group of options.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/components/button/dark.png) | ![Light](/components/button/light.png) |\n\nThe `OnActivated` prop should be a callback which is run when the button is clicked.\nFor example:\n\n```lua\nlocal function MyComponent()\n\treturn React.createElement(StudioComponents.Button, {\n\t\tText = \"Click Me\",\n\t\tOnActivated = function()\n\t\t\tprint(\"Button clicked!\")\n\t\tend\n\t})\nend\n```\n\nThe default size of buttons can be found in [Constants.DefaultButtonHeight]. To override this,\nthere are two main options, which may be combined:\n1. Pass a `Size` prop.\n2. Pass an `AutomaticSize` prop.\n\nAutomaticSize is a simpler version of Roblox's built-in AutomaticSize system. Passing a value of\n`Enum.AutomaticSize.X` will override the button's width to fit the text and/or icon. Passing a\nvalue of `Enum.AutomaticSize.Y` will do the same but with the button's height. Passing\n`Enum.AutomaticSize.XY` will override both axes.", + "desc": "A basic button that supports text, an icon, or both. This should be used as a standalone button\nor as a secondary button alongside a [MainButton] for the primary action in a group of options.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/StudioComponents/components/button/dark.png) | ![Light](/StudioComponents/components/button/light.png) |\n\nThe `OnActivated` prop should be a callback which is run when the button is clicked.\nFor example:\n\n```lua\nlocal function MyComponent()\n\treturn React.createElement(StudioComponents.Button, {\n\t\tText = \"Click Me\",\n\t\tOnActivated = function()\n\t\t\tprint(\"Button clicked!\")\n\t\tend\n\t})\nend\n```\n\nThe default size of buttons can be found in [Constants.DefaultButtonHeight]. To override this,\nthere are two main options, which may be combined:\n1. Pass a `Size` prop.\n2. Pass an `AutomaticSize` prop.\n\nAutomaticSize is a simpler version of Roblox's built-in AutomaticSize system. Passing a value of\n`Enum.AutomaticSize.X` will override the button's width to fit the text and/or icon. Passing a\nvalue of `Enum.AutomaticSize.Y` will do the same but with the button's height. Passing\n`Enum.AutomaticSize.XY` will override both axes.", "source": { "line": 34, "path": "src/Components/Button.luau" } }
- - + + \ No newline at end of file diff --git a/api/Checkbox/index.html b/api/Checkbox/index.html index f6aed76..2894372 100644 --- a/api/Checkbox/index.html +++ b/api/Checkbox/index.html @@ -8,7 +8,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/checkbox/dark.png) | ![Light](/components/checkbox/light.png) | +| ![Dark](/StudioComponents/components/checkbox/dark.png) | ![Light](/StudioComponents/components/checkbox/light.png) | As this is a controlled component, you should pass a value to the `Value` prop representing whether the box is checked, and a callback value to the `OnChanged` prop which gets run when @@ -48,7 +48,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/checkbox/dark.png) | ![Light](/components/checkbox/light.png) | +| ![Dark](/StudioComponents/components/checkbox/dark.png) | ![Light](/StudioComponents/components/checkbox/light.png) | As this is a controlled component, you should pass a value to the `Value` prop representing whether the box is checked, and a callback value to the `OnChanged` prop which gets run when @@ -84,8 +84,8 @@ have a lower contrast ratio, especially in Dark theme. This component retains the old design as it is more accessible. :::"> - - + +
@@ -104,10 +104,10 @@ - Dark + Dark - Light + Light @@ -207,13 +207,13 @@
- - + + \ No newline at end of file diff --git a/api/ColorPicker/index.html b/api/ColorPicker/index.html index 6a44c03..4770fab 100644 --- a/api/ColorPicker/index.html +++ b/api/ColorPicker/index.html @@ -8,7 +8,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/colorpicker/dark.png) | ![Light](/components/colorpicker/light.png) | +| ![Dark](/StudioComponents/components/colorpicker/dark.png) | ![Light](/StudioComponents/components/colorpicker/light.png) | This is a controlled component, which means the current color should be passed in to the `Color` prop and a callback value to the `OnChanged` prop which gets run when the user attempts @@ -32,7 +32,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/colorpicker/dark.png) | ![Light](/components/colorpicker/light.png) | +| ![Dark](/StudioComponents/components/colorpicker/dark.png) | ![Light](/StudioComponents/components/colorpicker/light.png) | This is a controlled component, which means the current color should be passed in to the `Color` prop and a callback value to the `OnChanged` prop which gets run when the user attempts @@ -52,8 +52,8 @@ To keep all inputs accessible, it is recommended not to use a smaller size than this. This component is not a modal or dialog box (this should be implemented separately)."> - - + +
@@ -72,10 +72,10 @@ - Dark + Dark - Light + Light @@ -132,13 +132,13 @@ } ], "name": "ColorPicker", - "desc": "An interface for selecting a color with a Hue / Saturation box and a Value slider.\nIndividual RGB and HSV values can also be modified manually.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/components/colorpicker/dark.png) | ![Light](/components/colorpicker/light.png) |\n\nThis is a controlled component, which means the current color should be passed in to the\n`Color` prop and a callback value to the `OnChanged` prop which gets run when the user attempts \nto change the color. For example:\n\n```lua\nlocal function MyComponent()\n\tlocal color, setColor = React.useState(Color3.fromHex(\"#008080\"))\n\treturn React.createElement(StudioComponents.ColorPicker, {\n\t\tValue = color,\n\t\tOnChanged = setColor,\n\t})\nend\n```\n\nThe default size of this component is exposed in [Constants.DefaultColorPickerSize].\nTo keep all inputs accessible, it is recommended not to use a smaller size than this.\n\nThis component is not a modal or dialog box (this should be implemented separately).", + "desc": "An interface for selecting a color with a Hue / Saturation box and a Value slider.\nIndividual RGB and HSV values can also be modified manually.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/StudioComponents/components/colorpicker/dark.png) | ![Light](/StudioComponents/components/colorpicker/light.png) |\n\nThis is a controlled component, which means the current color should be passed in to the\n`Color` prop and a callback value to the `OnChanged` prop which gets run when the user attempts \nto change the color. For example:\n\n```lua\nlocal function MyComponent()\n\tlocal color, setColor = React.useState(Color3.fromHex(\"#008080\"))\n\treturn React.createElement(StudioComponents.ColorPicker, {\n\t\tValue = color,\n\t\tOnChanged = setColor,\n\t})\nend\n```\n\nThe default size of this component is exposed in [Constants.DefaultColorPickerSize].\nTo keep all inputs accessible, it is recommended not to use a smaller size than this.\n\nThis component is not a modal or dialog box (this should be implemented separately).", "source": { "line": 29, "path": "src/Components/ColorPicker.luau" } }
- - + + \ No newline at end of file diff --git a/api/CommonProps/index.html b/api/CommonProps/index.html index a74dfdf..3777ff1 100644 --- a/api/CommonProps/index.html +++ b/api/CommonProps/index.html @@ -14,8 +14,8 @@ :::info This file is not exported and serves only to host an internal type and documentation. :::"> - - + +
@@ -87,7 +87,7 @@
- - + + \ No newline at end of file diff --git a/api/Constants/index.html b/api/Constants/index.html index a7118fb..fb0f79c 100644 --- a/api/Constants/index.html +++ b/api/Constants/index.html @@ -16,8 +16,8 @@ :::warning The table returned by this module is read-only. It is not a config. :::"> - - + +
@@ -170,7 +170,7 @@
- - + + \ No newline at end of file diff --git a/api/DropShadowFrame/index.html b/api/DropShadowFrame/index.html index 4a99ea6..1d26d4f 100644 --- a/api/DropShadowFrame/index.html +++ b/api/DropShadowFrame/index.html @@ -10,7 +10,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/dropshadowframe/dark.png) | ![Light](/components/dropshadowframe/light.png) | +| ![Dark](/StudioComponents/components/dropshadowframe/dark.png) | ![Light](/StudioComponents/components/dropshadowframe/light.png) | Any children passed will be parented to the container frame. For example: @@ -28,7 +28,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/dropshadowframe/dark.png) | ![Light](/components/dropshadowframe/light.png) | +| ![Dark](/StudioComponents/components/dropshadowframe/dark.png) | ![Light](/StudioComponents/components/dropshadowframe/light.png) | Any children passed will be parented to the container frame. For example: @@ -40,8 +40,8 @@ }) end ```"> - - + +
@@ -62,10 +62,10 @@ - Dark + Dark - Light + Light @@ -107,13 +107,13 @@ } ], "name": "DropShadowFrame", - "desc": "A container frame equivalent in appearance to a [Background] with a \ndrop shadow in the lower right sides and corner.\nThis matches the appearance of some built-in Roblox Studio elements such as tooltips.\nIt is useful for providing contrast against a background.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/components/dropshadowframe/dark.png) | ![Light](/components/dropshadowframe/light.png) |\n\nAny children passed will be parented to the container frame. For example:\n\n```lua\nlocal function MyComponent()\n\treturn React.createElement(StudioComponents.DropShadowFrame, {}, {\n\t\tMyLabel = React.createElement(StudioComponents.Label, ...),\n\t\tMyCheckbox = React.createElement(StudioComponents.Checkbox, ...),\n\t})\nend\n```", + "desc": "A container frame equivalent in appearance to a [Background] with a \ndrop shadow in the lower right sides and corner.\nThis matches the appearance of some built-in Roblox Studio elements such as tooltips.\nIt is useful for providing contrast against a background.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/StudioComponents/components/dropshadowframe/dark.png) | ![Light](/StudioComponents/components/dropshadowframe/light.png) |\n\nAny children passed will be parented to the container frame. For example:\n\n```lua\nlocal function MyComponent()\n\treturn React.createElement(StudioComponents.DropShadowFrame, {}, {\n\t\tMyLabel = React.createElement(StudioComponents.Label, ...),\n\t\tMyCheckbox = React.createElement(StudioComponents.Checkbox, ...),\n\t})\nend\n```", "source": { "line": 24, "path": "src/Components/DropShadowFrame.luau" } }
- - + + \ No newline at end of file diff --git a/api/Dropdown/index.html b/api/Dropdown/index.html index 69578bc..224e787 100644 --- a/api/Dropdown/index.html +++ b/api/Dropdown/index.html @@ -11,7 +11,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/dropdown/dark.png) | ![Light](/components/dropdown/light.png) | +| ![Dark](/StudioComponents/components/dropdown/dark.png) | ![Light](/StudioComponents/components/dropdown/light.png) | By default, the dropdown list opens below the top section. However, if there is not enough space below, and there is more space above, the dropdown list will open upwards instead. @@ -76,7 +76,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/dropdown/dark.png) | ![Light](/components/dropdown/light.png) | +| ![Dark](/StudioComponents/components/dropdown/dark.png) | ![Light](/StudioComponents/components/dropdown/light.png) | By default, the dropdown list opens below the top section. However, if there is not enough space below, and there is more space above, the dropdown list will open upwards instead. @@ -134,8 +134,8 @@ When using the detailed item format, the value in `SelectedItem` and the values that `OnItemSelected` is called with correspond to the `Id` field of an item in the `Items` array."> - - + +
@@ -156,10 +156,10 @@ - Dark + Dark - Light + Light @@ -352,13 +352,13 @@ } ], "name": "Dropdown", - "desc": "A togglable popup box containing a list of items to select a single item from. \n\nClicking the top section of a dropdown opens the list. Selecting an item, clicking anywhere else, \nor pressing the Escape key will close the dropdown list. The list renders above all other UI\nelements under the same LayerCollector.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/components/dropdown/dark.png) | ![Light](/components/dropdown/light.png) |\n\nBy default, the dropdown list opens below the top section. However, if there is not enough \nspace below, and there is more space above, the dropdown list will open upwards instead. \n\nThe height of the top row can also be customized by passing a `Size` prop. The default size of the \ntop row can be found in [Constants.DefaultDropdownHeight].\n\nThe height of the dropdown list box is determined by the `RowHeight` and `MaxVisibleRows` props.\nThe default height of a list row can be found in [Constants.DefaultDropdownRowHeight].\n\nDropdowns manage their own open/closed state, but otherwise are controlled components.\nThis means that you need to manage the current selected item by passing a value to \n`SelectedItem` and a callback value to `OnItemSelected`. For example:\n\n```lua\nlocal function MyComponent()\n\tlocal selected, setSelected = React.useState(\"Red\")\n\tlocal items = {\t\"Red\", \"Green\", \"Blue\" }\n\treturn React.createElement(StudioComponents.Dropdown, {\n\t\tItems = items,\n\t\tSelectedItem = selected,\n\t\tOnItemSelected = setSelected,\n\t})\nend\n```\n\nDropdowns do not by themselves require a value to always be selected. To explicitly allow the \nselected value to be cleared by the user, set the `ClearButton` prop to `true`. \nMultiple selections are not supported.\n\nThe list of items to select from can be specified either as strings or a [DropdownItemDetail] array.\nUsing the detailed item format allows custom text and icons to be displayed, as seen below:\n\n```lua\nlocal function MyComponent()\n\tlocal items = {\n\t\t{\n\t\t\tId = \"item-1\",\n\t\t\tText = \"First Item\",\n\t\t\tIcon = {\n\t\t\t\tImage = \"rbxassetid://...\",\n\t\t\t\t...\n\t\t\t},\n\t\t},\n\t\t...\n\t}\n\t...\n\treturn React.createElement(StudioComponents.Dropdown, {\n\t\tItems = items,\n\t\tSelectedItem = \"item-1\",\n\t\t...\n\t})\nend\n```\n\nWhen using the detailed item format, the value in `SelectedItem` and the values that\n`OnItemSelected` is called with correspond to the `Id` field of an item in the `Items` array.", + "desc": "A togglable popup box containing a list of items to select a single item from. \n\nClicking the top section of a dropdown opens the list. Selecting an item, clicking anywhere else, \nor pressing the Escape key will close the dropdown list. The list renders above all other UI\nelements under the same LayerCollector.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/StudioComponents/components/dropdown/dark.png) | ![Light](/StudioComponents/components/dropdown/light.png) |\n\nBy default, the dropdown list opens below the top section. However, if there is not enough \nspace below, and there is more space above, the dropdown list will open upwards instead. \n\nThe height of the top row can also be customized by passing a `Size` prop. The default size of the \ntop row can be found in [Constants.DefaultDropdownHeight].\n\nThe height of the dropdown list box is determined by the `RowHeight` and `MaxVisibleRows` props.\nThe default height of a list row can be found in [Constants.DefaultDropdownRowHeight].\n\nDropdowns manage their own open/closed state, but otherwise are controlled components.\nThis means that you need to manage the current selected item by passing a value to \n`SelectedItem` and a callback value to `OnItemSelected`. For example:\n\n```lua\nlocal function MyComponent()\n\tlocal selected, setSelected = React.useState(\"Red\")\n\tlocal items = {\t\"Red\", \"Green\", \"Blue\" }\n\treturn React.createElement(StudioComponents.Dropdown, {\n\t\tItems = items,\n\t\tSelectedItem = selected,\n\t\tOnItemSelected = setSelected,\n\t})\nend\n```\n\nDropdowns do not by themselves require a value to always be selected. To explicitly allow the \nselected value to be cleared by the user, set the `ClearButton` prop to `true`. \nMultiple selections are not supported.\n\nThe list of items to select from can be specified either as strings or a [DropdownItemDetail] array.\nUsing the detailed item format allows custom text and icons to be displayed, as seen below:\n\n```lua\nlocal function MyComponent()\n\tlocal items = {\n\t\t{\n\t\t\tId = \"item-1\",\n\t\t\tText = \"First Item\",\n\t\t\tIcon = {\n\t\t\t\tImage = \"rbxassetid://...\",\n\t\t\t\t...\n\t\t\t},\n\t\t},\n\t\t...\n\t}\n\t...\n\treturn React.createElement(StudioComponents.Dropdown, {\n\t\tItems = items,\n\t\tSelectedItem = \"item-1\",\n\t\t...\n\t})\nend\n```\n\nWhen using the detailed item format, the value in `SelectedItem` and the values that\n`OnItemSelected` is called with correspond to the `Id` field of an item in the `Items` array.", "source": { "line": 71, "path": "src/Components/Dropdown/init.luau" } }
- - + + \ No newline at end of file diff --git a/api/Label/index.html b/api/Label/index.html index ad0a272..0ce8462 100644 --- a/api/Label/index.html +++ b/api/Label/index.html @@ -7,7 +7,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/label/dark.png) | ![Light](/components/label/light.png) | +| ![Dark](/StudioComponents/components/label/dark.png) | ![Light](/StudioComponents/components/label/light.png) | By default, text color matches the current theme's MainText color, which is the color used in the Explorer and Properties widgets as well as most other places. It can be overriden @@ -41,7 +41,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/label/dark.png) | ![Light](/components/label/light.png) | +| ![Dark](/StudioComponents/components/label/dark.png) | ![Light](/StudioComponents/components/label/light.png) | By default, text color matches the current theme's MainText color, which is the color used in the Explorer and Properties widgets as well as most other places. It can be overriden @@ -72,8 +72,8 @@ Labels use [Constants.DefaultFont] for Font and [Constants.DefaultTextSize] for TextSize. This cannot currently be overriden via props."> - - + +
@@ -89,10 +89,10 @@ - Dark + Dark - Light + Light @@ -213,13 +213,13 @@ } ], "name": "Label", - "desc": "A basic text label with default styling to match built-in labels as closely as possible.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/components/label/dark.png) | ![Light](/components/label/light.png) |\n\nBy default, text color matches the current theme's MainText color, which is the color\nused in the Explorer and Properties widgets as well as most other places. It can be overriden\nin two ways:\n1. Passing a [StudioStyleGuideColor](https://create.roblox.com/docs/reference/engine/enums/StudioStyleGuideColor)\nto the `TextColorStyle` prop. This is the preferred way to recolor text\nbecause it will use the correct version of the color for the user's current selected theme.\n2. Passing a [Color3] value to the `TextColor3` prop. This is useful when a color is not represented\nby any StudioStyleGuideColor or should remain constant regardless of theme.\n\nExample of creating an error message label:\n\n```lua\nlocal function MyComponent()\n\treturn React.createElement(StudioComponents.Label, {\n\t\tText = \"Please enter at least 5 characters!\",\n\t\tTextColorStyle = Enum.StudioStyleGuideColor.ErrorText,\n\t})\nend\n```\n\nPlugins like [Theme Color Shower](https://create.roblox.com/store/asset/3115567199/Theme-Color-Shower)\nare useful for finding a StudioStyleGuideColor to use.\n\nThis component will parent any children passed to it to the underlying TextLabel instance.\nThis is useful for things like adding extra padding around the text using a nested UIPadding,\nor adding a UIStroke / UIGradient.\n\nLabels use [Constants.DefaultFont] for Font and [Constants.DefaultTextSize] for TextSize. This\ncannot currently be overriden via props.", + "desc": "A basic text label with default styling to match built-in labels as closely as possible.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/StudioComponents/components/label/dark.png) | ![Light](/StudioComponents/components/label/light.png) |\n\nBy default, text color matches the current theme's MainText color, which is the color\nused in the Explorer and Properties widgets as well as most other places. It can be overriden\nin two ways:\n1. Passing a [StudioStyleGuideColor](https://create.roblox.com/docs/reference/engine/enums/StudioStyleGuideColor)\nto the `TextColorStyle` prop. This is the preferred way to recolor text\nbecause it will use the correct version of the color for the user's current selected theme.\n2. Passing a [Color3] value to the `TextColor3` prop. This is useful when a color is not represented\nby any StudioStyleGuideColor or should remain constant regardless of theme.\n\nExample of creating an error message label:\n\n```lua\nlocal function MyComponent()\n\treturn React.createElement(StudioComponents.Label, {\n\t\tText = \"Please enter at least 5 characters!\",\n\t\tTextColorStyle = Enum.StudioStyleGuideColor.ErrorText,\n\t})\nend\n```\n\nPlugins like [Theme Color Shower](https://create.roblox.com/store/asset/3115567199/Theme-Color-Shower)\nare useful for finding a StudioStyleGuideColor to use.\n\nThis component will parent any children passed to it to the underlying TextLabel instance.\nThis is useful for things like adding extra padding around the text using a nested UIPadding,\nor adding a UIStroke / UIGradient.\n\nLabels use [Constants.DefaultFont] for Font and [Constants.DefaultTextSize] for TextSize. This\ncannot currently be overriden via props.", "source": { "line": 40, "path": "src/Components/Label.luau" } }
- - + + \ No newline at end of file diff --git a/api/LoadingDots/index.html b/api/LoadingDots/index.html index 26856b9..5835725 100644 --- a/api/LoadingDots/index.html +++ b/api/LoadingDots/index.html @@ -10,7 +10,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/loadingdots/dark.gif) | ![Light](/components/loadingdots/light.gif) | +| ![Dark](/StudioComponents/components/loadingdots/dark.gif) | ![Light](/StudioComponents/components/loadingdots/light.gif) | Example of usage: @@ -25,7 +25,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/loadingdots/dark.gif) | ![Light](/components/loadingdots/light.gif) | +| ![Dark](/StudioComponents/components/loadingdots/dark.gif) | ![Light](/StudioComponents/components/loadingdots/light.gif) | Example of usage: @@ -34,8 +34,8 @@ return React.createElement(StudioComponents.LoadingDots, {}) end ```"> - - + +
@@ -56,10 +56,10 @@ - Dark + Dark - Light + Light @@ -93,13 +93,13 @@ } ], "name": "LoadingDots", - "desc": "A basic animated loading indicator. This matches similar indicators used in various places \naround Studio. This should be used for short processes where the user does not need to see\ninformation about how complete the loading is. For longer or more detailed loading processes, \nconsider using a [ProgressBar].\n\n| Dark | Light |\n| - | - |\n| ![Dark](/components/loadingdots/dark.gif) | ![Light](/components/loadingdots/light.gif) |\n\nExample of usage:\n\n```lua\nlocal function MyComponent()\n\treturn React.createElement(StudioComponents.LoadingDots, {})\nend\n```", + "desc": "A basic animated loading indicator. This matches similar indicators used in various places \naround Studio. This should be used for short processes where the user does not need to see\ninformation about how complete the loading is. For longer or more detailed loading processes, \nconsider using a [ProgressBar].\n\n| Dark | Light |\n| - | - |\n| ![Dark](/StudioComponents/components/loadingdots/dark.gif) | ![Light](/StudioComponents/components/loadingdots/light.gif) |\n\nExample of usage:\n\n```lua\nlocal function MyComponent()\n\treturn React.createElement(StudioComponents.LoadingDots, {})\nend\n```", "source": { "line": 21, "path": "src/Components/LoadingDots.luau" } }
- - + + \ No newline at end of file diff --git a/api/MainButton/index.html b/api/MainButton/index.html index f23445a..2124889 100644 --- a/api/MainButton/index.html +++ b/api/MainButton/index.html @@ -8,18 +8,18 @@ | Dark | Light | | - | - | -| ![Dark](/components/mainbutton/dark.png) | ![Light](/components/mainbutton/light.png) | +| ![Dark](/StudioComponents/components/mainbutton/dark.png) | ![Light](/StudioComponents/components/mainbutton/light.png) | See the docs for [Button](#Button) for information about customization and usage."> - - + +
@@ -38,10 +38,10 @@ - Dark + Dark - Light + Light @@ -131,13 +131,13 @@ } ], "name": "MainButton", - "desc": "A variant of a [Button](#Button) used to indicate a primary action, for example an 'OK/Accept' button\nin a modal. \n\n| Dark | Light |\n| - | - |\n| ![Dark](/components/mainbutton/dark.png) | ![Light](/components/mainbutton/light.png) |\n\nSee the docs for [Button](#Button) for information about customization and usage.", + "desc": "A variant of a [Button](#Button) used to indicate a primary action, for example an 'OK/Accept' button\nin a modal. \n\n| Dark | Light |\n| - | - |\n| ![Dark](/StudioComponents/components/mainbutton/dark.png) | ![Light](/StudioComponents/components/mainbutton/light.png) |\n\nSee the docs for [Button](#Button) for information about customization and usage.", "source": { "line": 13, "path": "src/Components/MainButton.luau" } }
- - + + \ No newline at end of file diff --git a/api/NumberSequencePicker/index.html b/api/NumberSequencePicker/index.html index cbaeb68..11c5e67 100644 --- a/api/NumberSequencePicker/index.html +++ b/api/NumberSequencePicker/index.html @@ -9,7 +9,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/numbersequencepicker/dark.png) | ![Light](/components/numbersequencepicker/light.png) | +| ![Dark](/StudioComponents/components/numbersequencepicker/dark.png) | ![Light](/StudioComponents/components/numbersequencepicker/light.png) | As this is a controlled component, you should pass a NumberSequence to the `Value` prop representing the current value, and a callback to the `OnChanged` prop which gets run when the @@ -32,7 +32,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/numbersequencepicker/dark.png) | ![Light](/components/numbersequencepicker/light.png) | +| ![Dark](/StudioComponents/components/numbersequencepicker/dark.png) | ![Light](/StudioComponents/components/numbersequencepicker/light.png) | As this is a controlled component, you should pass a NumberSequence to the `Value` prop representing the current value, and a callback to the `OnChanged` prop which gets run when the @@ -50,8 +50,8 @@ The default size of this component is exposed in [Constants.DefaultNumberSequencePickerSize]. To keep all inputs accessible, it is recommended not to use a smaller size than this."> - - + +
@@ -71,10 +71,10 @@ - Dark + Dark - Light + Light @@ -130,13 +130,13 @@ } ], "name": "NumberSequencePicker", - "desc": "An interface for modifying [NumberSequence](https://create.roblox.com/docs/reference/engine/datatypes/NumberSequence) values.\nThis closely resembles the built-in NumberSequence picker for editing properties, with minor adjustments\nfor improved readability.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/components/numbersequencepicker/dark.png) | ![Light](/components/numbersequencepicker/light.png) |\n\nAs this is a controlled component, you should pass a NumberSequence to the `Value` prop \nrepresenting the current value, and a callback to the `OnChanged` prop which gets run when the \nuser attempts to change the sequence using the interface. For example:\n\n```lua\nlocal function MyComponent()\n\tlocal sequence, setSequence = React.useState(NumberSequence.new(...))\n\treturn React.createElement(StudioComponents.NumberSequencePicker, {\n\t\tValue = sequence,\n\t\tOnChanged = setSequence,\n\t})\nend\n```\n\nThe default size of this component is exposed in [Constants.DefaultNumberSequencePickerSize].\nTo keep all inputs accessible, it is recommended not to use a smaller size than this.", + "desc": "An interface for modifying [NumberSequence](https://create.roblox.com/docs/reference/engine/datatypes/NumberSequence) values.\nThis closely resembles the built-in NumberSequence picker for editing properties, with minor adjustments\nfor improved readability.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/StudioComponents/components/numbersequencepicker/dark.png) | ![Light](/StudioComponents/components/numbersequencepicker/light.png) |\n\nAs this is a controlled component, you should pass a NumberSequence to the `Value` prop \nrepresenting the current value, and a callback to the `OnChanged` prop which gets run when the \nuser attempts to change the sequence using the interface. For example:\n\n```lua\nlocal function MyComponent()\n\tlocal sequence, setSequence = React.useState(NumberSequence.new(...))\n\treturn React.createElement(StudioComponents.NumberSequencePicker, {\n\t\tValue = sequence,\n\t\tOnChanged = setSequence,\n\t})\nend\n```\n\nThe default size of this component is exposed in [Constants.DefaultNumberSequencePickerSize].\nTo keep all inputs accessible, it is recommended not to use a smaller size than this.", "source": { "line": 29, "path": "src/Components/NumberSequencePicker/init.luau" } }
- - + + \ No newline at end of file diff --git a/api/NumericInput/index.html b/api/NumericInput/index.html index 3fa7fbc..10c772b 100644 --- a/api/NumericInput/index.html +++ b/api/NumericInput/index.html @@ -8,7 +8,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/numericinput/dark.png) | ![Light](/components/numericinput/light.png) | +| ![Dark](/StudioComponents/components/numericinput/dark.png) | ![Light](/StudioComponents/components/numericinput/light.png) | This is a controlled component with similar behavior to [TextInput]. The current numeric value @@ -28,7 +28,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/numericinput/dark.png) | ![Light](/components/numericinput/light.png) | +| ![Dark](/StudioComponents/components/numericinput/dark.png) | ![Light](/StudioComponents/components/numericinput/light.png) | This is a controlled component with similar behavior to [TextInput]. The current numeric value @@ -44,8 +44,8 @@ included. If arrows or a slider are displayed, they will increment the value by the amount of the step. Only decimal inputs are allowed (so, for example, hex characters a-f will not be permitted)."> - - + +
@@ -64,10 +64,10 @@ - Dark + Dark - Light + Light @@ -177,13 +177,13 @@ } ], "name": "NumericInput", - "desc": "An input field matching the appearance of a [TextInput] but which filters inputted text to only\nallow numeric values, optionally with arrow and slider controls.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/components/numericinput/dark.png) | ![Light](/components/numericinput/light.png) |\n\n\nThis is a controlled component with similar behavior to [TextInput]. The current numeric value\nto display should be passed to the `Value` prop, and a callback should be passed to the\n`OnValidChanged` prop which is run when the user types a (valid) numeric input.\n\nOptionally, a minimum value can be passed to the `Min` prop, as well as a maximum value to the\n`Max` prop. A step (increment) value may also be passed to the the `Step` prop, which defaults \nto 1 (allowing only whole number values). Passing a non-integer step value will also allow a \ndecimal point to be typed in the input box. \n\nUse the `Arrows` and `Slider` props to specify whether up/down arrows and a slider should be\nincluded. If arrows or a slider are displayed, they will increment the value by the amount of the step. \n\nOnly decimal inputs are allowed (so, for example, hex characters a-f will not be permitted).", + "desc": "An input field matching the appearance of a [TextInput] but which filters inputted text to only\nallow numeric values, optionally with arrow and slider controls.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/StudioComponents/components/numericinput/dark.png) | ![Light](/StudioComponents/components/numericinput/light.png) |\n\n\nThis is a controlled component with similar behavior to [TextInput]. The current numeric value\nto display should be passed to the `Value` prop, and a callback should be passed to the\n`OnValidChanged` prop which is run when the user types a (valid) numeric input.\n\nOptionally, a minimum value can be passed to the `Min` prop, as well as a maximum value to the\n`Max` prop. A step (increment) value may also be passed to the the `Step` prop, which defaults \nto 1 (allowing only whole number values). Passing a non-integer step value will also allow a \ndecimal point to be typed in the input box. \n\nUse the `Arrows` and `Slider` props to specify whether up/down arrows and a slider should be\nincluded. If arrows or a slider are displayed, they will increment the value by the amount of the step. \n\nOnly decimal inputs are allowed (so, for example, hex characters a-f will not be permitted).", "source": { "line": 26, "path": "src/Components/NumericInput.luau" } }
- - + + \ No newline at end of file diff --git a/api/PluginProvider/index.html b/api/PluginProvider/index.html index 3d0f8b2..d8f7d35 100644 --- a/api/PluginProvider/index.html +++ b/api/PluginProvider/index.html @@ -44,8 +44,8 @@ }) end ```"> - - + +
@@ -107,7 +107,7 @@ "path": "src/Components/PluginProvider.luau" } }
- - + + \ No newline at end of file diff --git a/api/ProgressBar/index.html b/api/ProgressBar/index.html index bc7a1f2..afb3d3d 100644 --- a/api/ProgressBar/index.html +++ b/api/ProgressBar/index.html @@ -8,7 +8,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/progressbar/dark.png) | ![Light](/components/progressbar/light.png) | +| ![Dark](/StudioComponents/components/progressbar/dark.png) | ![Light](/StudioComponents/components/progressbar/light.png) | Pass a number representing the current progress into the `Value` prop. You can optionally pass a number representing the maximum value into the `Max` prop, which defaults to 1 if not provided. @@ -46,7 +46,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/progressbar/dark.png) | ![Light](/components/progressbar/light.png) | +| ![Dark](/StudioComponents/components/progressbar/dark.png) | ![Light](/StudioComponents/components/progressbar/light.png) | Pass a number representing the current progress into the `Value` prop. You can optionally pass a number representing the maximum value into the `Max` prop, which defaults to 1 if not provided. @@ -80,8 +80,8 @@ By default, the height of a progress bar is equal to the value in [Constants.DefaultProgressBarHeight]. This can be configured via props."> - - + +
@@ -100,10 +100,10 @@ - Dark + Dark - Light + Light @@ -179,13 +179,13 @@ } ], "name": "ProgressBar", - "desc": "A basic progress indicator. This should be used for longer or more detailed loading processes.\nFor shorter loading processes, consider using a [LoadingDots] component.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/components/progressbar/dark.png) | ![Light](/components/progressbar/light.png) |\n\nPass a number representing the current progress into the `Value` prop. You can optionally pass a \nnumber representing the maximum value into the `Max` prop, which defaults to 1 if not provided. \nThe `Value` prop should be between 0 and `Max`. For example:\n\n```lua\nlocal function MyComponent()\n\treturn React.createElement(StudioComponents.ProgressBar, {\n\t\tValue = 5, -- loaded 5 items\n\t\tMax = 10, -- out of a total of 10 items\n\t})\nend\n```\n\nBy default, the progress bar will display text indicating the progress as a percentage,\nrounded to the nearest whole number. This can be customized by providing a prop to `Formatter`,\nwhich should be a function that takes two numbers representing the current value and the maximum value\nand returns a string to be displayed. For example:\n\n```lua\nlocal function MyComponent()\n\treturn React.createElement(StudioComponents.ProgressBar, {\n\t\tValue = 3,\n\t\tMax = 20,\n\t\tFormatter = function(current, max)\n\t\t\treturn `Loaded {current} / {max} assets...`\n\t\tend,\n\t})\nend\n```\n\nBy default, the height of a progress bar is equal to the value in [Constants.DefaultProgressBarHeight].\nThis can be configured via props.", + "desc": "A basic progress indicator. This should be used for longer or more detailed loading processes.\nFor shorter loading processes, consider using a [LoadingDots] component.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/StudioComponents/components/progressbar/dark.png) | ![Light](/StudioComponents/components/progressbar/light.png) |\n\nPass a number representing the current progress into the `Value` prop. You can optionally pass a \nnumber representing the maximum value into the `Max` prop, which defaults to 1 if not provided. \nThe `Value` prop should be between 0 and `Max`. For example:\n\n```lua\nlocal function MyComponent()\n\treturn React.createElement(StudioComponents.ProgressBar, {\n\t\tValue = 5, -- loaded 5 items\n\t\tMax = 10, -- out of a total of 10 items\n\t})\nend\n```\n\nBy default, the progress bar will display text indicating the progress as a percentage,\nrounded to the nearest whole number. This can be customized by providing a prop to `Formatter`,\nwhich should be a function that takes two numbers representing the current value and the maximum value\nand returns a string to be displayed. For example:\n\n```lua\nlocal function MyComponent()\n\treturn React.createElement(StudioComponents.ProgressBar, {\n\t\tValue = 3,\n\t\tMax = 20,\n\t\tFormatter = function(current, max)\n\t\t\treturn `Loaded {current} / {max} assets...`\n\t\tend,\n\t})\nend\n```\n\nBy default, the height of a progress bar is equal to the value in [Constants.DefaultProgressBarHeight].\nThis can be configured via props.", "source": { "line": 44, "path": "src/Components/ProgressBar.luau" } }
- - + + \ No newline at end of file diff --git a/api/RadioButton/index.html b/api/RadioButton/index.html index 7d48dc7..c4e4f61 100644 --- a/api/RadioButton/index.html +++ b/api/RadioButton/index.html @@ -10,7 +10,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/radiobutton/dark.png) | ![Light](/components/radiobutton/light.png) | +| ![Dark](/StudioComponents/components/radiobutton/dark.png) | ![Light](/StudioComponents/components/radiobutton/light.png) | The props and behavior for this component are the same as [Checkbox]. Importantly, this is also a controlled component, which means it does not manage its own selected state. A value @@ -35,7 +35,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/radiobutton/dark.png) | ![Light](/components/radiobutton/light.png) | +| ![Dark](/StudioComponents/components/radiobutton/dark.png) | ![Light](/StudioComponents/components/radiobutton/light.png) | The props and behavior for this component are the same as [Checkbox]. Importantly, this is also a controlled component, which means it does not manage its own selected state. A value @@ -54,8 +54,8 @@ For more information about customizing this component via props, refer to the documentation for [Checkbox]. The default height for this component is found in [Constants.DefaultToggleHeight]."> - - + +
@@ -76,10 +76,10 @@ - Dark + Dark - Light + Light @@ -151,13 +151,13 @@ } ], "name": "RadioButton", - "desc": "An input element similar to a [Checkbox] which can either be selected or not selected.\nThis should be used for an option in a mutually exclusive group of options (the user can\nonly select one out of the group). This grouping behavior is not included and must be \nimplemented separately.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/components/radiobutton/dark.png) | ![Light](/components/radiobutton/light.png) |\n\nThe props and behavior for this component are the same as [Checkbox]. Importantly, this is\nalso a controlled component, which means it does not manage its own selected state. A value\nmust be passed to the `Value` prop and a callback should be passed to the `OnChanged` prop.\nFor example:\n\n```lua\nlocal function MyComponent()\n\tlocal selected, setSelected = React.useState(false)\n\treturn React.createElement(StudioComponents.RadioButton, {\n\t\tValue = selected,\n\t\tOnChanged = setSelected,\n\t})\nend\n```\n\nFor more information about customizing this component via props, refer to the documentation\nfor [Checkbox]. The default height for this component is found in [Constants.DefaultToggleHeight].", + "desc": "An input element similar to a [Checkbox] which can either be selected or not selected.\nThis should be used for an option in a mutually exclusive group of options (the user can\nonly select one out of the group). This grouping behavior is not included and must be \nimplemented separately.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/StudioComponents/components/radiobutton/dark.png) | ![Light](/StudioComponents/components/radiobutton/light.png) |\n\nThe props and behavior for this component are the same as [Checkbox]. Importantly, this is\nalso a controlled component, which means it does not manage its own selected state. A value\nmust be passed to the `Value` prop and a callback should be passed to the `OnChanged` prop.\nFor example:\n\n```lua\nlocal function MyComponent()\n\tlocal selected, setSelected = React.useState(false)\n\treturn React.createElement(StudioComponents.RadioButton, {\n\t\tValue = selected,\n\t\tOnChanged = setSelected,\n\t})\nend\n```\n\nFor more information about customizing this component via props, refer to the documentation\nfor [Checkbox]. The default height for this component is found in [Constants.DefaultToggleHeight].", "source": { "line": 31, "path": "src/Components/RadioButton.luau" } }
- - + + \ No newline at end of file diff --git a/api/ScrollFrame/index.html b/api/ScrollFrame/index.html index a618d1c..b212931 100644 --- a/api/ScrollFrame/index.html +++ b/api/ScrollFrame/index.html @@ -8,7 +8,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/scrollframe/dark.png) | ![Light](/components/scrollframe/light.png) | +| ![Dark](/StudioComponents/components/scrollframe/dark.png) | ![Light](/StudioComponents/components/scrollframe/light.png) | ScrollFrames automatically size their canvas to fit their contents, which are passed via the `children` parameters in createElement. By default, children are laid out with a [UIListLayout]; @@ -44,7 +44,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/scrollframe/dark.png) | ![Light](/components/scrollframe/light.png) | +| ![Dark](/StudioComponents/components/scrollframe/dark.png) | ![Light](/StudioComponents/components/scrollframe/light.png) | ScrollFrames automatically size their canvas to fit their contents, which are passed via the `children` parameters in createElement. By default, children are laid out with a [UIListLayout]; @@ -76,8 +76,8 @@ The built-in Studio scrollers were changed during this project's lifetime to be significantly narrower. This component retains the old, wider, size because it is more accessible. :::"> - - + +
@@ -96,10 +96,10 @@ - Dark + Dark - Light + Light @@ -207,13 +207,13 @@
- - + + \ No newline at end of file diff --git a/api/Slider/index.html b/api/Slider/index.html index 5b23f13..9aa503c 100644 --- a/api/Slider/index.html +++ b/api/Slider/index.html @@ -9,7 +9,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/slider/dark.png) | ![Light](/components/slider/light.png) | +| ![Dark](/StudioComponents/components/slider/dark.png) | ![Light](/StudioComponents/components/slider/light.png) | As with other components in this library, this is a controlled component. You should pass a value to the `Value` prop representing the current value, as well as a callback to the `OnChanged` @@ -48,7 +48,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/slider/dark.png) | ![Light](/components/slider/light.png) | +| ![Dark](/StudioComponents/components/slider/dark.png) | ![Light](/StudioComponents/components/slider/light.png) | As with other components in this library, this is a controlled component. You should pass a value to the `Value` prop representing the current value, as well as a callback to the `OnChanged` @@ -82,8 +82,8 @@ By default, the height of sliders is equal to the value found in [Constants.DefaultSliderHeight]. While this can be overriden by props, in order to keep inputs accessible it is not recommended to make the component any smaller than this."> - - + +
@@ -103,10 +103,10 @@ - Dark + Dark - Light + Light @@ -208,13 +208,13 @@ } ], "name": "Slider", - "desc": "A component for selecting a numeric value from a range of values with an optional increment.\nThese are seen in some number-valued properties in the built-in Properties widget, as well as in\nvarious built-in plugins such as the Terrain Editor.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/components/slider/dark.png) | ![Light](/components/slider/light.png) |\n\nAs with other components in this library, this is a controlled component. You should pass a\nvalue to the `Value` prop representing the current value, as well as a callback to the `OnChanged`\nprop which will be run when the user changes the value via dragging or clicking on the slider.\n\nIn addition to these, you must also provide a `Min` and a `Max` prop, which together define the\nrange of the slider. Optionally, a `Step` prop can be provided, which defines the increment of\nthe slider. This defaults to 0, which allows any value in the range. For a complete example:\n\n```lua\nlocal function MyComponent()\n\tlocal value, setValue = React.useState(1)\n\treturn React.createElement(StudioComponents.Slider, {\n\t\tValue = value,\n\t\tOnChanged = setValue,\n\t\tMin = 0,\n\t\tMax = 10,\n\t\tStep = 1,\n\t})\nend\n```\n\nTwo further props can optionally be provided:\n1. `Border` determines whether a border is drawn around the component.\nThis is useful for giving visual feedback when the slider is hovered or selected. \n2. `Background` determines whether the component has a visible background.\nIf this is value is missing or set to `false`, any border will also be hidden.\n\nBoth of these props default to `true`.\n\nBy default, the height of sliders is equal to the value found in [Constants.DefaultSliderHeight].\nWhile this can be overriden by props, in order to keep inputs accessible it is not recommended \nto make the component any smaller than this.", + "desc": "A component for selecting a numeric value from a range of values with an optional increment.\nThese are seen in some number-valued properties in the built-in Properties widget, as well as in\nvarious built-in plugins such as the Terrain Editor.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/StudioComponents/components/slider/dark.png) | ![Light](/StudioComponents/components/slider/light.png) |\n\nAs with other components in this library, this is a controlled component. You should pass a\nvalue to the `Value` prop representing the current value, as well as a callback to the `OnChanged`\nprop which will be run when the user changes the value via dragging or clicking on the slider.\n\nIn addition to these, you must also provide a `Min` and a `Max` prop, which together define the\nrange of the slider. Optionally, a `Step` prop can be provided, which defines the increment of\nthe slider. This defaults to 0, which allows any value in the range. For a complete example:\n\n```lua\nlocal function MyComponent()\n\tlocal value, setValue = React.useState(1)\n\treturn React.createElement(StudioComponents.Slider, {\n\t\tValue = value,\n\t\tOnChanged = setValue,\n\t\tMin = 0,\n\t\tMax = 10,\n\t\tStep = 1,\n\t})\nend\n```\n\nTwo further props can optionally be provided:\n1. `Border` determines whether a border is drawn around the component.\nThis is useful for giving visual feedback when the slider is hovered or selected. \n2. `Background` determines whether the component has a visible background.\nIf this is value is missing or set to `false`, any border will also be hidden.\n\nBoth of these props default to `true`.\n\nBy default, the height of sliders is equal to the value found in [Constants.DefaultSliderHeight].\nWhile this can be overriden by props, in order to keep inputs accessible it is not recommended \nto make the component any smaller than this.", "source": { "line": 45, "path": "src/Components/Slider.luau" } }
- - + + \ No newline at end of file diff --git a/api/Splitter/index.html b/api/Splitter/index.html index 126997f..4f91280 100644 --- a/api/Splitter/index.html +++ b/api/Splitter/index.html @@ -9,7 +9,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/splitter/dark.png) | ![Light](/components/splitter/light.png) | +| ![Dark](/StudioComponents/components/splitter/dark.png) | ![Light](/StudioComponents/components/splitter/light.png) | This is a controlled component. The current split location should be passed as a number between 0 and 1 to the `Alpha` prop, and a callback should be passed to the `OnChanged` prop, which @@ -46,7 +46,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/splitter/dark.png) | ![Light](/components/splitter/light.png) | +| ![Dark](/StudioComponents/components/splitter/dark.png) | ![Light](/StudioComponents/components/splitter/light.png) | This is a controlled component. The current split location should be passed as a number between 0 and 1 to the `Alpha` prop, and a callback should be passed to the `OnChanged` prop, which @@ -78,8 +78,8 @@ This component can use your system's splitter mouse icons when interacting with the splitter bar. To enable this behavior, ensure you have rendered a [PluginProvider] somewhere higher up in the tree."> - - + +
@@ -99,10 +99,10 @@ - Dark + Dark - Light + Light @@ -195,13 +195,13 @@ } ], "name": "Splitter", - "desc": "A container frame similar to a [Background] but split into two panels, with a draggable control \nfor\tresizing the panels within the container. Resizing one section to be larger will reduce the\nsize of the other section, and vice versa. This is useful for letting users resize content.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/components/splitter/dark.png) | ![Light](/components/splitter/light.png) |\n\nThis is a controlled component. The current split location should be passed as a number between\n0 and 1 to the `Alpha` prop, and a callback should be passed to the `OnChanged` prop, which\nis run with the new alpha value when the user uses the splitter. \n\nYou can also optionally provide `MinAlpha` and `MaxAlpha` props (numbers between 0 and 1) which\nlimit the resizing. These values default to 0.1 and 0.9.\n\nTo render children in each side, use the `children` parameters in createElement and provide the \nkeys `Side0` and `Side1`. For a complete example:\n\n```lua\nlocal function MyComponent()\n\tlocal division, setDivision = React.useState(0.5)\n\treturn React.createElement(StudioComponents.Splitter, {\n\t\tAlpha = division,\n\t\tOnChanged = setDivision,\n\t}, {\n\t\tSide0 = React.createElement(...),\n\t\tSide1 = React.createElement(...),\n\t})\nend\n```\n\nBy default, the split is horizontal, which means that the frame is split into a left and right\nside. This can be changed, for example to a vertical split (top and bottom), by providing an \n[Enum.FillDirection] value to the `FillDirection` prop.\n\nThis component can use your system's splitter mouse icons when interacting with the splitter bar. \nTo enable this behavior, ensure you have rendered a [PluginProvider] somewhere higher up in \nthe tree.", + "desc": "A container frame similar to a [Background] but split into two panels, with a draggable control \nfor\tresizing the panels within the container. Resizing one section to be larger will reduce the\nsize of the other section, and vice versa. This is useful for letting users resize content.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/StudioComponents/components/splitter/dark.png) | ![Light](/StudioComponents/components/splitter/light.png) |\n\nThis is a controlled component. The current split location should be passed as a number between\n0 and 1 to the `Alpha` prop, and a callback should be passed to the `OnChanged` prop, which\nis run with the new alpha value when the user uses the splitter. \n\nYou can also optionally provide `MinAlpha` and `MaxAlpha` props (numbers between 0 and 1) which\nlimit the resizing. These values default to 0.1 and 0.9.\n\nTo render children in each side, use the `children` parameters in createElement and provide the \nkeys `Side0` and `Side1`. For a complete example:\n\n```lua\nlocal function MyComponent()\n\tlocal division, setDivision = React.useState(0.5)\n\treturn React.createElement(StudioComponents.Splitter, {\n\t\tAlpha = division,\n\t\tOnChanged = setDivision,\n\t}, {\n\t\tSide0 = React.createElement(...),\n\t\tSide1 = React.createElement(...),\n\t})\nend\n```\n\nBy default, the split is horizontal, which means that the frame is split into a left and right\nside. This can be changed, for example to a vertical split (top and bottom), by providing an \n[Enum.FillDirection] value to the `FillDirection` prop.\n\nThis component can use your system's splitter mouse icons when interacting with the splitter bar. \nTo enable this behavior, ensure you have rendered a [PluginProvider] somewhere higher up in \nthe tree.", "source": { "line": 43, "path": "src/Components/Splitter.luau" } }
- - + + \ No newline at end of file diff --git a/api/TabContainer/index.html b/api/TabContainer/index.html index 8daf757..583ab1a 100644 --- a/api/TabContainer/index.html +++ b/api/TabContainer/index.html @@ -8,7 +8,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/tabcontainer/dark.png) | ![Light](/components/tabcontainer/light.png) | +| ![Dark](/StudioComponents/components/tabcontainer/dark.png) | ![Light](/StudioComponents/components/tabcontainer/light.png) | This is a controlled component. The identifier of the selected tab should be passed to the `SelectedTab` prop, and a callback should be passed to the `OnTabSelected` prop which is run @@ -52,7 +52,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/tabcontainer/dark.png) | ![Light](/components/tabcontainer/light.png) | +| ![Dark](/StudioComponents/components/tabcontainer/dark.png) | ![Light](/StudioComponents/components/tabcontainer/light.png) | This is a controlled component. The identifier of the selected tab should be passed to the `SelectedTab` prop, and a callback should be passed to the `OnTabSelected` prop which is run @@ -92,8 +92,8 @@ uses the common elements of those designs and has small tweaks to stay consistent with the wider design of Studio elements. :::"> - - + +
@@ -112,10 +112,10 @@ - Dark + Dark - Light + Light @@ -232,13 +232,13 @@
- - + + \ No newline at end of file diff --git a/api/TextInput/index.html b/api/TextInput/index.html index 764a2b2..0f442b9 100644 --- a/api/TextInput/index.html +++ b/api/TextInput/index.html @@ -8,7 +8,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/textinput/dark.png) | ![Light](/components/textinput/light.png) | +| ![Dark](/StudioComponents/components/textinput/dark.png) | ![Light](/StudioComponents/components/textinput/light.png) | This is a controlled component, which means the current text should be passed in to the `Text` prop and a callback value to the `OnChanged` prop which gets run when the user attempts @@ -49,7 +49,7 @@ | Dark | Light | | - | - | -| ![Dark](/components/textinput/dark.png) | ![Light](/components/textinput/light.png) | +| ![Dark](/StudioComponents/components/textinput/dark.png) | ![Light](/StudioComponents/components/textinput/light.png) | This is a controlled component, which means the current text should be passed in to the `Text` prop and a callback value to the `OnChanged` prop which gets run when the user attempts @@ -86,8 +86,8 @@ By default, the height of this component is equal to the value in [Constants.DefaultInputHeight]. While this can be overriden by props, in order to keep inputs accessible it is not recommended to make the component any smaller than this."> - - + +
@@ -106,10 +106,10 @@ - Dark + Dark - Light + Light @@ -203,13 +203,13 @@ } ], "name": "TextInput", - "desc": "A basic input field for entering any kind of text. This matches the appearance of the search\nboxes in the Explorer and Properties widgets, among other inputs in Studio.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/components/textinput/dark.png) | ![Light](/components/textinput/light.png) |\n\nThis is a controlled component, which means the current text should be passed in to the\n`Text` prop and a callback value to the `OnChanged` prop which gets run when the user attempts \ntypes in the input field. For example:\n\n```lua\nlocal function MyComponent()\n\tlocal text, setText = React.useState(\"\")\n\treturn React.createElement(StudioComponents.TextInput, {\n\t\tText = text,\n\t\tOnChanged = setText,\n\t})\nend\n```\n\nThis allows complete control over the text displayed and keeps the source of truth in your own\ncode. This is helpful for consistency and controlling the state from elsewhere in the tree. It\nalso allows you to easily filter what can be typed into the text input. For example, to only\npermit entering lowercase letters:\n\n```lua\nlocal function MyComponent()\n\tlocal text, setText = React.useState(\"\")\n\treturn React.createElement(StudioComponents.TextInput, {\n\t\tText = text,\n\t\tOnChanged = function(newText),\n\t\t\tlocal filteredText = string.gsub(newText, \"[^a-z]\", \"\")\n\t\t\tsetText(filteredText)\n\t\tend,\n\t})\nend\n```\n\nBy default, the height of this component is equal to the value in [Constants.DefaultInputHeight].\nWhile this can be overriden by props, in order to keep inputs accessible it is not recommended \nto make the component any smaller than this.", + "desc": "A basic input field for entering any kind of text. This matches the appearance of the search\nboxes in the Explorer and Properties widgets, among other inputs in Studio.\n\n| Dark | Light |\n| - | - |\n| ![Dark](/StudioComponents/components/textinput/dark.png) | ![Light](/StudioComponents/components/textinput/light.png) |\n\nThis is a controlled component, which means the current text should be passed in to the\n`Text` prop and a callback value to the `OnChanged` prop which gets run when the user attempts \ntypes in the input field. For example:\n\n```lua\nlocal function MyComponent()\n\tlocal text, setText = React.useState(\"\")\n\treturn React.createElement(StudioComponents.TextInput, {\n\t\tText = text,\n\t\tOnChanged = setText,\n\t})\nend\n```\n\nThis allows complete control over the text displayed and keeps the source of truth in your own\ncode. This is helpful for consistency and controlling the state from elsewhere in the tree. It\nalso allows you to easily filter what can be typed into the text input. For example, to only\npermit entering lowercase letters:\n\n```lua\nlocal function MyComponent()\n\tlocal text, setText = React.useState(\"\")\n\treturn React.createElement(StudioComponents.TextInput, {\n\t\tText = text,\n\t\tOnChanged = function(newText),\n\t\t\tlocal filteredText = string.gsub(newText, \"[^a-z]\", \"\")\n\t\t\tsetText(filteredText)\n\t\tend,\n\t})\nend\n```\n\nBy default, the height of this component is equal to the value in [Constants.DefaultInputHeight].\nWhile this can be overriden by props, in order to keep inputs accessible it is not recommended \nto make the component any smaller than this.", "source": { "line": 47, "path": "src/Components/TextInput.luau" } }
- - + + \ No newline at end of file diff --git a/api/index.html b/api/index.html index 2de8cab..9a27966 100644 --- a/api/index.html +++ b/api/index.html @@ -4,13 +4,13 @@ StudioComponents - - + +
- - + + \ No newline at end of file diff --git a/api/useMouseIcon/index.html b/api/useMouseIcon/index.html index 5c40bdb..a234e3a 100644 --- a/api/useMouseIcon/index.html +++ b/api/useMouseIcon/index.html @@ -66,8 +66,8 @@ }) end ```"> - - + +
@@ -143,7 +143,7 @@ "path": "src/Hooks/useMouseIcon.luau" } }
- - + + \ No newline at end of file diff --git a/api/useTheme/index.html b/api/useTheme/index.html index c560e70..1c967ec 100644 --- a/api/useTheme/index.html +++ b/api/useTheme/index.html @@ -36,8 +36,8 @@ }) end ```"> - - + +
@@ -70,7 +70,7 @@ "path": "src/Hooks/useTheme.luau" } }
- - + + \ No newline at end of file diff --git a/assets/js/0179f478.0926d77a.js b/assets/js/0179f478.0926d77a.js new file mode 100644 index 0000000..bb9eba4 --- /dev/null +++ b/assets/js/0179f478.0926d77a.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[7527],{42320:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Tab","desc":"","fields":[{"name":"LayoutOrder","lua_type":"number","desc":""},{"name":"Content","lua_type":"React.ReactNode","desc":""},{"name":"Disabled","lua_type":"boolean?","desc":""}],"source":{"line":66,"path":"src/Components/TabContainer.luau"}},{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"SelectedTab","lua_type":"string","desc":""},{"name":"OnTabSelected","lua_type":"((name: string) -> ())?","desc":""},{"name":"children","lua_type":"{ [string]: Tab }","desc":""}],"tags":["Component Props"],"source":{"line":83,"path":"src/Components/TabContainer.luau"}}],"name":"TabContainer","desc":"A container that displays one content page at a time, where different pages can be selected\\nvia a set of tabs along the top. This is seen in some built-in plugins such as the Toolbox.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/tabcontainer/dark.png) | ![Light](/StudioComponents/components/tabcontainer/light.png) |\\n\\nThis is a controlled component. The identifier of the selected tab should be passed to the\\n`SelectedTab` prop, and a callback should be passed to the `OnTabSelected` prop which is run \\nwhen the user selects a tab from the tab controls along the top.\\n\\nThe content rendered in each tab\'s main window should be passed to the `children` parameters in\\n`createElement` in the [format](TabContainer#Tab) described below. The keys are used as tab names \\nin the tab controls along the top and should also correspond to the identifier in `SelectedTab` \\nand\\tthe identifiers that `OnTabSelected` prop may be called with. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal selectedTab, setSelectedTab = React.useState(\\"Models\\")\\n\\treturn React.createElement(TabContainer, {\\n\\t\\tSelectedTab = selectedTab,\\n\\t\\tOnTabSelected = setSelectedTab,\\n\\t}, {\\n\\t\\t[\\"Models\\"] = {\\n\\t\\t\\tLayoutOrder = 1,\\n\\t\\t\\tContent = React.createElement(...),\\n\\t\\t},\\n\\t\\t[\\"Decals\\"] = {\\n\\t\\t\\tLayoutOrder = 2,\\n\\t\\t\\tContent = React.createElement(...),\\n\\t\\t}\\n\\t})\\nend\\n```\\n\\nAs well as disabling the entire component via the `Disabled` [CommonProp](CommonProps), individual\\ntabs can be disabled and made unselectable by passing `Disabled` with a value of `true` inside\\nthe tab\'s entry in the `Tabs` prop table.\\n\\n:::info\\nThe various tab containers found in Studio are inconsistent with each other (for example, Toolbox\\nand Terrain Editor use different sizes, colors, and highlights). This design of this component\\nuses the common elements of those designs and has small tweaks to stay consistent with the wider\\ndesign of Studio elements.\\n:::","source":{"line":50,"path":"src/Components/TabContainer.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/0179f478.b66a8e10.js b/assets/js/0179f478.b66a8e10.js deleted file mode 100644 index f8d5d8d..0000000 --- a/assets/js/0179f478.b66a8e10.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[7527],{42320:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Tab","desc":"","fields":[{"name":"LayoutOrder","lua_type":"number","desc":""},{"name":"Content","lua_type":"React.ReactNode","desc":""},{"name":"Disabled","lua_type":"boolean?","desc":""}],"source":{"line":66,"path":"src/Components/TabContainer.luau"}},{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"SelectedTab","lua_type":"string","desc":""},{"name":"OnTabSelected","lua_type":"((name: string) -> ())?","desc":""},{"name":"children","lua_type":"{ [string]: Tab }","desc":""}],"tags":["Component Props"],"source":{"line":83,"path":"src/Components/TabContainer.luau"}}],"name":"TabContainer","desc":"A container that displays one content page at a time, where different pages can be selected\\nvia a set of tabs along the top. This is seen in some built-in plugins such as the Toolbox.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/tabcontainer/dark.png) | ![Light](/components/tabcontainer/light.png) |\\n\\nThis is a controlled component. The identifier of the selected tab should be passed to the\\n`SelectedTab` prop, and a callback should be passed to the `OnTabSelected` prop which is run \\nwhen the user selects a tab from the tab controls along the top.\\n\\nThe content rendered in each tab\'s main window should be passed to the `children` parameters in\\n`createElement` in the [format](TabContainer#Tab) described below. The keys are used as tab names \\nin the tab controls along the top and should also correspond to the identifier in `SelectedTab` \\nand\\tthe identifiers that `OnTabSelected` prop may be called with. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal selectedTab, setSelectedTab = React.useState(\\"Models\\")\\n\\treturn React.createElement(TabContainer, {\\n\\t\\tSelectedTab = selectedTab,\\n\\t\\tOnTabSelected = setSelectedTab,\\n\\t}, {\\n\\t\\t[\\"Models\\"] = {\\n\\t\\t\\tLayoutOrder = 1,\\n\\t\\t\\tContent = React.createElement(...),\\n\\t\\t},\\n\\t\\t[\\"Decals\\"] = {\\n\\t\\t\\tLayoutOrder = 2,\\n\\t\\t\\tContent = React.createElement(...),\\n\\t\\t}\\n\\t})\\nend\\n```\\n\\nAs well as disabling the entire component via the `Disabled` [CommonProp](CommonProps), individual\\ntabs can be disabled and made unselectable by passing `Disabled` with a value of `true` inside\\nthe tab\'s entry in the `Tabs` prop table.\\n\\n:::info\\nThe various tab containers found in Studio are inconsistent with each other (for example, Toolbox\\nand Terrain Editor use different sizes, colors, and highlights). This design of this component\\nuses the common elements of those designs and has small tweaks to stay consistent with the wider\\ndesign of Studio elements.\\n:::","source":{"line":50,"path":"src/Components/TabContainer.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/04782851.04357179.js b/assets/js/04782851.04357179.js new file mode 100644 index 0000000..f18d87b --- /dev/null +++ b/assets/js/04782851.04357179.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[7972],{95028:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Value","lua_type":"NumberSequence","desc":""},{"name":"OnChanged","lua_type":"((newValue: NumberSequence) -> ())?","desc":""}],"tags":["Component Props"],"source":{"line":58,"path":"src/Components/NumberSequencePicker/init.luau"}}],"name":"NumberSequencePicker","desc":"An interface for modifying [NumberSequence](https://create.roblox.com/docs/reference/engine/datatypes/NumberSequence) values.\\nThis closely resembles the built-in NumberSequence picker for editing properties, with minor adjustments\\nfor improved readability.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/numbersequencepicker/dark.png) | ![Light](/StudioComponents/components/numbersequencepicker/light.png) |\\n\\nAs this is a controlled component, you should pass a NumberSequence to the `Value` prop \\nrepresenting the current value, and a callback to the `OnChanged` prop which gets run when the \\nuser attempts to change the sequence using the interface. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal sequence, setSequence = React.useState(NumberSequence.new(...))\\n\\treturn React.createElement(StudioComponents.NumberSequencePicker, {\\n\\t\\tValue = sequence,\\n\\t\\tOnChanged = setSequence,\\n\\t})\\nend\\n```\\n\\nThe default size of this component is exposed in [Constants.DefaultNumberSequencePickerSize].\\nTo keep all inputs accessible, it is recommended not to use a smaller size than this.","source":{"line":29,"path":"src/Components/NumberSequencePicker/init.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/04782851.1553f943.js b/assets/js/04782851.1553f943.js deleted file mode 100644 index da493ae..0000000 --- a/assets/js/04782851.1553f943.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[7972],{95028:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Value","lua_type":"NumberSequence","desc":""},{"name":"OnChanged","lua_type":"((newValue: NumberSequence) -> ())?","desc":""}],"tags":["Component Props"],"source":{"line":58,"path":"src/Components/NumberSequencePicker/init.luau"}}],"name":"NumberSequencePicker","desc":"An interface for modifying [NumberSequence](https://create.roblox.com/docs/reference/engine/datatypes/NumberSequence) values.\\nThis closely resembles the built-in NumberSequence picker for editing properties, with minor adjustments\\nfor improved readability.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/numbersequencepicker/dark.png) | ![Light](/components/numbersequencepicker/light.png) |\\n\\nAs this is a controlled component, you should pass a NumberSequence to the `Value` prop \\nrepresenting the current value, and a callback to the `OnChanged` prop which gets run when the \\nuser attempts to change the sequence using the interface. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal sequence, setSequence = React.useState(NumberSequence.new(...))\\n\\treturn React.createElement(StudioComponents.NumberSequencePicker, {\\n\\t\\tValue = sequence,\\n\\t\\tOnChanged = setSequence,\\n\\t})\\nend\\n```\\n\\nThe default size of this component is exposed in [Constants.DefaultNumberSequencePickerSize].\\nTo keep all inputs accessible, it is recommended not to use a smaller size than this.","source":{"line":29,"path":"src/Components/NumberSequencePicker/init.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/0b567a4c.f7ea1e80.js b/assets/js/0b567a4c.7ec89d5c.js similarity index 80% rename from assets/js/0b567a4c.f7ea1e80.js rename to assets/js/0b567a4c.7ec89d5c.js index 0585163..56e66b0 100644 --- a/assets/js/0b567a4c.f7ea1e80.js +++ b/assets/js/0b567a4c.7ec89d5c.js @@ -1 +1 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[9648],{15773:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"IconProps","desc":"","fields":[{"name":"Image","lua_type":"string","desc":""},{"name":"Size","lua_type":"Vector2","desc":""},{"name":"Transparency","lua_type":"number?","desc":""},{"name":"Color","lua_type":"Color3?","desc":""},{"name":"UseThemeColor","lua_type":"boolean?","desc":""},{"name":"Alignment","lua_type":"HorizontalAlignment?","desc":""}],"source":{"line":29,"path":"src/Components/MainButton.luau"}},{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"AutomaticSize","lua_type":"AutomaticSize?","desc":""},{"name":"OnActivated","lua_type":"(() -> ())?","desc":""},{"name":"Text","lua_type":"string?","desc":""},{"name":"Icon","lua_type":"IconProps?","desc":""}],"tags":["Component Props"],"source":{"line":41,"path":"src/Components/MainButton.luau"}}],"name":"MainButton","desc":"A variant of a [Button](#Button) used to indicate a primary action, for example an \'OK/Accept\' button\\nin a modal. \\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/mainbutton/dark.png) | ![Light](/components/mainbutton/light.png) |\\n\\nSee the docs for [Button](#Button) for information about customization and usage.","source":{"line":13,"path":"src/Components/MainButton.luau"}}')}}]); \ No newline at end of file +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[9648],{15773:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"IconProps","desc":"","fields":[{"name":"Image","lua_type":"string","desc":""},{"name":"Size","lua_type":"Vector2","desc":""},{"name":"Transparency","lua_type":"number?","desc":""},{"name":"Color","lua_type":"Color3?","desc":""},{"name":"UseThemeColor","lua_type":"boolean?","desc":""},{"name":"Alignment","lua_type":"HorizontalAlignment?","desc":""}],"source":{"line":29,"path":"src/Components/MainButton.luau"}},{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"AutomaticSize","lua_type":"AutomaticSize?","desc":""},{"name":"OnActivated","lua_type":"(() -> ())?","desc":""},{"name":"Text","lua_type":"string?","desc":""},{"name":"Icon","lua_type":"IconProps?","desc":""}],"tags":["Component Props"],"source":{"line":41,"path":"src/Components/MainButton.luau"}}],"name":"MainButton","desc":"A variant of a [Button](#Button) used to indicate a primary action, for example an \'OK/Accept\' button\\nin a modal. \\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/mainbutton/dark.png) | ![Light](/StudioComponents/components/mainbutton/light.png) |\\n\\nSee the docs for [Button](#Button) for information about customization and usage.","source":{"line":13,"path":"src/Components/MainButton.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/13279191.548b563f.js b/assets/js/13279191.548b563f.js deleted file mode 100644 index cee6379..0000000 --- a/assets/js/13279191.548b563f.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[8701],{54589:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Color","lua_type":"Color3","desc":""},{"name":"OnChanged","lua_type":"((newColor: Color3) -> ())?","desc":""}],"tags":["Component Props"],"source":{"line":54,"path":"src/Components/ColorPicker.luau"}}],"name":"ColorPicker","desc":"An interface for selecting a color with a Hue / Saturation box and a Value slider.\\nIndividual RGB and HSV values can also be modified manually.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/colorpicker/dark.png) | ![Light](/components/colorpicker/light.png) |\\n\\nThis is a controlled component, which means the current color should be passed in to the\\n`Color` prop and a callback value to the `OnChanged` prop which gets run when the user attempts \\nto change the color. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal color, setColor = React.useState(Color3.fromHex(\\"#008080\\"))\\n\\treturn React.createElement(StudioComponents.ColorPicker, {\\n\\t\\tValue = color,\\n\\t\\tOnChanged = setColor,\\n\\t})\\nend\\n```\\n\\nThe default size of this component is exposed in [Constants.DefaultColorPickerSize].\\nTo keep all inputs accessible, it is recommended not to use a smaller size than this.\\n\\nThis component is not a modal or dialog box (this should be implemented separately).","source":{"line":29,"path":"src/Components/ColorPicker.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/13279191.d2237c10.js b/assets/js/13279191.d2237c10.js new file mode 100644 index 0000000..1203ec4 --- /dev/null +++ b/assets/js/13279191.d2237c10.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[8701],{54589:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Color","lua_type":"Color3","desc":""},{"name":"OnChanged","lua_type":"((newColor: Color3) -> ())?","desc":""}],"tags":["Component Props"],"source":{"line":54,"path":"src/Components/ColorPicker.luau"}}],"name":"ColorPicker","desc":"An interface for selecting a color with a Hue / Saturation box and a Value slider.\\nIndividual RGB and HSV values can also be modified manually.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/colorpicker/dark.png) | ![Light](/StudioComponents/components/colorpicker/light.png) |\\n\\nThis is a controlled component, which means the current color should be passed in to the\\n`Color` prop and a callback value to the `OnChanged` prop which gets run when the user attempts \\nto change the color. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal color, setColor = React.useState(Color3.fromHex(\\"#008080\\"))\\n\\treturn React.createElement(StudioComponents.ColorPicker, {\\n\\t\\tValue = color,\\n\\t\\tOnChanged = setColor,\\n\\t})\\nend\\n```\\n\\nThe default size of this component is exposed in [Constants.DefaultColorPickerSize].\\nTo keep all inputs accessible, it is recommended not to use a smaller size than this.\\n\\nThis component is not a modal or dialog box (this should be implemented separately).","source":{"line":29,"path":"src/Components/ColorPicker.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/26c1ec1d.d7ed4bbd.js b/assets/js/26c1ec1d.d7ed4bbd.js new file mode 100644 index 0000000..b1cf7d1 --- /dev/null +++ b/assets/js/26c1ec1d.d7ed4bbd.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[1084],{84737:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Text","lua_type":"string","desc":""},{"name":"OnChanged","lua_type":"((newText: string) -> ())?","desc":""},{"name":"PlaceholderText","lua_type":"string?","desc":""},{"name":"ClearTextOnFocus","lua_type":"boolean?","desc":""},{"name":"OnFocused","lua_type":"(() -> ())?","desc":""},{"name":"OnFocusLost","lua_type":"((text: string, enterPressed: boolean, input: InputObject) -> ())?","desc":""}],"tags":["Component Props"],"source":{"line":68,"path":"src/Components/TextInput.luau"}}],"name":"TextInput","desc":"A basic input field for entering any kind of text. This matches the appearance of the search\\nboxes in the Explorer and Properties widgets, among other inputs in Studio.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/textinput/dark.png) | ![Light](/StudioComponents/components/textinput/light.png) |\\n\\nThis is a controlled component, which means the current text should be passed in to the\\n`Text` prop and a callback value to the `OnChanged` prop which gets run when the user attempts \\ntypes in the input field. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal text, setText = React.useState(\\"\\")\\n\\treturn React.createElement(StudioComponents.TextInput, {\\n\\t\\tText = text,\\n\\t\\tOnChanged = setText,\\n\\t})\\nend\\n```\\n\\nThis allows complete control over the text displayed and keeps the source of truth in your own\\ncode. This is helpful for consistency and controlling the state from elsewhere in the tree. It\\nalso allows you to easily filter what can be typed into the text input. For example, to only\\npermit entering lowercase letters:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal text, setText = React.useState(\\"\\")\\n\\treturn React.createElement(StudioComponents.TextInput, {\\n\\t\\tText = text,\\n\\t\\tOnChanged = function(newText),\\n\\t\\t\\tlocal filteredText = string.gsub(newText, \\"[^a-z]\\", \\"\\")\\n\\t\\t\\tsetText(filteredText)\\n\\t\\tend,\\n\\t})\\nend\\n```\\n\\nBy default, the height of this component is equal to the value in [Constants.DefaultInputHeight].\\nWhile this can be overriden by props, in order to keep inputs accessible it is not recommended \\nto make the component any smaller than this.","source":{"line":47,"path":"src/Components/TextInput.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/26c1ec1d.f0ba9b18.js b/assets/js/26c1ec1d.f0ba9b18.js deleted file mode 100644 index 3e7aca0..0000000 --- a/assets/js/26c1ec1d.f0ba9b18.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[1084],{84737:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Text","lua_type":"string","desc":""},{"name":"OnChanged","lua_type":"((newText: string) -> ())?","desc":""},{"name":"PlaceholderText","lua_type":"string?","desc":""},{"name":"ClearTextOnFocus","lua_type":"boolean?","desc":""},{"name":"OnFocused","lua_type":"(() -> ())?","desc":""},{"name":"OnFocusLost","lua_type":"((text: string, enterPressed: boolean, input: InputObject) -> ())?","desc":""}],"tags":["Component Props"],"source":{"line":68,"path":"src/Components/TextInput.luau"}}],"name":"TextInput","desc":"A basic input field for entering any kind of text. This matches the appearance of the search\\nboxes in the Explorer and Properties widgets, among other inputs in Studio.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/textinput/dark.png) | ![Light](/components/textinput/light.png) |\\n\\nThis is a controlled component, which means the current text should be passed in to the\\n`Text` prop and a callback value to the `OnChanged` prop which gets run when the user attempts \\ntypes in the input field. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal text, setText = React.useState(\\"\\")\\n\\treturn React.createElement(StudioComponents.TextInput, {\\n\\t\\tText = text,\\n\\t\\tOnChanged = setText,\\n\\t})\\nend\\n```\\n\\nThis allows complete control over the text displayed and keeps the source of truth in your own\\ncode. This is helpful for consistency and controlling the state from elsewhere in the tree. It\\nalso allows you to easily filter what can be typed into the text input. For example, to only\\npermit entering lowercase letters:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal text, setText = React.useState(\\"\\")\\n\\treturn React.createElement(StudioComponents.TextInput, {\\n\\t\\tText = text,\\n\\t\\tOnChanged = function(newText),\\n\\t\\t\\tlocal filteredText = string.gsub(newText, \\"[^a-z]\\", \\"\\")\\n\\t\\t\\tsetText(filteredText)\\n\\t\\tend,\\n\\t})\\nend\\n```\\n\\nBy default, the height of this component is equal to the value in [Constants.DefaultInputHeight].\\nWhile this can be overriden by props, in order to keep inputs accessible it is not recommended \\nto make the component any smaller than this.","source":{"line":47,"path":"src/Components/TextInput.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/415f5558.b918ade8.js b/assets/js/415f5558.0d7a9e53.js similarity index 67% rename from assets/js/415f5558.b918ade8.js rename to assets/js/415f5558.0d7a9e53.js index eba8e3d..a5de5eb 100644 --- a/assets/js/415f5558.b918ade8.js +++ b/assets/js/415f5558.0d7a9e53.js @@ -1 +1 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[1222],{83964:o=>{o.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""}],"tags":["Component Props"],"source":{"line":36,"path":"src/Components/LoadingDots.luau"}}],"name":"LoadingDots","desc":"A basic animated loading indicator. This matches similar indicators used in various places \\naround Studio. This should be used for short processes where the user does not need to see\\ninformation about how complete the loading is. For longer or more detailed loading processes, \\nconsider using a [ProgressBar].\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/loadingdots/dark.gif) | ![Light](/components/loadingdots/light.gif) |\\n\\nExample of usage:\\n\\n```lua\\nlocal function MyComponent()\\n\\treturn React.createElement(StudioComponents.LoadingDots, {})\\nend\\n```","source":{"line":21,"path":"src/Components/LoadingDots.luau"}}')}}]); \ No newline at end of file +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[1222],{83964:o=>{o.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""}],"tags":["Component Props"],"source":{"line":36,"path":"src/Components/LoadingDots.luau"}}],"name":"LoadingDots","desc":"A basic animated loading indicator. This matches similar indicators used in various places \\naround Studio. This should be used for short processes where the user does not need to see\\ninformation about how complete the loading is. For longer or more detailed loading processes, \\nconsider using a [ProgressBar].\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/loadingdots/dark.gif) | ![Light](/StudioComponents/components/loadingdots/light.gif) |\\n\\nExample of usage:\\n\\n```lua\\nlocal function MyComponent()\\n\\treturn React.createElement(StudioComponents.LoadingDots, {})\\nend\\n```","source":{"line":21,"path":"src/Components/LoadingDots.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/4aa7bdaa.004901d4.js b/assets/js/4aa7bdaa.5f3a097b.js similarity index 54% rename from assets/js/4aa7bdaa.004901d4.js rename to assets/js/4aa7bdaa.5f3a097b.js index 4055247..00fdc0d 100644 --- a/assets/js/4aa7bdaa.004901d4.js +++ b/assets/js/4aa7bdaa.5f3a097b.js @@ -1 +1 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[5155],{68709:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Value","lua_type":"number","desc":""},{"name":"OnValidChanged","lua_type":"((n: number) -> ())?","desc":""},{"name":"Min","lua_type":"number?","desc":""},{"name":"Max","lua_type":"number?","desc":""},{"name":"Step","lua_type":"number?","desc":""},{"name":"OnSubmitted","lua_type":"((n: number) -> ())?","desc":""},{"name":"FormatValue","lua_type":"((n: number) -> string)?","desc":""},{"name":"Arrows","lua_type":"boolean?","desc":""},{"name":"Slider","lua_type":"boolean?","desc":""},{"name":"PlaceholderText","lua_type":"string?","desc":""},{"name":"ClearTextOnFocus","lua_type":"boolean?","desc":""},{"name":"OnFocused","lua_type":"(() -> ())?","desc":""},{"name":"OnFocusLost","lua_type":"((text: string, enterPressed: boolean, input: InputObject) -> ())?","desc":""}],"tags":["Component Props"],"source":{"line":59,"path":"src/Components/NumericInput.luau"}}],"name":"NumericInput","desc":"An input field matching the appearance of a [TextInput] but which filters inputted text to only\\nallow numeric values, optionally with arrow and slider controls.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/numericinput/dark.png) | ![Light](/components/numericinput/light.png) |\\n\\n\\nThis is a controlled component with similar behavior to [TextInput]. The current numeric value\\nto display should be passed to the `Value` prop, and a callback should be passed to the\\n`OnValidChanged` prop which is run when the user types a (valid) numeric input.\\n\\nOptionally, a minimum value can be passed to the `Min` prop, as well as a maximum value to the\\n`Max` prop. A step (increment) value may also be passed to the the `Step` prop, which defaults \\nto 1 (allowing only whole number values). Passing a non-integer step value will also allow a \\ndecimal point to be typed in the input box. \\n\\nUse the `Arrows` and `Slider` props to specify whether up/down arrows and a slider should be\\nincluded. If arrows or a slider are displayed, they will increment the value by the amount of the step. \\n\\nOnly decimal inputs are allowed (so, for example, hex characters a-f will not be permitted).","source":{"line":26,"path":"src/Components/NumericInput.luau"}}')}}]); \ No newline at end of file +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[5155],{68709:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Value","lua_type":"number","desc":""},{"name":"OnValidChanged","lua_type":"((n: number) -> ())?","desc":""},{"name":"Min","lua_type":"number?","desc":""},{"name":"Max","lua_type":"number?","desc":""},{"name":"Step","lua_type":"number?","desc":""},{"name":"OnSubmitted","lua_type":"((n: number) -> ())?","desc":""},{"name":"FormatValue","lua_type":"((n: number) -> string)?","desc":""},{"name":"Arrows","lua_type":"boolean?","desc":""},{"name":"Slider","lua_type":"boolean?","desc":""},{"name":"PlaceholderText","lua_type":"string?","desc":""},{"name":"ClearTextOnFocus","lua_type":"boolean?","desc":""},{"name":"OnFocused","lua_type":"(() -> ())?","desc":""},{"name":"OnFocusLost","lua_type":"((text: string, enterPressed: boolean, input: InputObject) -> ())?","desc":""}],"tags":["Component Props"],"source":{"line":59,"path":"src/Components/NumericInput.luau"}}],"name":"NumericInput","desc":"An input field matching the appearance of a [TextInput] but which filters inputted text to only\\nallow numeric values, optionally with arrow and slider controls.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/numericinput/dark.png) | ![Light](/StudioComponents/components/numericinput/light.png) |\\n\\n\\nThis is a controlled component with similar behavior to [TextInput]. The current numeric value\\nto display should be passed to the `Value` prop, and a callback should be passed to the\\n`OnValidChanged` prop which is run when the user types a (valid) numeric input.\\n\\nOptionally, a minimum value can be passed to the `Min` prop, as well as a maximum value to the\\n`Max` prop. A step (increment) value may also be passed to the the `Step` prop, which defaults \\nto 1 (allowing only whole number values). Passing a non-integer step value will also allow a \\ndecimal point to be typed in the input box. \\n\\nUse the `Arrows` and `Slider` props to specify whether up/down arrows and a slider should be\\nincluded. If arrows or a slider are displayed, they will increment the value by the amount of the step. \\n\\nOnly decimal inputs are allowed (so, for example, hex characters a-f will not be permitted).","source":{"line":26,"path":"src/Components/NumericInput.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/7927c43e.ed131f54.js b/assets/js/7927c43e.473a524e.js similarity index 54% rename from assets/js/7927c43e.ed131f54.js rename to assets/js/7927c43e.473a524e.js index 88184fb..baa5744 100644 --- a/assets/js/7927c43e.ed131f54.js +++ b/assets/js/7927c43e.473a524e.js @@ -1 +1 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[9680],{49594:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"children","lua_type":"React.ReactNode","desc":""}],"tags":["Component Props"],"source":{"line":65,"path":"src/Components/DropShadowFrame.luau"}}],"name":"DropShadowFrame","desc":"A container frame equivalent in appearance to a [Background] with a \\ndrop shadow in the lower right sides and corner.\\nThis matches the appearance of some built-in Roblox Studio elements such as tooltips.\\nIt is useful for providing contrast against a background.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/dropshadowframe/dark.png) | ![Light](/components/dropshadowframe/light.png) |\\n\\nAny children passed will be parented to the container frame. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\treturn React.createElement(StudioComponents.DropShadowFrame, {}, {\\n\\t\\tMyLabel = React.createElement(StudioComponents.Label, ...),\\n\\t\\tMyCheckbox = React.createElement(StudioComponents.Checkbox, ...),\\n\\t})\\nend\\n```","source":{"line":24,"path":"src/Components/DropShadowFrame.luau"}}')}}]); \ No newline at end of file +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[9680],{49594:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"children","lua_type":"React.ReactNode","desc":""}],"tags":["Component Props"],"source":{"line":65,"path":"src/Components/DropShadowFrame.luau"}}],"name":"DropShadowFrame","desc":"A container frame equivalent in appearance to a [Background] with a \\ndrop shadow in the lower right sides and corner.\\nThis matches the appearance of some built-in Roblox Studio elements such as tooltips.\\nIt is useful for providing contrast against a background.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/dropshadowframe/dark.png) | ![Light](/StudioComponents/components/dropshadowframe/light.png) |\\n\\nAny children passed will be parented to the container frame. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\treturn React.createElement(StudioComponents.DropShadowFrame, {}, {\\n\\t\\tMyLabel = React.createElement(StudioComponents.Label, ...),\\n\\t\\tMyCheckbox = React.createElement(StudioComponents.Checkbox, ...),\\n\\t})\\nend\\n```","source":{"line":24,"path":"src/Components/DropShadowFrame.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/7bf74e2e.0f7c59e4.js b/assets/js/7bf74e2e.0f7c59e4.js new file mode 100644 index 0000000..9050ff6 --- /dev/null +++ b/assets/js/7bf74e2e.0f7c59e4.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[4138],{20130:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Value","lua_type":"boolean?","desc":""},{"name":"OnChanged","lua_type":"(() -> ())?","desc":""},{"name":"Label","lua_type":"string?","desc":""},{"name":"ContentAlignment","lua_type":"HorizontalAlignment?","desc":""},{"name":"ButtonAlignment","lua_type":"HorizontalAlignment?","desc":""}],"tags":["Component Props"],"source":{"line":66,"path":"src/Components/Checkbox.luau"}}],"name":"Checkbox","desc":"A box which can be checked or unchecked, usually used to toggle an option. Passing a value to\\nthe `Label` prop is the recommended way to indicate the purpose of a checkbox.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/checkbox/dark.png) | ![Light](/StudioComponents/components/checkbox/light.png) |\\n\\nAs this is a controlled component, you should pass a value to the `Value` prop representing \\nwhether the box is checked, and a callback value to the `OnChanged`\\tprop which gets run when \\nthe user interacts with the checkbox. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal selected, setSelected = React.useState(false)\\n\\treturn React.createElement(StudioComponents.Checkbox, {\\n\\t\\tValue = selected,\\n\\t\\tOnChanged = setSelected,\\n\\t})\\nend\\n```\\n\\nThe default height of a checkbox, including its label, can be found in [Constants.DefaultToggleHeight].\\nThe size of the whole checkbox can be overridden by passing a value to the `Size` prop.\\n\\nBy default, the box and label are left-aligned within the parent frame. This can be overriden by \\npassing an [Enum.HorizontalAlignment] value to the `ContentAlignment` prop.\\n\\nBy default, the box is placed to the left of the label. This can be overriden by passing either\\n`Enum.HorizontalAlignment.Left` or `Enum.HorizontalAlignment.Right` to the\\n`ButtonAlignment` prop.\\n\\nCheckboxes can also represent \'indeterminate\' values, which indicates that it is neither\\nchecked nor unchecked. This can be achieved by passing `nil` to the `Value` prop.\\nThis might be used when a checkbox represents the combined state of two different options, one of\\nwhich has a value of `true` and the other `false`.\\n\\n:::info\\nThe built-in Studio checkboxes were changed during this project\'s lifetime to be smaller and\\nhave a lower contrast ratio, especially in Dark theme. This component retains the old design\\nas it is more accessible.\\n:::","source":{"line":46,"path":"src/Components/Checkbox.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/7bf74e2e.1e88d029.js b/assets/js/7bf74e2e.1e88d029.js deleted file mode 100644 index 3a98506..0000000 --- a/assets/js/7bf74e2e.1e88d029.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[4138],{20130:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Value","lua_type":"boolean?","desc":""},{"name":"OnChanged","lua_type":"(() -> ())?","desc":""},{"name":"Label","lua_type":"string?","desc":""},{"name":"ContentAlignment","lua_type":"HorizontalAlignment?","desc":""},{"name":"ButtonAlignment","lua_type":"HorizontalAlignment?","desc":""}],"tags":["Component Props"],"source":{"line":66,"path":"src/Components/Checkbox.luau"}}],"name":"Checkbox","desc":"A box which can be checked or unchecked, usually used to toggle an option. Passing a value to\\nthe `Label` prop is the recommended way to indicate the purpose of a checkbox.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/checkbox/dark.png) | ![Light](/components/checkbox/light.png) |\\n\\nAs this is a controlled component, you should pass a value to the `Value` prop representing \\nwhether the box is checked, and a callback value to the `OnChanged`\\tprop which gets run when \\nthe user interacts with the checkbox. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal selected, setSelected = React.useState(false)\\n\\treturn React.createElement(StudioComponents.Checkbox, {\\n\\t\\tValue = selected,\\n\\t\\tOnChanged = setSelected,\\n\\t})\\nend\\n```\\n\\nThe default height of a checkbox, including its label, can be found in [Constants.DefaultToggleHeight].\\nThe size of the whole checkbox can be overridden by passing a value to the `Size` prop.\\n\\nBy default, the box and label are left-aligned within the parent frame. This can be overriden by \\npassing an [Enum.HorizontalAlignment] value to the `ContentAlignment` prop.\\n\\nBy default, the box is placed to the left of the label. This can be overriden by passing either\\n`Enum.HorizontalAlignment.Left` or `Enum.HorizontalAlignment.Right` to the\\n`ButtonAlignment` prop.\\n\\nCheckboxes can also represent \'indeterminate\' values, which indicates that it is neither\\nchecked nor unchecked. This can be achieved by passing `nil` to the `Value` prop.\\nThis might be used when a checkbox represents the combined state of two different options, one of\\nwhich has a value of `true` and the other `false`.\\n\\n:::info\\nThe built-in Studio checkboxes were changed during this project\'s lifetime to be smaller and\\nhave a lower contrast ratio, especially in Dark theme. This component retains the old design\\nas it is more accessible.\\n:::","source":{"line":46,"path":"src/Components/Checkbox.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/8de58665.03e13ea4.js b/assets/js/8de58665.03e13ea4.js new file mode 100644 index 0000000..96b8de3 --- /dev/null +++ b/assets/js/8de58665.03e13ea4.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[3275],{11913:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Alpha","lua_type":"number","desc":""},{"name":"OnChanged","lua_type":"((newAlpha: number) -> ())?","desc":""},{"name":"FillDirection","lua_type":"Enum.FillDirection?","desc":""},{"name":"MinAlpha","lua_type":"number?","desc":""},{"name":"MaxAlpha","lua_type":"number?","desc":""},{"name":"children","lua_type":"{ Side0: React.ReactNode?, Side1: React.ReactNode? }?","desc":""}],"tags":["Component Props"],"source":{"line":79,"path":"src/Components/Splitter.luau"}}],"name":"Splitter","desc":"A container frame similar to a [Background] but split into two panels, with a draggable control \\nfor\\tresizing the panels within the container. Resizing one section to be larger will reduce the\\nsize of the other section, and vice versa. This is useful for letting users resize content.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/splitter/dark.png) | ![Light](/StudioComponents/components/splitter/light.png) |\\n\\nThis is a controlled component. The current split location should be passed as a number between\\n0 and 1 to the `Alpha` prop, and a callback should be passed to the `OnChanged` prop, which\\nis run with the new alpha value when the user uses the splitter. \\n\\nYou can also optionally provide `MinAlpha` and `MaxAlpha` props (numbers between 0 and 1) which\\nlimit the resizing. These values default to 0.1 and 0.9.\\n\\nTo render children in each side, use the `children` parameters in createElement and provide the \\nkeys `Side0` and `Side1`. For a complete example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal division, setDivision = React.useState(0.5)\\n\\treturn React.createElement(StudioComponents.Splitter, {\\n\\t\\tAlpha = division,\\n\\t\\tOnChanged = setDivision,\\n\\t}, {\\n\\t\\tSide0 = React.createElement(...),\\n\\t\\tSide1 = React.createElement(...),\\n\\t})\\nend\\n```\\n\\nBy default, the split is horizontal, which means that the frame is split into a left and right\\nside. This can be changed, for example to a vertical split (top and bottom), by providing an \\n[Enum.FillDirection] value to the `FillDirection` prop.\\n\\nThis component can use your system\'s splitter mouse icons when interacting with the splitter bar. \\nTo enable this behavior, ensure you have rendered a [PluginProvider] somewhere higher up in \\nthe tree.","source":{"line":43,"path":"src/Components/Splitter.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/8de58665.dd162e82.js b/assets/js/8de58665.dd162e82.js deleted file mode 100644 index 25b20ee..0000000 --- a/assets/js/8de58665.dd162e82.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[3275],{11913:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Alpha","lua_type":"number","desc":""},{"name":"OnChanged","lua_type":"((newAlpha: number) -> ())?","desc":""},{"name":"FillDirection","lua_type":"Enum.FillDirection?","desc":""},{"name":"MinAlpha","lua_type":"number?","desc":""},{"name":"MaxAlpha","lua_type":"number?","desc":""},{"name":"children","lua_type":"{ Side0: React.ReactNode?, Side1: React.ReactNode? }?","desc":""}],"tags":["Component Props"],"source":{"line":79,"path":"src/Components/Splitter.luau"}}],"name":"Splitter","desc":"A container frame similar to a [Background] but split into two panels, with a draggable control \\nfor\\tresizing the panels within the container. Resizing one section to be larger will reduce the\\nsize of the other section, and vice versa. This is useful for letting users resize content.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/splitter/dark.png) | ![Light](/components/splitter/light.png) |\\n\\nThis is a controlled component. The current split location should be passed as a number between\\n0 and 1 to the `Alpha` prop, and a callback should be passed to the `OnChanged` prop, which\\nis run with the new alpha value when the user uses the splitter. \\n\\nYou can also optionally provide `MinAlpha` and `MaxAlpha` props (numbers between 0 and 1) which\\nlimit the resizing. These values default to 0.1 and 0.9.\\n\\nTo render children in each side, use the `children` parameters in createElement and provide the \\nkeys `Side0` and `Side1`. For a complete example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal division, setDivision = React.useState(0.5)\\n\\treturn React.createElement(StudioComponents.Splitter, {\\n\\t\\tAlpha = division,\\n\\t\\tOnChanged = setDivision,\\n\\t}, {\\n\\t\\tSide0 = React.createElement(...),\\n\\t\\tSide1 = React.createElement(...),\\n\\t})\\nend\\n```\\n\\nBy default, the split is horizontal, which means that the frame is split into a left and right\\nside. This can be changed, for example to a vertical split (top and bottom), by providing an \\n[Enum.FillDirection] value to the `FillDirection` prop.\\n\\nThis component can use your system\'s splitter mouse icons when interacting with the splitter bar. \\nTo enable this behavior, ensure you have rendered a [PluginProvider] somewhere higher up in \\nthe tree.","source":{"line":43,"path":"src/Components/Splitter.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/8deedfb8.aaee46e9.js b/assets/js/8deedfb8.aaee46e9.js new file mode 100644 index 0000000..e3ab404 --- /dev/null +++ b/assets/js/8deedfb8.aaee46e9.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[9556],{3905:(e,t,n)=>{n.d(t,{Zo:()=>p,kt:()=>f});var r=n(67294);function o(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function a(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function l(e){for(var t=1;t=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var u=r.createContext({}),c=function(e){var t=r.useContext(u),n=t;return e&&(n="function"==typeof e?e(t):l(l({},t),e)),n},p=function(e){var t=c(e.components);return r.createElement(u.Provider,{value:t},e.children)},d="mdxType",s={inlineCode:"code",wrapper:function(e){var t=e.children;return r.createElement(r.Fragment,{},t)}},m=r.forwardRef((function(e,t){var n=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,p=i(e,["components","mdxType","originalType","parentName"]),d=c(n),m=o,f=d["".concat(u,".").concat(m)]||d[m]||s[m]||a;return n?r.createElement(f,l(l({ref:t},p),{},{components:n})):r.createElement(f,l({ref:t},p))}));function f(e,t){var n=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=n.length,l=new Array(a);l[0]=m;var i={};for(var u in t)hasOwnProperty.call(t,u)&&(i[u]=t[u]);i.originalType=e,i[d]="string"==typeof e?e:o,l[1]=i;for(var c=2;c{n.r(t),n.d(t,{contentTitle:()=>l,default:()=>d,frontMatter:()=>a,metadata:()=>i,toc:()=>u});var r=n(87462),o=(n(67294),n(3905));const a={},l="Changelog",i={type:"mdx",permalink:"/StudioComponents/CHANGELOG",source:"@site/pages/CHANGELOG.md",title:"Changelog",description:"Unreleased",frontMatter:{}},u=[{value:"Unreleased",id:"unreleased",level:2},{value:"1.0.0",id:"100",level:2},{value:"Added",id:"added",level:3},{value:"Removed",id:"removed",level:3},{value:"0.1.0 - 0.1.4",id:"010---014",level:2}],c={toc:u},p="wrapper";function d(e){let{components:t,...n}=e;return(0,o.kt)(p,(0,r.Z)({},c,n,{components:t,mdxType:"MDXLayout"}),(0,o.kt)("h1",{id:"changelog"},"Changelog"),(0,o.kt)("h2",{id:"unreleased"},"Unreleased"),(0,o.kt)("ul",null,(0,o.kt)("li",{parentName:"ul"},"Fixed image links in documentation")),(0,o.kt)("h2",{id:"100"},"1.0.0"),(0,o.kt)("p",null,"Migrated from ",(0,o.kt)("a",{parentName:"p",href:"https://github.com/Roblox/roact"},"Roact")," to ",(0,o.kt)("a",{parentName:"p",href:"https://github.com/jsdotlua/react-lua"},"react-lua"),"\nand rewrote the library from the ground up."),(0,o.kt)("p",null,"There are many API differences; consult the docs on this. Removal of some components was either due\nto no longer being in scope for this project or requiring an API redesign which didn't make it\ninto v1.0.0."),(0,o.kt)("h3",{id:"added"},"Added"),(0,o.kt)("ul",null,(0,o.kt)("li",{parentName:"ul"},"Full type annotations"),(0,o.kt)("li",{parentName:"ul"},"Components: DropShadowFrame, LoadingDots, NumberSequencePicker, NumericInput, ProgressBar"),(0,o.kt)("li",{parentName:"ul"},"Hooks: useMouseIcon")),(0,o.kt)("h3",{id:"removed"},"Removed"),(0,o.kt)("ul",null,(0,o.kt)("li",{parentName:"ul"},"Components: BaseButton, Tooltip, VerticalCollapsibleSection, VerticalExpandingList, Widget, withTheme"),(0,o.kt)("li",{parentName:"ul"},"Contexts: ThemeContext"),(0,o.kt)("li",{parentName:"ul"},"Hooks: usePlugin")),(0,o.kt)("h2",{id:"010---014"},"0.1.0 - 0.1.4"),(0,o.kt)("p",null,"Initial release through to the final Roact version. Added various components and changed APIs."))}d.isMDXComponent=!0}}]); \ No newline at end of file diff --git a/assets/js/8deedfb8.fb79b8ce.js b/assets/js/8deedfb8.fb79b8ce.js deleted file mode 100644 index 624793a..0000000 --- a/assets/js/8deedfb8.fb79b8ce.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[9556],{3905:(e,t,n)=>{n.d(t,{Zo:()=>p,kt:()=>f});var r=n(67294);function o(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function a(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function l(e){for(var t=1;t=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var c=r.createContext({}),u=function(e){var t=r.useContext(c),n=t;return e&&(n="function"==typeof e?e(t):l(l({},t),e)),n},p=function(e){var t=u(e.components);return r.createElement(c.Provider,{value:t},e.children)},s="mdxType",d={inlineCode:"code",wrapper:function(e){var t=e.children;return r.createElement(r.Fragment,{},t)}},m=r.forwardRef((function(e,t){var n=e.components,o=e.mdxType,a=e.originalType,c=e.parentName,p=i(e,["components","mdxType","originalType","parentName"]),s=u(n),m=o,f=s["".concat(c,".").concat(m)]||s[m]||d[m]||a;return n?r.createElement(f,l(l({ref:t},p),{},{components:n})):r.createElement(f,l({ref:t},p))}));function f(e,t){var n=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=n.length,l=new Array(a);l[0]=m;var i={};for(var c in t)hasOwnProperty.call(t,c)&&(i[c]=t[c]);i.originalType=e,i[s]="string"==typeof e?e:o,l[1]=i;for(var u=2;u{n.r(t),n.d(t,{contentTitle:()=>l,default:()=>s,frontMatter:()=>a,metadata:()=>i,toc:()=>c});var r=n(87462),o=(n(67294),n(3905));const a={},l="Changelog",i={type:"mdx",permalink:"/StudioComponents/CHANGELOG",source:"@site/pages/CHANGELOG.md",title:"Changelog",description:"1.0.0",frontMatter:{}},c=[{value:"1.0.0",id:"100",level:2},{value:"Added",id:"added",level:3},{value:"Removed",id:"removed",level:3},{value:"0.1.0 - 0.1.4",id:"010---014",level:2}],u={toc:c},p="wrapper";function s(e){let{components:t,...n}=e;return(0,o.kt)(p,(0,r.Z)({},u,n,{components:t,mdxType:"MDXLayout"}),(0,o.kt)("h1",{id:"changelog"},"Changelog"),(0,o.kt)("h2",{id:"100"},"1.0.0"),(0,o.kt)("p",null,"Migrated from ",(0,o.kt)("a",{parentName:"p",href:"https://github.com/Roblox/roact"},"Roact")," to ",(0,o.kt)("a",{parentName:"p",href:"https://github.com/jsdotlua/react-lua"},"react-lua"),"\nand rewrote the library from the ground up."),(0,o.kt)("p",null,"There are many API differences; consult the docs on this. Removal of some components was either due\nto no longer being in scope for this project or requiring an API redesign which didn't make it\ninto v1.0.0."),(0,o.kt)("h3",{id:"added"},"Added"),(0,o.kt)("ul",null,(0,o.kt)("li",{parentName:"ul"},"Full type annotations"),(0,o.kt)("li",{parentName:"ul"},"Components: DropShadowFrame, LoadingDots, NumberSequencePicker, NumericInput, ProgressBar"),(0,o.kt)("li",{parentName:"ul"},"Hooks: useMouseIcon")),(0,o.kt)("h3",{id:"removed"},"Removed"),(0,o.kt)("ul",null,(0,o.kt)("li",{parentName:"ul"},"Components: BaseButton, Tooltip, VerticalCollapsibleSection, VerticalExpandingList, Widget, withTheme"),(0,o.kt)("li",{parentName:"ul"},"Contexts: ThemeContext"),(0,o.kt)("li",{parentName:"ul"},"Hooks: usePlugin")),(0,o.kt)("h2",{id:"010---014"},"0.1.0 - 0.1.4"),(0,o.kt)("p",null,"Initial release through to the final Roact version. Added various components and changed APIs."))}s.isMDXComponent=!0}}]); \ No newline at end of file diff --git a/assets/js/a1272fd3.af2c52d4.js b/assets/js/a1272fd3.af2c52d4.js new file mode 100644 index 0000000..346f20e --- /dev/null +++ b/assets/js/a1272fd3.af2c52d4.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[7204],{93869:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Text","lua_type":"string","desc":""},{"name":"TextWrapped","lua_type":"boolean?","desc":""},{"name":"TextXAlignment","lua_type":"Enum.TextXAlignment?","desc":""},{"name":"TextYAlignment","lua_type":"Enum.TextYAlignment?","desc":""},{"name":"TextTruncate","lua_type":"Enum.TextTruncate?","desc":""},{"name":"TextTransparency","lua_type":"number?","desc":""},{"name":"TextColor3","lua_type":"Color3?","desc":""},{"name":"RichText","lua_type":"boolean?","desc":""},{"name":"MaxVisibleGraphemes","lua_type":"number?","desc":""},{"name":"TextColorStyle","lua_type":"Enum.StudioStyleGuideColor?","desc":""},{"name":"children","lua_type":"React.ReactNode","desc":""}],"tags":["Component Props"],"source":{"line":65,"path":"src/Components/Label.luau"}}],"name":"Label","desc":"A basic text label with default styling to match built-in labels as closely as possible.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/label/dark.png) | ![Light](/StudioComponents/components/label/light.png) |\\n\\nBy default, text color matches the current theme\'s MainText color, which is the color\\nused in the Explorer and Properties widgets as well as most other places. It can be overriden\\nin two ways:\\n1. Passing a [StudioStyleGuideColor](https://create.roblox.com/docs/reference/engine/enums/StudioStyleGuideColor)\\nto the `TextColorStyle` prop. This is the preferred way to recolor text\\nbecause it will use the correct version of the color for the user\'s current selected theme.\\n2. Passing a [Color3] value to the `TextColor3` prop. This is useful when a color is not represented\\nby any StudioStyleGuideColor or should remain constant regardless of theme.\\n\\nExample of creating an error message label:\\n\\n```lua\\nlocal function MyComponent()\\n\\treturn React.createElement(StudioComponents.Label, {\\n\\t\\tText = \\"Please enter at least 5 characters!\\",\\n\\t\\tTextColorStyle = Enum.StudioStyleGuideColor.ErrorText,\\n\\t})\\nend\\n```\\n\\nPlugins like [Theme Color Shower](https://create.roblox.com/store/asset/3115567199/Theme-Color-Shower)\\nare useful for finding a StudioStyleGuideColor to use.\\n\\nThis component will parent any children passed to it to the underlying TextLabel instance.\\nThis is useful for things like adding extra padding around the text using a nested UIPadding,\\nor adding a UIStroke / UIGradient.\\n\\nLabels use [Constants.DefaultFont] for Font and [Constants.DefaultTextSize] for TextSize. This\\ncannot currently be overriden via props.","source":{"line":40,"path":"src/Components/Label.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/a1272fd3.e9aaedd3.js b/assets/js/a1272fd3.e9aaedd3.js deleted file mode 100644 index ee111aa..0000000 --- a/assets/js/a1272fd3.e9aaedd3.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[7204],{93869:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Text","lua_type":"string","desc":""},{"name":"TextWrapped","lua_type":"boolean?","desc":""},{"name":"TextXAlignment","lua_type":"Enum.TextXAlignment?","desc":""},{"name":"TextYAlignment","lua_type":"Enum.TextYAlignment?","desc":""},{"name":"TextTruncate","lua_type":"Enum.TextTruncate?","desc":""},{"name":"TextTransparency","lua_type":"number?","desc":""},{"name":"TextColor3","lua_type":"Color3?","desc":""},{"name":"RichText","lua_type":"boolean?","desc":""},{"name":"MaxVisibleGraphemes","lua_type":"number?","desc":""},{"name":"TextColorStyle","lua_type":"Enum.StudioStyleGuideColor?","desc":""},{"name":"children","lua_type":"React.ReactNode","desc":""}],"tags":["Component Props"],"source":{"line":65,"path":"src/Components/Label.luau"}}],"name":"Label","desc":"A basic text label with default styling to match built-in labels as closely as possible.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/label/dark.png) | ![Light](/components/label/light.png) |\\n\\nBy default, text color matches the current theme\'s MainText color, which is the color\\nused in the Explorer and Properties widgets as well as most other places. It can be overriden\\nin two ways:\\n1. Passing a [StudioStyleGuideColor](https://create.roblox.com/docs/reference/engine/enums/StudioStyleGuideColor)\\nto the `TextColorStyle` prop. This is the preferred way to recolor text\\nbecause it will use the correct version of the color for the user\'s current selected theme.\\n2. Passing a [Color3] value to the `TextColor3` prop. This is useful when a color is not represented\\nby any StudioStyleGuideColor or should remain constant regardless of theme.\\n\\nExample of creating an error message label:\\n\\n```lua\\nlocal function MyComponent()\\n\\treturn React.createElement(StudioComponents.Label, {\\n\\t\\tText = \\"Please enter at least 5 characters!\\",\\n\\t\\tTextColorStyle = Enum.StudioStyleGuideColor.ErrorText,\\n\\t})\\nend\\n```\\n\\nPlugins like [Theme Color Shower](https://create.roblox.com/store/asset/3115567199/Theme-Color-Shower)\\nare useful for finding a StudioStyleGuideColor to use.\\n\\nThis component will parent any children passed to it to the underlying TextLabel instance.\\nThis is useful for things like adding extra padding around the text using a nested UIPadding,\\nor adding a UIStroke / UIGradient.\\n\\nLabels use [Constants.DefaultFont] for Font and [Constants.DefaultTextSize] for TextSize. This\\ncannot currently be overriden via props.","source":{"line":40,"path":"src/Components/Label.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/b2a94c11.5a52810b.js b/assets/js/b2a94c11.dbd299be.js similarity index 57% rename from assets/js/b2a94c11.5a52810b.js rename to assets/js/b2a94c11.dbd299be.js index d668db5..395a2c0 100644 --- a/assets/js/b2a94c11.5a52810b.js +++ b/assets/js/b2a94c11.dbd299be.js @@ -1 +1 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[2634],{13405:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"IconProps","desc":"The `Alignment` prop is used to configure which side of any text the icon \\nappears on.\\tLeft-alignment is the default and center-alignment is not supported.\\n\\nWhen specifying icon color, at most one of `Color` and `UseThemeColor` should be specified.","fields":[{"name":"Image","lua_type":"string","desc":""},{"name":"Size","lua_type":"Vector2","desc":""},{"name":"Transparency","lua_type":"number?","desc":""},{"name":"Color","lua_type":"Color3?","desc":""},{"name":"UseThemeColor","lua_type":"boolean?","desc":""},{"name":"Alignment","lua_type":"HorizontalAlignment?","desc":""}],"source":{"line":55,"path":"src/Components/Button.luau"}},{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"AutomaticSize","lua_type":"AutomaticSize?","desc":""},{"name":"OnActivated","lua_type":"(() -> ())?","desc":""},{"name":"Text","lua_type":"string?","desc":""},{"name":"Icon","lua_type":"IconProps?","desc":""}],"tags":["Component Props"],"source":{"line":67,"path":"src/Components/Button.luau"}}],"name":"Button","desc":"A basic button that supports text, an icon, or both. This should be used as a standalone button\\nor as a secondary button alongside a [MainButton] for the primary action in a group of options.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/button/dark.png) | ![Light](/components/button/light.png) |\\n\\nThe `OnActivated` prop should be a callback which is run when the button is clicked.\\nFor example:\\n\\n```lua\\nlocal function MyComponent()\\n\\treturn React.createElement(StudioComponents.Button, {\\n\\t\\tText = \\"Click Me\\",\\n\\t\\tOnActivated = function()\\n\\t\\t\\tprint(\\"Button clicked!\\")\\n\\t\\tend\\n\\t})\\nend\\n```\\n\\nThe default size of buttons can be found in [Constants.DefaultButtonHeight]. To override this,\\nthere are two main options, which may be combined:\\n1. Pass a `Size` prop.\\n2. Pass an `AutomaticSize` prop.\\n\\nAutomaticSize is a simpler version of Roblox\'s built-in AutomaticSize system. Passing a value of\\n`Enum.AutomaticSize.X` will override the button\'s width to fit the text and/or icon. Passing a\\nvalue of `Enum.AutomaticSize.Y` will do the same but with the button\'s height. Passing\\n`Enum.AutomaticSize.XY` will override both axes.","source":{"line":34,"path":"src/Components/Button.luau"}}')}}]); \ No newline at end of file +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[2634],{13405:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"IconProps","desc":"The `Alignment` prop is used to configure which side of any text the icon \\nappears on.\\tLeft-alignment is the default and center-alignment is not supported.\\n\\nWhen specifying icon color, at most one of `Color` and `UseThemeColor` should be specified.","fields":[{"name":"Image","lua_type":"string","desc":""},{"name":"Size","lua_type":"Vector2","desc":""},{"name":"Transparency","lua_type":"number?","desc":""},{"name":"Color","lua_type":"Color3?","desc":""},{"name":"UseThemeColor","lua_type":"boolean?","desc":""},{"name":"Alignment","lua_type":"HorizontalAlignment?","desc":""}],"source":{"line":55,"path":"src/Components/Button.luau"}},{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"AutomaticSize","lua_type":"AutomaticSize?","desc":""},{"name":"OnActivated","lua_type":"(() -> ())?","desc":""},{"name":"Text","lua_type":"string?","desc":""},{"name":"Icon","lua_type":"IconProps?","desc":""}],"tags":["Component Props"],"source":{"line":67,"path":"src/Components/Button.luau"}}],"name":"Button","desc":"A basic button that supports text, an icon, or both. This should be used as a standalone button\\nor as a secondary button alongside a [MainButton] for the primary action in a group of options.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/button/dark.png) | ![Light](/StudioComponents/components/button/light.png) |\\n\\nThe `OnActivated` prop should be a callback which is run when the button is clicked.\\nFor example:\\n\\n```lua\\nlocal function MyComponent()\\n\\treturn React.createElement(StudioComponents.Button, {\\n\\t\\tText = \\"Click Me\\",\\n\\t\\tOnActivated = function()\\n\\t\\t\\tprint(\\"Button clicked!\\")\\n\\t\\tend\\n\\t})\\nend\\n```\\n\\nThe default size of buttons can be found in [Constants.DefaultButtonHeight]. To override this,\\nthere are two main options, which may be combined:\\n1. Pass a `Size` prop.\\n2. Pass an `AutomaticSize` prop.\\n\\nAutomaticSize is a simpler version of Roblox\'s built-in AutomaticSize system. Passing a value of\\n`Enum.AutomaticSize.X` will override the button\'s width to fit the text and/or icon. Passing a\\nvalue of `Enum.AutomaticSize.Y` will do the same but with the button\'s height. Passing\\n`Enum.AutomaticSize.XY` will override both axes.","source":{"line":34,"path":"src/Components/Button.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/b7c0d35e.a723f190.js b/assets/js/b7c0d35e.9aaf865c.js similarity index 50% rename from assets/js/b7c0d35e.a723f190.js rename to assets/js/b7c0d35e.9aaf865c.js index 62ec330..5cfd4cf 100644 --- a/assets/js/b7c0d35e.a723f190.js +++ b/assets/js/b7c0d35e.9aaf865c.js @@ -1 +1 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[5767],{41852:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Value","lua_type":"boolean?","desc":""},{"name":"OnChanged","lua_type":"(() -> ())?","desc":""},{"name":"Label","lua_type":"string?","desc":""},{"name":"ContentAlignment","lua_type":"HorizontalAlignment?","desc":""},{"name":"ButtonAlignment","lua_type":"HorizontalAlignment?","desc":""}],"tags":["Component Props"],"source":{"line":52,"path":"src/Components/RadioButton.luau"}}],"name":"RadioButton","desc":"An input element similar to a [Checkbox] which can either be selected or not selected.\\nThis should be used for an option in a mutually exclusive group of options (the user can\\nonly select one out of the group). This grouping behavior is not included and must be \\nimplemented separately.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/radiobutton/dark.png) | ![Light](/components/radiobutton/light.png) |\\n\\nThe props and behavior for this component are the same as [Checkbox]. Importantly, this is\\nalso a controlled component, which means it does not manage its own selected state. A value\\nmust be passed to the `Value` prop and a callback should be passed to the `OnChanged` prop.\\nFor example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal selected, setSelected = React.useState(false)\\n\\treturn React.createElement(StudioComponents.RadioButton, {\\n\\t\\tValue = selected,\\n\\t\\tOnChanged = setSelected,\\n\\t})\\nend\\n```\\n\\nFor more information about customizing this component via props, refer to the documentation\\nfor [Checkbox]. The default height for this component is found in [Constants.DefaultToggleHeight].","source":{"line":31,"path":"src/Components/RadioButton.luau"}}')}}]); \ No newline at end of file +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[5767],{41852:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Value","lua_type":"boolean?","desc":""},{"name":"OnChanged","lua_type":"(() -> ())?","desc":""},{"name":"Label","lua_type":"string?","desc":""},{"name":"ContentAlignment","lua_type":"HorizontalAlignment?","desc":""},{"name":"ButtonAlignment","lua_type":"HorizontalAlignment?","desc":""}],"tags":["Component Props"],"source":{"line":52,"path":"src/Components/RadioButton.luau"}}],"name":"RadioButton","desc":"An input element similar to a [Checkbox] which can either be selected or not selected.\\nThis should be used for an option in a mutually exclusive group of options (the user can\\nonly select one out of the group). This grouping behavior is not included and must be \\nimplemented separately.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/radiobutton/dark.png) | ![Light](/StudioComponents/components/radiobutton/light.png) |\\n\\nThe props and behavior for this component are the same as [Checkbox]. Importantly, this is\\nalso a controlled component, which means it does not manage its own selected state. A value\\nmust be passed to the `Value` prop and a callback should be passed to the `OnChanged` prop.\\nFor example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal selected, setSelected = React.useState(false)\\n\\treturn React.createElement(StudioComponents.RadioButton, {\\n\\t\\tValue = selected,\\n\\t\\tOnChanged = setSelected,\\n\\t})\\nend\\n```\\n\\nFor more information about customizing this component via props, refer to the documentation\\nfor [Checkbox]. The default height for this component is found in [Constants.DefaultToggleHeight].","source":{"line":31,"path":"src/Components/RadioButton.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/b7c7057c.0d177dd4.js b/assets/js/b7c7057c.0d177dd4.js new file mode 100644 index 0000000..0ad21c6 --- /dev/null +++ b/assets/js/b7c7057c.0d177dd4.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[2075],{16834:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Layout","lua_type":"{ ClassName: string, [string]: any }?","desc":""},{"name":"ScrollingDirection","lua_type":"Enum.ScrollingDirection?","desc":""},{"name":"PaddingLeft","lua_type":"UDim?","desc":""},{"name":"PaddingRight","lua_type":"UDim?","desc":""},{"name":"PaddingTop","lua_type":"UDim?","desc":""},{"name":"PaddingBottom","lua_type":"UDim?","desc":""},{"name":"OnScrolled","lua_type":"((scrollOffset: Vector2) -> ())?","desc":""},{"name":"children","lua_type":"React.ReactNode","desc":""}],"tags":["Component Props"],"source":{"line":82,"path":"src/Components/ScrollFrame/init.luau"}}],"name":"ScrollFrame","desc":"A container with scrollable contents. This works the same way as a built-in [ScrollingFrame] but\\nhas visual changes to match the appearance of built-in scrollers in Studio. \\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/scrollframe/dark.png) | ![Light](/StudioComponents/components/scrollframe/light.png) |\\n\\nScrollFrames automatically size their canvas to fit their contents, which are passed via the\\n`children` parameters in createElement. By default, children are laid out with a [UIListLayout];\\nthis can be overriden via the `Layout` prop. Either \\"UIListLayout\\" or \\"UIGridLayout\\" may be\\npassed to `Layout.ClassName`. Any other properties to be applied to the layout should also be \\npassed in the `Layout` prop. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\treturn React.createElement(StudioComponents.ScrollFrame, {\\n\\t\\tLayout = {\\n\\t\\t\\tClassName = \\"UIListLayout\\",\\n\\t\\t\\tPadding = UDim.new(0, 10),\\n\\t\\t\\tFillDirection = Enum.FillDirection.Horizontal,\\n\\t\\t}\\n\\t}, {\\n\\t\\tSomeChild = React.createElement(...),\\n\\t\\tAnotherChild = React.createElement(...),\\n\\t})\\nend\\n```\\n\\nBy default, scrolling on both the X and Y axes is enabled. To configure this, pass an\\n[Enum.ScrollingDirection] value to the `ScrollingDirection` prop. Padding around the outside of\\ncontents can also be configured via the `PaddingLeft`, `PaddingRight`, `PaddingTop`, and \\n`PaddingBottom` props.\\n\\n:::info\\nThe built-in Studio scrollers were changed during this project\'s lifetime to be significantly\\nnarrower. This component retains the old, wider, size because it is more accessible.\\n:::","source":{"line":42,"path":"src/Components/ScrollFrame/init.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/b7c7057c.d44e8eb6.js b/assets/js/b7c7057c.d44e8eb6.js deleted file mode 100644 index d12e75f..0000000 --- a/assets/js/b7c7057c.d44e8eb6.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[2075],{16834:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Layout","lua_type":"{ ClassName: string, [string]: any }?","desc":""},{"name":"ScrollingDirection","lua_type":"Enum.ScrollingDirection?","desc":""},{"name":"PaddingLeft","lua_type":"UDim?","desc":""},{"name":"PaddingRight","lua_type":"UDim?","desc":""},{"name":"PaddingTop","lua_type":"UDim?","desc":""},{"name":"PaddingBottom","lua_type":"UDim?","desc":""},{"name":"OnScrolled","lua_type":"((scrollOffset: Vector2) -> ())?","desc":""},{"name":"children","lua_type":"React.ReactNode","desc":""}],"tags":["Component Props"],"source":{"line":82,"path":"src/Components/ScrollFrame/init.luau"}}],"name":"ScrollFrame","desc":"A container with scrollable contents. This works the same way as a built-in [ScrollingFrame] but\\nhas visual changes to match the appearance of built-in scrollers in Studio. \\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/scrollframe/dark.png) | ![Light](/components/scrollframe/light.png) |\\n\\nScrollFrames automatically size their canvas to fit their contents, which are passed via the\\n`children` parameters in createElement. By default, children are laid out with a [UIListLayout];\\nthis can be overriden via the `Layout` prop. Either \\"UIListLayout\\" or \\"UIGridLayout\\" may be\\npassed to `Layout.ClassName`. Any other properties to be applied to the layout should also be \\npassed in the `Layout` prop. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\treturn React.createElement(StudioComponents.ScrollFrame, {\\n\\t\\tLayout = {\\n\\t\\t\\tClassName = \\"UIListLayout\\",\\n\\t\\t\\tPadding = UDim.new(0, 10),\\n\\t\\t\\tFillDirection = Enum.FillDirection.Horizontal,\\n\\t\\t}\\n\\t}, {\\n\\t\\tSomeChild = React.createElement(...),\\n\\t\\tAnotherChild = React.createElement(...),\\n\\t})\\nend\\n```\\n\\nBy default, scrolling on both the X and Y axes is enabled. To configure this, pass an\\n[Enum.ScrollingDirection] value to the `ScrollingDirection` prop. Padding around the outside of\\ncontents can also be configured via the `PaddingLeft`, `PaddingRight`, `PaddingTop`, and \\n`PaddingBottom` props.\\n\\n:::info\\nThe built-in Studio scrollers were changed during this project\'s lifetime to be significantly\\nnarrower. This component retains the old, wider, size because it is more accessible.\\n:::","source":{"line":42,"path":"src/Components/ScrollFrame/init.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/d1da96cd.2ab0a689.js b/assets/js/d1da96cd.2ab0a689.js deleted file mode 100644 index f6e414f..0000000 --- a/assets/js/d1da96cd.2ab0a689.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[6909],{79101:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Items","lua_type":"{ DropdownItem }","desc":""},{"name":"OnItemSelected","lua_type":"((newItem: string?) -> ())?","desc":""},{"name":"SelectedItem","lua_type":"string?","desc":""},{"name":"DefaultText","lua_type":"string?","desc":""},{"name":"RowHeight","lua_type":"number?","desc":""},{"name":"MaxVisibleRows","lua_type":"number?","desc":""},{"name":"ClearButton","lua_type":"boolean?","desc":""}],"tags":["Component Props"],"source":{"line":116,"path":"src/Components/Dropdown/init.luau"}},{"name":"DropdownItem","desc":"","lua_type":"string | DropdownItemDetail","source":{"line":5,"path":"src/Components/Dropdown/Types.luau"}},{"name":"DropdownItemDetail","desc":"","fields":[{"name":"Id","lua_type":"string","desc":""},{"name":"Text","lua_type":"string","desc":""},{"name":"Icon","lua_type":"DropdownItemIcon?","desc":""}],"source":{"line":16,"path":"src/Components/Dropdown/Types.luau"}},{"name":"DropdownItemIcon","desc":"","fields":[{"name":"Image","lua_type":"string","desc":""},{"name":"Size","lua_type":"Vector2","desc":""},{"name":"Transparency","lua_type":"number?","desc":""},{"name":"Color","lua_type":"Color3?","desc":""},{"name":"UseThemeColor","lua_type":"boolean?","desc":""}],"source":{"line":33,"path":"src/Components/Dropdown/Types.luau"}}],"name":"Dropdown","desc":"A togglable popup box containing a list of items to select a single item from. \\n\\nClicking the top section of a dropdown opens the list. Selecting an item, clicking anywhere else, \\nor pressing the Escape key will close the dropdown list. The list renders above all other UI\\nelements under the same LayerCollector.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/dropdown/dark.png) | ![Light](/components/dropdown/light.png) |\\n\\nBy default, the dropdown list opens below the top section. However, if there is not enough \\nspace below, and there is more space above, the dropdown list will open upwards instead. \\n\\nThe height of the top row can also be customized by passing a `Size` prop. The default size of the \\ntop row can be found in [Constants.DefaultDropdownHeight].\\n\\nThe height of the dropdown list box is determined by the `RowHeight` and `MaxVisibleRows` props.\\nThe default height of a list row can be found in [Constants.DefaultDropdownRowHeight].\\n\\nDropdowns manage their own open/closed state, but otherwise are controlled components.\\nThis means that you need to manage the current selected item by passing a value to \\n`SelectedItem` and a callback value to `OnItemSelected`. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal selected, setSelected = React.useState(\\"Red\\")\\n\\tlocal items = {\\t\\"Red\\", \\"Green\\", \\"Blue\\" }\\n\\treturn React.createElement(StudioComponents.Dropdown, {\\n\\t\\tItems = items,\\n\\t\\tSelectedItem = selected,\\n\\t\\tOnItemSelected = setSelected,\\n\\t})\\nend\\n```\\n\\nDropdowns do not by themselves require a value to always be selected. To explicitly allow the \\nselected value to be cleared by the user, set the `ClearButton` prop to `true`. \\nMultiple selections are not supported.\\n\\nThe list of items to select from can be specified either as strings or a [DropdownItemDetail] array.\\nUsing the detailed item format allows custom text and icons to be displayed, as seen below:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal items = {\\n\\t\\t{\\n\\t\\t\\tId = \\"item-1\\",\\n\\t\\t\\tText = \\"First Item\\",\\n\\t\\t\\tIcon = {\\n\\t\\t\\t\\tImage = \\"rbxassetid://...\\",\\n\\t\\t\\t\\t...\\n\\t\\t\\t},\\n\\t\\t},\\n\\t\\t...\\n\\t}\\n\\t...\\n\\treturn React.createElement(StudioComponents.Dropdown, {\\n\\t\\tItems = items,\\n\\t\\tSelectedItem = \\"item-1\\",\\n\\t\\t...\\n\\t})\\nend\\n```\\n\\nWhen using the detailed item format, the value in `SelectedItem` and the values that\\n`OnItemSelected` is called with correspond to the `Id` field of an item in the `Items` array.","source":{"line":71,"path":"src/Components/Dropdown/init.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/d1da96cd.d3d390ca.js b/assets/js/d1da96cd.d3d390ca.js new file mode 100644 index 0000000..0eee275 --- /dev/null +++ b/assets/js/d1da96cd.d3d390ca.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[6909],{79101:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Items","lua_type":"{ DropdownItem }","desc":""},{"name":"OnItemSelected","lua_type":"((newItem: string?) -> ())?","desc":""},{"name":"SelectedItem","lua_type":"string?","desc":""},{"name":"DefaultText","lua_type":"string?","desc":""},{"name":"RowHeight","lua_type":"number?","desc":""},{"name":"MaxVisibleRows","lua_type":"number?","desc":""},{"name":"ClearButton","lua_type":"boolean?","desc":""}],"tags":["Component Props"],"source":{"line":116,"path":"src/Components/Dropdown/init.luau"}},{"name":"DropdownItem","desc":"","lua_type":"string | DropdownItemDetail","source":{"line":5,"path":"src/Components/Dropdown/Types.luau"}},{"name":"DropdownItemDetail","desc":"","fields":[{"name":"Id","lua_type":"string","desc":""},{"name":"Text","lua_type":"string","desc":""},{"name":"Icon","lua_type":"DropdownItemIcon?","desc":""}],"source":{"line":16,"path":"src/Components/Dropdown/Types.luau"}},{"name":"DropdownItemIcon","desc":"","fields":[{"name":"Image","lua_type":"string","desc":""},{"name":"Size","lua_type":"Vector2","desc":""},{"name":"Transparency","lua_type":"number?","desc":""},{"name":"Color","lua_type":"Color3?","desc":""},{"name":"UseThemeColor","lua_type":"boolean?","desc":""}],"source":{"line":33,"path":"src/Components/Dropdown/Types.luau"}}],"name":"Dropdown","desc":"A togglable popup box containing a list of items to select a single item from. \\n\\nClicking the top section of a dropdown opens the list. Selecting an item, clicking anywhere else, \\nor pressing the Escape key will close the dropdown list. The list renders above all other UI\\nelements under the same LayerCollector.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/dropdown/dark.png) | ![Light](/StudioComponents/components/dropdown/light.png) |\\n\\nBy default, the dropdown list opens below the top section. However, if there is not enough \\nspace below, and there is more space above, the dropdown list will open upwards instead. \\n\\nThe height of the top row can also be customized by passing a `Size` prop. The default size of the \\ntop row can be found in [Constants.DefaultDropdownHeight].\\n\\nThe height of the dropdown list box is determined by the `RowHeight` and `MaxVisibleRows` props.\\nThe default height of a list row can be found in [Constants.DefaultDropdownRowHeight].\\n\\nDropdowns manage their own open/closed state, but otherwise are controlled components.\\nThis means that you need to manage the current selected item by passing a value to \\n`SelectedItem` and a callback value to `OnItemSelected`. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal selected, setSelected = React.useState(\\"Red\\")\\n\\tlocal items = {\\t\\"Red\\", \\"Green\\", \\"Blue\\" }\\n\\treturn React.createElement(StudioComponents.Dropdown, {\\n\\t\\tItems = items,\\n\\t\\tSelectedItem = selected,\\n\\t\\tOnItemSelected = setSelected,\\n\\t})\\nend\\n```\\n\\nDropdowns do not by themselves require a value to always be selected. To explicitly allow the \\nselected value to be cleared by the user, set the `ClearButton` prop to `true`. \\nMultiple selections are not supported.\\n\\nThe list of items to select from can be specified either as strings or a [DropdownItemDetail] array.\\nUsing the detailed item format allows custom text and icons to be displayed, as seen below:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal items = {\\n\\t\\t{\\n\\t\\t\\tId = \\"item-1\\",\\n\\t\\t\\tText = \\"First Item\\",\\n\\t\\t\\tIcon = {\\n\\t\\t\\t\\tImage = \\"rbxassetid://...\\",\\n\\t\\t\\t\\t...\\n\\t\\t\\t},\\n\\t\\t},\\n\\t\\t...\\n\\t}\\n\\t...\\n\\treturn React.createElement(StudioComponents.Dropdown, {\\n\\t\\tItems = items,\\n\\t\\tSelectedItem = \\"item-1\\",\\n\\t\\t...\\n\\t})\\nend\\n```\\n\\nWhen using the detailed item format, the value in `SelectedItem` and the values that\\n`OnItemSelected` is called with correspond to the `Id` field of an item in the `Items` array.","source":{"line":71,"path":"src/Components/Dropdown/init.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/ec88fb0c.99b9b8f2.js b/assets/js/ec88fb0c.99b9b8f2.js deleted file mode 100644 index 650dc55..0000000 --- a/assets/js/ec88fb0c.99b9b8f2.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[9965],{63648:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Value","lua_type":"number","desc":""},{"name":"OnChanged","lua_type":"((newValue: number) -> ())?","desc":""},{"name":"Min","lua_type":"number","desc":""},{"name":"Max","lua_type":"number","desc":""},{"name":"Step","lua_type":"number?","desc":""},{"name":"Border","lua_type":"boolean?","desc":""},{"name":"Background","lua_type":"boolean?","desc":""}],"tags":["Component Props"],"source":{"line":67,"path":"src/Components/Slider.luau"}}],"name":"Slider","desc":"A component for selecting a numeric value from a range of values with an optional increment.\\nThese are seen in some number-valued properties in the built-in Properties widget, as well as in\\nvarious built-in plugins such as the Terrain Editor.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/slider/dark.png) | ![Light](/components/slider/light.png) |\\n\\nAs with other components in this library, this is a controlled component. You should pass a\\nvalue to the `Value` prop representing the current value, as well as a callback to the `OnChanged`\\nprop which will be run when the user changes the value via dragging or clicking on the slider.\\n\\nIn addition to these, you must also provide a `Min` and a `Max` prop, which together define the\\nrange of the slider. Optionally, a `Step` prop can be provided, which defines the increment of\\nthe slider. This defaults to 0, which allows any value in the range. For a complete example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal value, setValue = React.useState(1)\\n\\treturn React.createElement(StudioComponents.Slider, {\\n\\t\\tValue = value,\\n\\t\\tOnChanged = setValue,\\n\\t\\tMin = 0,\\n\\t\\tMax = 10,\\n\\t\\tStep = 1,\\n\\t})\\nend\\n```\\n\\nTwo further props can optionally be provided:\\n1. `Border` determines whether a border is drawn around the component.\\nThis is useful for giving visual feedback when the slider is hovered or selected. \\n2. `Background` determines whether the component has a visible background.\\nIf this is value is missing or set to `false`, any border will also be hidden.\\n\\nBoth of these props default to `true`.\\n\\nBy default, the height of sliders is equal to the value found in [Constants.DefaultSliderHeight].\\nWhile this can be overriden by props, in order to keep inputs accessible it is not recommended \\nto make the component any smaller than this.","source":{"line":45,"path":"src/Components/Slider.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/ec88fb0c.d720521a.js b/assets/js/ec88fb0c.d720521a.js new file mode 100644 index 0000000..b1ffdae --- /dev/null +++ b/assets/js/ec88fb0c.d720521a.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[9965],{63648:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Value","lua_type":"number","desc":""},{"name":"OnChanged","lua_type":"((newValue: number) -> ())?","desc":""},{"name":"Min","lua_type":"number","desc":""},{"name":"Max","lua_type":"number","desc":""},{"name":"Step","lua_type":"number?","desc":""},{"name":"Border","lua_type":"boolean?","desc":""},{"name":"Background","lua_type":"boolean?","desc":""}],"tags":["Component Props"],"source":{"line":67,"path":"src/Components/Slider.luau"}}],"name":"Slider","desc":"A component for selecting a numeric value from a range of values with an optional increment.\\nThese are seen in some number-valued properties in the built-in Properties widget, as well as in\\nvarious built-in plugins such as the Terrain Editor.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/slider/dark.png) | ![Light](/StudioComponents/components/slider/light.png) |\\n\\nAs with other components in this library, this is a controlled component. You should pass a\\nvalue to the `Value` prop representing the current value, as well as a callback to the `OnChanged`\\nprop which will be run when the user changes the value via dragging or clicking on the slider.\\n\\nIn addition to these, you must also provide a `Min` and a `Max` prop, which together define the\\nrange of the slider. Optionally, a `Step` prop can be provided, which defines the increment of\\nthe slider. This defaults to 0, which allows any value in the range. For a complete example:\\n\\n```lua\\nlocal function MyComponent()\\n\\tlocal value, setValue = React.useState(1)\\n\\treturn React.createElement(StudioComponents.Slider, {\\n\\t\\tValue = value,\\n\\t\\tOnChanged = setValue,\\n\\t\\tMin = 0,\\n\\t\\tMax = 10,\\n\\t\\tStep = 1,\\n\\t})\\nend\\n```\\n\\nTwo further props can optionally be provided:\\n1. `Border` determines whether a border is drawn around the component.\\nThis is useful for giving visual feedback when the slider is hovered or selected. \\n2. `Background` determines whether the component has a visible background.\\nIf this is value is missing or set to `false`, any border will also be hidden.\\n\\nBoth of these props default to `true`.\\n\\nBy default, the height of sliders is equal to the value found in [Constants.DefaultSliderHeight].\\nWhile this can be overriden by props, in order to keep inputs accessible it is not recommended \\nto make the component any smaller than this.","source":{"line":45,"path":"src/Components/Slider.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/f7145b79.63fcb28c.js b/assets/js/f7145b79.63fcb28c.js new file mode 100644 index 0000000..0f54264 --- /dev/null +++ b/assets/js/f7145b79.63fcb28c.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[9883],{37508:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Value","lua_type":"number","desc":""},{"name":"Max","lua_type":"number?","desc":""},{"name":"Formatter","lua_type":"((value: number, max: number) -> string)?","desc":""}],"tags":["Component Props"],"source":{"line":61,"path":"src/Components/ProgressBar.luau"}}],"name":"ProgressBar","desc":"A basic progress indicator. This should be used for longer or more detailed loading processes.\\nFor shorter loading processes, consider using a [LoadingDots] component.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/progressbar/dark.png) | ![Light](/StudioComponents/components/progressbar/light.png) |\\n\\nPass a number representing the current progress into the `Value` prop. You can optionally pass a \\nnumber representing the maximum value into the `Max` prop, which defaults to 1 if not provided. \\nThe `Value` prop should be between 0 and `Max`. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\treturn React.createElement(StudioComponents.ProgressBar, {\\n\\t\\tValue = 5, -- loaded 5 items\\n\\t\\tMax = 10, -- out of a total of 10 items\\n\\t})\\nend\\n```\\n\\nBy default, the progress bar will display text indicating the progress as a percentage,\\nrounded to the nearest whole number. This can be customized by providing a prop to `Formatter`,\\nwhich should be a function that takes two numbers representing the current value and the maximum value\\nand returns a string to be displayed. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\treturn React.createElement(StudioComponents.ProgressBar, {\\n\\t\\tValue = 3,\\n\\t\\tMax = 20,\\n\\t\\tFormatter = function(current, max)\\n\\t\\t\\treturn `Loaded {current} / {max} assets...`\\n\\t\\tend,\\n\\t})\\nend\\n```\\n\\nBy default, the height of a progress bar is equal to the value in [Constants.DefaultProgressBarHeight].\\nThis can be configured via props.","source":{"line":44,"path":"src/Components/ProgressBar.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/f7145b79.e4f9526a.js b/assets/js/f7145b79.e4f9526a.js deleted file mode 100644 index 84acfa7..0000000 --- a/assets/js/f7145b79.e4f9526a.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[9883],{37508:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"Value","lua_type":"number","desc":""},{"name":"Max","lua_type":"number?","desc":""},{"name":"Formatter","lua_type":"((value: number, max: number) -> string)?","desc":""}],"tags":["Component Props"],"source":{"line":61,"path":"src/Components/ProgressBar.luau"}}],"name":"ProgressBar","desc":"A basic progress indicator. This should be used for longer or more detailed loading processes.\\nFor shorter loading processes, consider using a [LoadingDots] component.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/progressbar/dark.png) | ![Light](/components/progressbar/light.png) |\\n\\nPass a number representing the current progress into the `Value` prop. You can optionally pass a \\nnumber representing the maximum value into the `Max` prop, which defaults to 1 if not provided. \\nThe `Value` prop should be between 0 and `Max`. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\treturn React.createElement(StudioComponents.ProgressBar, {\\n\\t\\tValue = 5, -- loaded 5 items\\n\\t\\tMax = 10, -- out of a total of 10 items\\n\\t})\\nend\\n```\\n\\nBy default, the progress bar will display text indicating the progress as a percentage,\\nrounded to the nearest whole number. This can be customized by providing a prop to `Formatter`,\\nwhich should be a function that takes two numbers representing the current value and the maximum value\\nand returns a string to be displayed. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\treturn React.createElement(StudioComponents.ProgressBar, {\\n\\t\\tValue = 3,\\n\\t\\tMax = 20,\\n\\t\\tFormatter = function(current, max)\\n\\t\\t\\treturn `Loaded {current} / {max} assets...`\\n\\t\\tend,\\n\\t})\\nend\\n```\\n\\nBy default, the height of a progress bar is equal to the value in [Constants.DefaultProgressBarHeight].\\nThis can be configured via props.","source":{"line":44,"path":"src/Components/ProgressBar.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/fb8987fe.39d5a33c.js b/assets/js/fb8987fe.39d5a33c.js new file mode 100644 index 0000000..35f0f28 --- /dev/null +++ b/assets/js/fb8987fe.39d5a33c.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[9557],{35499:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"children","lua_type":"React.ReactNode","desc":""}],"tags":["Component Props"],"source":{"line":35,"path":"src/Components/Background.luau"}}],"name":"Background","desc":"A borderless frame matching the default background color of Studio widgets.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/StudioComponents/components/background/dark.png) | ![Light](/StudioComponents/components/background/light.png) |\\n\\nAny children passed will be parented to the frame, which makes it suitable for use as, \\nfor example, the root component in a plugin Widget. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\treturn React.createElement(StudioComponents.Background, {}, {\\n\\t\\tMyChild = React.createElement(...),\\n\\t})\\nend\\n```","source":{"line":21,"path":"src/Components/Background.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/fb8987fe.7e7814bc.js b/assets/js/fb8987fe.7e7814bc.js deleted file mode 100644 index 9c9f07d..0000000 --- a/assets/js/fb8987fe.7e7814bc.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[9557],{35499:e=>{e.exports=JSON.parse('{"functions":[],"properties":[],"types":[{"name":"Props","desc":"","fields":[{"name":"...","lua_type":"CommonProps","desc":""},{"name":"children","lua_type":"React.ReactNode","desc":""}],"tags":["Component Props"],"source":{"line":35,"path":"src/Components/Background.luau"}}],"name":"Background","desc":"A borderless frame matching the default background color of Studio widgets.\\n\\n| Dark | Light |\\n| - | - |\\n| ![Dark](/components/background/dark.png) | ![Light](/components/background/light.png) |\\n\\nAny children passed will be parented to the frame, which makes it suitable for use as, \\nfor example, the root component in a plugin Widget. For example:\\n\\n```lua\\nlocal function MyComponent()\\n\\treturn React.createElement(StudioComponents.Background, {}, {\\n\\t\\tMyChild = React.createElement(...),\\n\\t})\\nend\\n```","source":{"line":21,"path":"src/Components/Background.luau"}}')}}]); \ No newline at end of file diff --git a/assets/js/main.66ea6857.js b/assets/js/main.6d8921d8.js similarity index 99% rename from assets/js/main.66ea6857.js rename to assets/js/main.6d8921d8.js index b414bce..1f723b6 100644 --- a/assets/js/main.66ea6857.js +++ b/assets/js/main.6d8921d8.js @@ -1,2 +1,2 @@ -/*! For license information please see main.66ea6857.js.LICENSE.txt */ -(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([[179],{723:(e,t,n)=>{"use strict";n.d(t,{Z:()=>p});var r=n(67294),a=n(87462),o=n(68356),i=n.n(o),l=n(16887);const s={"0179f478":[()=>n.e(7527).then(n.t.bind(n,42320,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\TabContainer.json",42320],"04782851":[()=>n.e(7972).then(n.t.bind(n,95028,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\NumberSequencePicker.json",95028],"05f29c76":[()=>n.e(4681).then(n.t.bind(n,23189,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\ScrollFrame-toc.json",23189],"090c1e96":[()=>n.e(7866).then(n.t.bind(n,38670,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\useMouseIcon.json",38670],"0b567a4c":[()=>n.e(9648).then(n.t.bind(n,15773,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\MainButton.json",15773],"0e384e19":[()=>n.e(9671).then(n.bind(n,59881)),"@site/docs/intro.md",59881],"12d4ed1e":[()=>n.e(3418).then(n.t.bind(n,88303,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\plugin-route-context-module-100.json",88303],13279191:[()=>n.e(8701).then(n.t.bind(n,54589,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\ColorPicker.json",54589],17896441:[()=>Promise.all([n.e(532),n.e(5289),n.e(7918)]).then(n.bind(n,15462)),"@theme/DocItem",15462],"181fab4f":[()=>n.e(4462).then(n.t.bind(n,95611,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\useTheme.json",95611],"1be78505":[()=>Promise.all([n.e(532),n.e(9514)]).then(n.bind(n,90606)),"@theme/DocPage",90606],"1ec90f59":[()=>n.e(3482).then(n.t.bind(n,41188,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\PluginProvider-toc.json",41188],"1f391b9e":[()=>Promise.all([n.e(532),n.e(5289),n.e(3085)]).then(n.bind(n,14247)),"@theme/MDXPage",14247],"2241e884":[()=>n.e(7249).then(n.t.bind(n,67703,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\ColorPicker-toc.json",67703],"2598cf15":[()=>n.e(3141).then(n.t.bind(n,50039,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\Label-toc.json",50039],"2637a061":[()=>n.e(5833).then(n.t.bind(n,94606,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\PluginProvider.json",94606],"26c1ec1d":[()=>n.e(1084).then(n.t.bind(n,84737,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\TextInput.json",84737],"2d4e5e37":[()=>n.e(4680).then(n.t.bind(n,91606,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\Slider-toc.json",91606],"33b2585e":[()=>n.e(7381).then(n.t.bind(n,77061,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\RadioButton-toc.json",77061],"3a1c0a4f":[()=>n.e(736).then(n.t.bind(n,7636,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\sidebar.json",7636],"3d709320":[()=>n.e(6420).then(n.t.bind(n,83060,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\Checkbox-toc.json",83060],"415f5558":[()=>n.e(1222).then(n.t.bind(n,83964,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\LoadingDots.json",83964],"4aa7bdaa":[()=>n.e(5155).then(n.t.bind(n,68709,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\NumericInput.json",68709],"53f57e37":[()=>n.e(1288).then(n.t.bind(n,85492,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\typeLinks.json",85492],"573ff550":[()=>n.e(7763).then(n.t.bind(n,63891,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\options.json",63891],"5e9f5e1a":[()=>Promise.resolve().then(n.bind(n,36809)),"@generated/docusaurus.config",36809],"5fce2c0b":[()=>n.e(1609).then(n.t.bind(n,41273,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\CommonProps-toc.json",41273],"6daa09ed":[()=>n.e(2192).then(n.t.bind(n,30214,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\TextInput-toc.json",30214],"6fcc7c11":[()=>n.e(5876).then(n.t.bind(n,11858,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\NumberSequencePicker-toc.json",11858],"70e7a192":[()=>n.e(1457).then(n.t.bind(n,85941,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\MainButton-toc.json",85941],"76d5cf77":[()=>n.e(3302).then(n.t.bind(n,12177,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\ProgressBar-toc.json",12177],"7927c43e":[()=>n.e(9680).then(n.t.bind(n,49594,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\DropShadowFrame.json",49594],"7aa3675b":[()=>n.e(2378).then(n.t.bind(n,39335,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\NumericInput-toc.json",39335],"7bf74e2e":[()=>n.e(4138).then(n.t.bind(n,20130,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\Checkbox.json",20130],"872921f1":[()=>n.e(9092).then(n.t.bind(n,90216,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\Constants.json",90216],88429647:[()=>n.e(7351).then(n.t.bind(n,27501,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\Background-toc.json",27501],"8c8e882d":[()=>n.e(8982).then(n.t.bind(n,8909,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\Button-toc.json",8909],"8de58665":[()=>n.e(3275).then(n.t.bind(n,11913,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\Splitter.json",11913],"8deedfb8":[()=>n.e(9556).then(n.bind(n,26437)),"@site/pages/CHANGELOG.md",26437],"935f2afb":[()=>n.e(53).then(n.t.bind(n,1109,19)),"~docs/default/version-current-metadata-prop-751.json",1109],a1272fd3:[()=>n.e(7204).then(n.t.bind(n,93869,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\Label.json",93869],a3f15faa:[()=>n.e(2264).then(n.t.bind(n,87052,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\DropShadowFrame-toc.json",87052],b25e0814:[()=>n.e(6654).then(n.t.bind(n,95290,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\useTheme-toc.json",95290],b2a94c11:[()=>n.e(2634).then(n.t.bind(n,13405,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\Button.json",13405],b7c0d35e:[()=>n.e(5767).then(n.t.bind(n,41852,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\RadioButton.json",41852],b7c7057c:[()=>n.e(2075).then(n.t.bind(n,16834,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\ScrollFrame.json",16834],b84f4f42:[()=>n.e(6668).then(n.bind(n,23424)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\node_modules\\docusaurus-plugin-moonwave\\src\\components\\Redirect.js",23424],b871f9af:[()=>n.e(7422).then(n.t.bind(n,46553,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\Constants-toc.json",46553],c3608aa4:[()=>n.e(2753).then(n.t.bind(n,89886,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\useMouseIcon-toc.json",89886],c7889241:[()=>Promise.all([n.e(532),n.e(8981)]).then(n.bind(n,81117)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\node_modules\\docusaurus-plugin-moonwave\\src\\components\\LuaClass.js",81117],c8b37589:[()=>n.e(9006).then(n.t.bind(n,15745,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-content-pages\\default\\plugin-route-context-module-100.json",15745],ca25884c:[()=>n.e(1251).then(n.t.bind(n,64034,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\TabContainer-toc.json",64034],d0fcdc29:[()=>n.e(8028).then(n.t.bind(n,83769,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-content-docs\\default\\plugin-route-context-module-100.json",83769],d1da96cd:[()=>n.e(6909).then(n.t.bind(n,79101,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\Dropdown.json",79101],d3874e59:[()=>Promise.all([n.e(532),n.e(6374)]).then(n.bind(n,52897)),"@site/pages/index.js",52897],d3a68147:[()=>n.e(3308).then(n.t.bind(n,13043,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\LoadingDots-toc.json",13043],d589d3a7:[()=>n.e(7162).then(n.bind(n,99390)),"@site/docs/getting-started.md",99390],d666fba2:[()=>n.e(9402).then(n.t.bind(n,57133,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\CommonProps.json",57133],ec88fb0c:[()=>n.e(9965).then(n.t.bind(n,63648,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\Slider.json",63648],f117875a:[()=>n.e(5476).then(n.t.bind(n,63436,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\Dropdown-toc.json",63436],f2ffffe7:[()=>n.e(8964).then(n.t.bind(n,57940,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\Splitter-toc.json",57940],f7145b79:[()=>n.e(9883).then(n.t.bind(n,37508,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\ProgressBar.json",37508],fb8987fe:[()=>n.e(9557).then(n.t.bind(n,35499,19)),"C:\\Users\\Charlie\\AppData\\Local\\moonwave\\Cache\\StudioComponents\\.docusaurus\\docusaurus-plugin-moonwave\\moonwave\\Background.json",35499]};function u(e){let{error:t,retry:n,pastDelay:a}=e;return t?r.createElement("div",{style:{textAlign:"center",color:"#fff",backgroundColor:"#fa383e",borderColor:"#fa383e",borderStyle:"solid",borderRadius:"0.25rem",borderWidth:"1px",boxSizing:"border-box",display:"block",padding:"1rem",flex:"0 0 50%",marginLeft:"25%",marginRight:"25%",marginTop:"5rem",maxWidth:"50%",width:"100%"}},r.createElement("p",null,String(t)),r.createElement("div",null,r.createElement("button",{type:"button",onClick:n},"Retry"))):a?r.createElement("div",{style:{display:"flex",justifyContent:"center",alignItems:"center",height:"100vh"}},r.createElement("svg",{id:"loader",style:{width:128,height:110,position:"absolute",top:"calc(100vh - 64%)"},viewBox:"0 0 45 45",xmlns:"http://www.w3.org/2000/svg",stroke:"#61dafb"},r.createElement("g",{fill:"none",fillRule:"evenodd",transform:"translate(1 1)",strokeWidth:"2"},r.createElement("circle",{cx:"22",cy:"22",r:"6",strokeOpacity:"0"},r.createElement("animate",{attributeName:"r",begin:"1.5s",dur:"3s",values:"6;22",calcMode:"linear",repeatCount:"indefinite"}),r.createElement("animate",{attributeName:"stroke-opacity",begin:"1.5s",dur:"3s",values:"1;0",calcMode:"linear",repeatCount:"indefinite"}),r.createElement("animate",{attributeName:"stroke-width",begin:"1.5s",dur:"3s",values:"2;0",calcMode:"linear",repeatCount:"indefinite"})),r.createElement("circle",{cx:"22",cy:"22",r:"6",strokeOpacity:"0"},r.createElement("animate",{attributeName:"r",begin:"3s",dur:"3s",values:"6;22",calcMode:"linear",repeatCount:"indefinite"}),r.createElement("animate",{attributeName:"stroke-opacity",begin:"3s",dur:"3s",values:"1;0",calcMode:"linear",repeatCount:"indefinite"}),r.createElement("animate",{attributeName:"stroke-width",begin:"3s",dur:"3s",values:"2;0",calcMode:"linear",repeatCount:"indefinite"})),r.createElement("circle",{cx:"22",cy:"22",r:"8"},r.createElement("animate",{attributeName:"r",begin:"0s",dur:"1.5s",values:"6;1;2;3;4;5;6",calcMode:"linear",repeatCount:"indefinite"}))))):null}var c=n(99670),d=n(30226);function f(e,t){if("*"===e)return i()({loading:u,loader:()=>n.e(4972).then(n.bind(n,4972)),modules:["@theme/NotFound"],webpack:()=>[4972],render(e,t){const n=e.default;return r.createElement(d.z,{value:{plugin:{name:"native",id:"default"}}},r.createElement(n,t))}});const o=l[`${e}-${t}`],f={},p=[],m=[],h=(0,c.Z)(o);return Object.entries(h).forEach((e=>{let[t,n]=e;const r=s[n];r&&(f[t]=r[0],p.push(r[1]),m.push(r[2]))})),i().Map({loading:u,loader:f,modules:p,webpack:()=>m,render(t,n){const i=JSON.parse(JSON.stringify(o));Object.entries(t).forEach((t=>{let[n,r]=t;const a=r.default;if(!a)throw new Error(`The page component at ${e} doesn't have a default export. This makes it impossible to render anything. Consider default-exporting a React component.`);"object"!=typeof a&&"function"!=typeof a||Object.keys(r).filter((e=>"default"!==e)).forEach((e=>{a[e]=r[e]}));let o=i;const l=n.split(".");l.slice(0,-1).forEach((e=>{o=o[e]})),o[l[l.length-1]]=a}));const l=i.__comp;delete i.__comp;const s=i.__context;return delete i.__context,r.createElement(d.z,{value:s},r.createElement(l,(0,a.Z)({},i,n)))}})}const p=[{path:"/StudioComponents/api/",component:f("/StudioComponents/api/","a69"),exact:!0},{path:"/StudioComponents/api/Background",component:f("/StudioComponents/api/Background","b17"),exact:!0},{path:"/StudioComponents/api/Button",component:f("/StudioComponents/api/Button","cc0"),exact:!0},{path:"/StudioComponents/api/Checkbox",component:f("/StudioComponents/api/Checkbox","0d7"),exact:!0},{path:"/StudioComponents/api/ColorPicker",component:f("/StudioComponents/api/ColorPicker","fe3"),exact:!0},{path:"/StudioComponents/api/CommonProps",component:f("/StudioComponents/api/CommonProps","459"),exact:!0},{path:"/StudioComponents/api/Constants",component:f("/StudioComponents/api/Constants","38a"),exact:!0},{path:"/StudioComponents/api/Dropdown",component:f("/StudioComponents/api/Dropdown","009"),exact:!0},{path:"/StudioComponents/api/DropShadowFrame",component:f("/StudioComponents/api/DropShadowFrame","9b0"),exact:!0},{path:"/StudioComponents/api/Label",component:f("/StudioComponents/api/Label","9a6"),exact:!0},{path:"/StudioComponents/api/LoadingDots",component:f("/StudioComponents/api/LoadingDots","ffa"),exact:!0},{path:"/StudioComponents/api/MainButton",component:f("/StudioComponents/api/MainButton","f80"),exact:!0},{path:"/StudioComponents/api/NumberSequencePicker",component:f("/StudioComponents/api/NumberSequencePicker","ec2"),exact:!0},{path:"/StudioComponents/api/NumericInput",component:f("/StudioComponents/api/NumericInput","ff3"),exact:!0},{path:"/StudioComponents/api/PluginProvider",component:f("/StudioComponents/api/PluginProvider","1e5"),exact:!0},{path:"/StudioComponents/api/ProgressBar",component:f("/StudioComponents/api/ProgressBar","bd3"),exact:!0},{path:"/StudioComponents/api/RadioButton",component:f("/StudioComponents/api/RadioButton","3a0"),exact:!0},{path:"/StudioComponents/api/ScrollFrame",component:f("/StudioComponents/api/ScrollFrame","35b"),exact:!0},{path:"/StudioComponents/api/Slider",component:f("/StudioComponents/api/Slider","377"),exact:!0},{path:"/StudioComponents/api/Splitter",component:f("/StudioComponents/api/Splitter","8c4"),exact:!0},{path:"/StudioComponents/api/TabContainer",component:f("/StudioComponents/api/TabContainer","dae"),exact:!0},{path:"/StudioComponents/api/TextInput",component:f("/StudioComponents/api/TextInput","c03"),exact:!0},{path:"/StudioComponents/api/useMouseIcon",component:f("/StudioComponents/api/useMouseIcon","537"),exact:!0},{path:"/StudioComponents/api/useTheme",component:f("/StudioComponents/api/useTheme","b86"),exact:!0},{path:"/StudioComponents/CHANGELOG",component:f("/StudioComponents/CHANGELOG","3c7"),exact:!0},{path:"/StudioComponents/docs",component:f("/StudioComponents/docs","759"),routes:[{path:"/StudioComponents/docs/getting-started",component:f("/StudioComponents/docs/getting-started","0a1"),exact:!0,sidebar:"defaultSidebar"},{path:"/StudioComponents/docs/intro",component:f("/StudioComponents/docs/intro","644"),exact:!0,sidebar:"defaultSidebar"}]},{path:"/StudioComponents/",component:f("/StudioComponents/","d5c"),exact:!0},{path:"*",component:f("*")}]},98934:(e,t,n)=>{"use strict";n.d(t,{_:()=>a,t:()=>o});var r=n(67294);const a=r.createContext(!1);function o(e){let{children:t}=e;const[n,o]=(0,r.useState)(!1);return(0,r.useEffect)((()=>{o(!0)}),[]),r.createElement(a.Provider,{value:n},t)}},49383:(e,t,n)=>{"use strict";var r=n(67294),a=n(73935),o=n(73727),i=n(70405),l=n(10412);const s=[n(32497),n(3310),n(18320),n(34197),n(52295)];var u=n(723),c=n(16550),d=n(18790);function f(e){let{children:t}=e;return r.createElement(r.Fragment,null,t)}var p=n(87462),m=n(35742),h=n(52263),g=n(44996),v=n(86668),b=n(1944),y=n(94711),w=n(19727),E=n(43320),k=n(90197);function S(){const{i18n:{defaultLocale:e,localeConfigs:t}}=(0,h.Z)(),n=(0,y.l)();return r.createElement(m.Z,null,Object.entries(t).map((e=>{let[t,{htmlLang:a}]=e;return r.createElement("link",{key:t,rel:"alternate",href:n.createUrl({locale:t,fullyQualified:!0}),hrefLang:a})})),r.createElement("link",{rel:"alternate",href:n.createUrl({locale:e,fullyQualified:!0}),hrefLang:"x-default"}))}function C(e){let{permalink:t}=e;const{siteConfig:{url:n}}=(0,h.Z)(),a=function(){const{siteConfig:{url:e}}=(0,h.Z)(),{pathname:t}=(0,c.TH)();return e+(0,g.Z)(t)}(),o=t?`${n}${t}`:a;return r.createElement(m.Z,null,r.createElement("meta",{property:"og:url",content:o}),r.createElement("link",{rel:"canonical",href:o}))}function _(){const{i18n:{currentLocale:e}}=(0,h.Z)(),{metadata:t,image:n}=(0,v.L)();return r.createElement(r.Fragment,null,r.createElement(m.Z,null,r.createElement("meta",{name:"twitter:card",content:"summary_large_image"}),r.createElement("body",{className:w.h})),n&&r.createElement(b.d,{image:n}),r.createElement(C,null),r.createElement(S,null),r.createElement(k.Z,{tag:E.HX,locale:e}),r.createElement(m.Z,null,t.map(((e,t)=>r.createElement("meta",(0,p.Z)({key:t},e))))))}const x=new Map;function T(e){if(x.has(e.pathname))return{...e,pathname:x.get(e.pathname)};if((0,d.f)(u.Z,e.pathname).some((e=>{let{route:t}=e;return!0===t.exact})))return x.set(e.pathname,e.pathname),e;const t=e.pathname.trim().replace(/(?:\/index)?\.html$/,"")||"/";return x.set(e.pathname,t),{...e,pathname:t}}var L=n(98934),A=n(58940);function N(e){for(var t=arguments.length,n=new Array(t>1?t-1:0),r=1;r{const r=t.default?.[e]??t[e];return r?.(...n)}));return()=>a.forEach((e=>e?.()))}const P=function(e){let{children:t,location:n,previousLocation:a}=e;return(0,r.useLayoutEffect)((()=>{a!==n&&(!function(e){let{location:t,previousLocation:n}=e;if(!n)return;const r=t.pathname===n.pathname,a=t.hash===n.hash,o=t.search===n.search;if(r&&a&&!o)return;const{hash:i}=t;if(i){const e=decodeURIComponent(i.substring(1)),t=document.getElementById(e);t?.scrollIntoView()}else window.scrollTo(0,0)}({location:n,previousLocation:a}),N("onRouteDidUpdate",{previousLocation:a,location:n}))}),[a,n]),t};function O(e){const t=Array.from(new Set([e,decodeURI(e)])).map((e=>(0,d.f)(u.Z,e))).flat();return Promise.all(t.map((e=>e.route.component.preload?.())))}class I extends r.Component{constructor(e){super(e),this.previousLocation=void 0,this.routeUpdateCleanupCb=void 0,this.previousLocation=null,this.routeUpdateCleanupCb=l.Z.canUseDOM?N("onRouteUpdate",{previousLocation:null,location:this.props.location}):()=>{},this.state={nextRouteHasLoaded:!0}}shouldComponentUpdate(e,t){if(e.location===this.props.location)return t.nextRouteHasLoaded;const n=e.location;return this.previousLocation=this.props.location,this.setState({nextRouteHasLoaded:!1}),this.routeUpdateCleanupCb=N("onRouteUpdate",{previousLocation:this.previousLocation,location:n}),O(n.pathname).then((()=>{this.routeUpdateCleanupCb(),this.setState({nextRouteHasLoaded:!0})})).catch((e=>{console.warn(e),window.location.reload()})),!1}render(){const{children:e,location:t}=this.props;return r.createElement(P,{previousLocation:this.previousLocation,location:t},r.createElement(c.AW,{location:t,render:()=>e}))}}const D=I,R="docusaurus-base-url-issue-banner-container",M="docusaurus-base-url-issue-banner",F="docusaurus-base-url-issue-banner-suggestion-container",B="__DOCUSAURUS_INSERT_BASEURL_BANNER";function U(e){return`\nwindow['${B}'] = true;\n\ndocument.addEventListener('DOMContentLoaded', maybeInsertBanner);\n\nfunction maybeInsertBanner() {\n var shouldInsert = window['${B}'];\n shouldInsert && insertBanner();\n}\n\nfunction insertBanner() {\n var bannerContainer = document.getElementById('${R}');\n if (!bannerContainer) {\n return;\n }\n var bannerHtml = ${JSON.stringify(function(e){return`\n
\n

Your Docusaurus site did not load properly.

\n

A very common reason is a wrong site baseUrl configuration.

\n

Current configured baseUrl = ${e} ${"/"===e?" (default value)":""}

\n

We suggest trying baseUrl =

\n
\n`}(e)).replace(/{window[B]=!1}),[]),r.createElement(r.Fragment,null,!l.Z.canUseDOM&&r.createElement(m.Z,null,r.createElement("script",null,U(e))),r.createElement("div",{id:R}))}function $(){const{siteConfig:{baseUrl:e,baseUrlIssueBanner:t}}=(0,h.Z)(),{pathname:n}=(0,c.TH)();return t&&n===e?r.createElement(j,null):null}function z(){const{siteConfig:{favicon:e,title:t,noIndex:n},i18n:{currentLocale:a,localeConfigs:o}}=(0,h.Z)(),i=(0,g.Z)(e),{htmlLang:l,direction:s}=o[a];return r.createElement(m.Z,null,r.createElement("html",{lang:l,dir:s}),r.createElement("title",null,t),r.createElement("meta",{property:"og:title",content:t}),r.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1.0"}),n&&r.createElement("meta",{name:"robots",content:"noindex, nofollow"}),e&&r.createElement("link",{rel:"icon",href:i}))}var Z=n(44763);function H(){const e=(0,d.H)(u.Z),t=(0,c.TH)();return r.createElement(Z.Z,null,r.createElement(A.M,null,r.createElement(L.t,null,r.createElement(f,null,r.createElement(z,null),r.createElement(_,null),r.createElement($,null),r.createElement(D,{location:T(t)},e)))))}var V=n(16887);const G=function(e){try{return document.createElement("link").relList.supports(e)}catch{return!1}}("prefetch")?function(e){return new Promise(((t,n)=>{if("undefined"==typeof document)return void n();const r=document.createElement("link");r.setAttribute("rel","prefetch"),r.setAttribute("href",e),r.onload=()=>t(),r.onerror=()=>n();const a=document.getElementsByTagName("head")[0]??document.getElementsByName("script")[0]?.parentNode;a?.appendChild(r)}))}:function(e){return new Promise(((t,n)=>{const r=new XMLHttpRequest;r.open("GET",e,!0),r.withCredentials=!0,r.onload=()=>{200===r.status?t():n()},r.send(null)}))};var W=n(99670);const q=new Set,Y=new Set,K=()=>navigator.connection?.effectiveType.includes("2g")||navigator.connection?.saveData,X={prefetch(e){if(!(e=>!K()&&!Y.has(e)&&!q.has(e))(e))return!1;q.add(e);const t=(0,d.f)(u.Z,e).flatMap((e=>{return t=e.route.path,Object.entries(V).filter((e=>{let[n]=e;return n.replace(/-[^-]+$/,"")===t})).flatMap((e=>{let[,t]=e;return Object.values((0,W.Z)(t))}));var t}));return Promise.all(t.map((e=>{const t=n.gca(e);return t&&!t.includes("undefined")?G(t).catch((()=>{})):Promise.resolve()})))},preload:e=>!!(e=>!K()&&!Y.has(e))(e)&&(Y.add(e),O(e))},Q=Object.freeze(X);if(l.Z.canUseDOM){window.docusaurus=Q;const e=a.hydrate;O(window.location.pathname).then((()=>{e(r.createElement(i.B6,null,r.createElement(o.VK,null,r.createElement(H,null))),document.getElementById("__docusaurus"))}))}},58940:(e,t,n)=>{"use strict";n.d(t,{_:()=>c,M:()=>d});var r=n(67294),a=n(36809);const o=JSON.parse('{"docusaurus-lunr-search":{"default":{"fileNames":{"searchDoc":"search-doc-1714518019775.json","lunrIndex":"lunr-index-1714518019775.json"}}},"docusaurus-plugin-content-docs":{"default":{"path":"/StudioComponents/docs","versions":[{"name":"current","label":"Next","isLast":true,"path":"/StudioComponents/docs","mainDocId":"intro","docs":[{"id":"getting-started","path":"/StudioComponents/docs/getting-started","sidebar":"defaultSidebar"},{"id":"intro","path":"/StudioComponents/docs/intro","sidebar":"defaultSidebar"}],"draftIds":[],"sidebars":{"defaultSidebar":{"link":{"path":"/StudioComponents/docs/intro","label":"intro"}}}}],"breadcrumbs":true}}}'),i=JSON.parse('{"defaultLocale":"en","locales":["en"],"path":"i18n","currentLocale":"en","localeConfigs":{"en":{"label":"English","direction":"ltr","htmlLang":"en","calendar":"gregory","path":"en"}}}');var l=n(57529);const s=JSON.parse('{"docusaurusVersion":"2.3.1","siteVersion":"0.0.0","pluginVersions":{"docusaurus-plugin-content-docs":{"type":"package","name":"@docusaurus/plugin-content-docs","version":"2.3.1"},"docusaurus-plugin-content-pages":{"type":"package","name":"@docusaurus/plugin-content-pages","version":"2.3.1"},"docusaurus-plugin-sitemap":{"type":"package","name":"@docusaurus/plugin-sitemap","version":"2.3.1"},"docusaurus-theme-classic":{"type":"package","name":"@docusaurus/theme-classic","version":"2.3.1"},"docusaurus-plugin-moonwave":{"type":"package","name":"docusaurus-plugin-moonwave","version":"1.1.2"},"docusaurus-lunr-search":{"type":"package","name":"docusaurus-lunr-search","version":"2.3.2"}}}'),u={siteConfig:a.default,siteMetadata:s,globalData:o,i18n:i,codeTranslations:l},c=r.createContext(u);function d(e){let{children:t}=e;return r.createElement(c.Provider,{value:u},t)}},44763:(e,t,n)=>{"use strict";n.d(t,{Z:()=>c});var r=n(67294),a=n(10412),o=n(35742),i=n(34510);function l(e){let{error:t,tryAgain:n}=e;return r.createElement("div",{style:{display:"flex",flexDirection:"column",justifyContent:"center",alignItems:"center",height:"50vh",width:"100%",fontSize:"20px"}},r.createElement("h1",null,"This page crashed."),r.createElement("p",null,t.message),r.createElement("button",{type:"button",onClick:n},"Try again"))}function s(e){let{error:t,tryAgain:n}=e;return r.createElement(c,{fallback:()=>r.createElement(l,{error:t,tryAgain:n})},r.createElement(o.Z,null,r.createElement("title",null,"Page Error")),r.createElement(i.Z,null,r.createElement(l,{error:t,tryAgain:n})))}const u=e=>r.createElement(s,e);class c extends r.Component{constructor(e){super(e),this.state={error:null}}componentDidCatch(e){a.Z.canUseDOM&&this.setState({error:e})}render(){const{children:e}=this.props,{error:t}=this.state;if(t){const e={error:t,tryAgain:()=>this.setState({error:null})};return(this.props.fallback??u)(e)}return e??null}}},10412:(e,t,n)=>{"use strict";n.d(t,{Z:()=>a});const r="undefined"!=typeof window&&"document"in window&&"createElement"in window.document,a={canUseDOM:r,canUseEventListeners:r&&("addEventListener"in window||"attachEvent"in window),canUseIntersectionObserver:r&&"IntersectionObserver"in window,canUseViewport:r&&"screen"in window}},35742:(e,t,n)=>{"use strict";n.d(t,{Z:()=>o});var r=n(67294),a=n(70405);function o(e){return r.createElement(a.ql,e)}},39960:(e,t,n)=>{"use strict";n.d(t,{Z:()=>h});var r=n(87462),a=n(67294),o=n(73727),i=n(18780),l=n(52263),s=n(13919),u=n(10412);const c=a.createContext({collectLink:()=>{}}),d=()=>(0,a.useContext)(c);var f=n(44996);const p=e=>e.startsWith("/");function m(e,t){let{isNavLink:n,to:c,href:m,activeClassName:h,isActive:g,"data-noBrokenLinkCheck":v,autoAddBaseUrl:b=!0,...y}=e;const{siteConfig:{trailingSlash:w,baseUrl:E}}=(0,l.Z)(),{withBaseUrl:k}=(0,f.C)(),S=d(),C=(0,a.useRef)(null);(0,a.useImperativeHandle)(t,(()=>C.current));const _=c||m;const x=(0,s.Z)(_),T=_?.replace("pathname://","");let L=void 0!==T?(A=T,b&&p(A)?k(A):A):void 0;var A;L&&x&&(L=(0,i.applyTrailingSlash)(L,{trailingSlash:w,baseUrl:E}));const N=(0,a.useRef)(!1),P=n?o.OL:o.rU,O=u.Z.canUseIntersectionObserver,I=(0,a.useRef)(),D=()=>{N.current||null==L||(window.docusaurus.preload(L),N.current=!0)};(0,a.useEffect)((()=>(!O&&x&&null!=L&&window.docusaurus.prefetch(L),()=>{O&&I.current&&I.current.disconnect()})),[I,L,O,x]);const R=L?.startsWith("#")??!1,M=!L||!x||R;return M||v||S.collectLink(L),M?a.createElement("a",(0,r.Z)({ref:C,href:L},_&&!x&&{target:"_blank",rel:"noopener noreferrer"},y)):a.createElement(P,(0,r.Z)({},y,{onMouseEnter:D,onTouchStart:D,innerRef:e=>{C.current=e,O&&e&&x&&(I.current=new window.IntersectionObserver((t=>{t.forEach((t=>{e===t.target&&(t.isIntersecting||t.intersectionRatio>0)&&(I.current.unobserve(e),I.current.disconnect(),null!=L&&window.docusaurus.prefetch(L))}))})),I.current.observe(e))},to:L},n&&{isActive:g,activeClassName:h}))}const h=a.forwardRef(m)},95999:(e,t,n)=>{"use strict";n.d(t,{Z:()=>s,I:()=>l});var r=n(67294);function a(e,t){const n=e.split(/(\{\w+\})/).map(((e,n)=>{if(n%2==1){const n=t?.[e.slice(1,-1)];if(void 0!==n)return n}return e}));return n.some((e=>(0,r.isValidElement)(e)))?n.map(((e,t)=>(0,r.isValidElement)(e)?r.cloneElement(e,{key:t}):e)).filter((e=>""!==e)):n.join("")}var o=n(57529);function i(e){let{id:t,message:n}=e;if(void 0===t&&void 0===n)throw new Error("Docusaurus translation declarations must have at least a translation id or a default translation message");return o[t??n]??n??t}function l(e,t){let{message:n,id:r}=e;return a(i({message:n,id:r}),t)}function s(e){let{children:t,id:n,values:o}=e;if(t&&"string"!=typeof t)throw console.warn("Illegal children",t),new Error("The Docusaurus component only accept simple string values");const l=i({message:t,id:n});return r.createElement(r.Fragment,null,a(l,o))}},29935:(e,t,n)=>{"use strict";n.d(t,{m:()=>r});const r="default"},13919:(e,t,n)=>{"use strict";function r(e){return/^(?:\w*:|\/\/)/.test(e)}function a(e){return void 0!==e&&!r(e)}n.d(t,{Z:()=>a,b:()=>r})},44996:(e,t,n)=>{"use strict";n.d(t,{C:()=>i,Z:()=>l});var r=n(67294),a=n(52263),o=n(13919);function i(){const{siteConfig:{baseUrl:e,url:t}}=(0,a.Z)(),n=(0,r.useCallback)(((n,r)=>function(e,t,n,r){let{forcePrependBaseUrl:a=!1,absolute:i=!1}=void 0===r?{}:r;if(!n||n.startsWith("#")||(0,o.b)(n))return n;if(a)return t+n.replace(/^\//,"");if(n===t.replace(/\/$/,""))return t;const l=n.startsWith(t)?n:t+n.replace(/^\//,"");return i?e+l:l}(t,e,n,r)),[t,e]);return{withBaseUrl:n}}function l(e,t){void 0===t&&(t={});const{withBaseUrl:n}=i();return n(e,t)}},52263:(e,t,n)=>{"use strict";n.d(t,{Z:()=>o});var r=n(67294),a=n(58940);function o(){return(0,r.useContext)(a._)}},28084:(e,t,n)=>{"use strict";n.d(t,{OD:()=>o,eZ:()=>i});var r=n(52263),a=n(29935);function o(e,t){void 0===t&&(t={});const n=function(){const{globalData:e}=(0,r.Z)();return e}()[e];if(!n&&t.failfast)throw new Error(`Docusaurus plugin global data not found for "${e}" plugin.`);return n}function i(e,t,n){void 0===t&&(t=a.m),void 0===n&&(n={});const r=o(e),i=r?.[t];if(!i&&n.failfast)throw new Error(`Docusaurus plugin global data not found for "${e}" plugin with id "${t}".`);return i}},72389:(e,t,n)=>{"use strict";n.d(t,{Z:()=>o});var r=n(67294),a=n(98934);function o(){return(0,r.useContext)(a._)}},99670:(e,t,n)=>{"use strict";n.d(t,{Z:()=>a});const r=e=>"object"==typeof e&&!!e&&Object.keys(e).length>0;function a(e){const t=".",n={};return function e(a,o){Object.entries(a).forEach((a=>{let[i,l]=a;const s=o?`${o}${t}${i}`:i;r(l)?e(l,s):n[s]=l}))}(e),n}},30226:(e,t,n)=>{"use strict";n.d(t,{_:()=>a,z:()=>o});var r=n(67294);const a=r.createContext(null);function o(e){let{children:t,value:n}=e;const o=r.useContext(a),i=(0,r.useMemo)((()=>function(e){let{parent:t,value:n}=e;if(!t){if(!n)throw new Error("Unexpected: no Docusaurus route context found");if(!("plugin"in n))throw new Error("Unexpected: Docusaurus topmost route context has no `plugin` attribute");return n}const r={...t.data,...n?.data};return{plugin:t.plugin,data:r}}({parent:o,value:n})),[o,n]);return r.createElement(a.Provider,{value:i},t)}},94104:(e,t,n)=>{"use strict";n.d(t,{Iw:()=>p,gA:()=>c,_r:()=>s,Jo:()=>m,zh:()=>u,yW:()=>f,gB:()=>d});var r=n(16550),a=n(28084);const o=e=>e.versions.find((e=>e.isLast));function i(e,t){const n=function(e,t){const n=o(e);return[...e.versions.filter((e=>e!==n)),n].find((e=>!!(0,r.LX)(t,{path:e.path,exact:!1,strict:!1})))}(e,t),a=n?.docs.find((e=>!!(0,r.LX)(t,{path:e.path,exact:!0,strict:!1})));return{activeVersion:n,activeDoc:a,alternateDocVersions:a?function(t){const n={};return e.versions.forEach((e=>{e.docs.forEach((r=>{r.id===t&&(n[e.name]=r)}))})),n}(a.id):{}}}const l={},s=()=>(0,a.OD)("docusaurus-plugin-content-docs")??l,u=e=>(0,a.eZ)("docusaurus-plugin-content-docs",e,{failfast:!0});function c(e){void 0===e&&(e={});const t=s(),{pathname:n}=(0,r.TH)();return function(e,t,n){void 0===n&&(n={});const a=Object.entries(e).sort(((e,t)=>t[1].path.localeCompare(e[1].path))).find((e=>{let[,n]=e;return!!(0,r.LX)(t,{path:n.path,exact:!1,strict:!1})})),o=a?{pluginId:a[0],pluginData:a[1]}:void 0;if(!o&&n.failfast)throw new Error(`Can't find active docs plugin for "${t}" pathname, while it was expected to be found. Maybe you tried to use a docs feature that can only be used on a docs-related page? Existing docs plugin paths are: ${Object.values(e).map((e=>e.path)).join(", ")}`);return o}(t,n,e)}function d(e){return u(e).versions}function f(e){const t=u(e);return o(t)}function p(e){const t=u(e),{pathname:n}=(0,r.TH)();return i(t,n)}function m(e){const t=u(e),{pathname:n}=(0,r.TH)();return function(e,t){const n=o(e);return{latestDocSuggestion:i(e,t).alternateDocVersions[n.name],latestVersionSuggestion:n}}(t,n)}},18320:(e,t,n)=>{"use strict";n.r(t),n.d(t,{default:()=>o});var r=n(74865),a=n.n(r);a().configure({showSpinner:!1});const o={onRouteUpdate(e){let{location:t,previousLocation:n}=e;if(n&&t.pathname!==n.pathname){const e=window.setTimeout((()=>{a().start()}),200);return()=>window.clearTimeout(e)}},onRouteDidUpdate(){a().done()}}},3310:(e,t,n)=>{"use strict";n.r(t);var r=n(87410),a=n(36809);!function(e){const{themeConfig:{prism:t}}=a.default,{additionalLanguages:r}=t;globalThis.Prism=e,r.forEach((e=>{n(33003)(`./prism-${e}`)})),delete globalThis.Prism}(r.Z)},39471:(e,t,n)=>{"use strict";n.d(t,{Z:()=>o});var r=n(67294);const a={iconExternalLink:"iconExternalLink_nPIU"};function o(e){let{width:t=13.5,height:n=13.5}=e;return r.createElement("svg",{width:t,height:n,"aria-hidden":"true",viewBox:"0 0 24 24",className:a.iconExternalLink},r.createElement("path",{fill:"currentColor",d:"M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"}))}},34510:(e,t,n)=>{"use strict";n.d(t,{Z:()=>ut});var r=n(67294),a=n(86010),o=n(44763),i=n(1944),l=n(87462),s=n(16550),u=n(95999),c=n(85936);const d="docusaurus_skipToContent_fallback";function f(e){e.setAttribute("tabindex","-1"),e.focus(),e.removeAttribute("tabindex")}function p(){const e=(0,r.useRef)(null),{action:t}=(0,s.k6)(),n=(0,r.useCallback)((e=>{e.preventDefault();const t=document.querySelector("main:first-of-type")??document.getElementById(d);t&&f(t)}),[]);return(0,c.S)((n=>{let{location:r}=n;e.current&&!r.hash&&"PUSH"===t&&f(e.current)})),{containerRef:e,onClick:n}}const m=(0,u.I)({id:"theme.common.skipToMainContent",description:"The skip to content label used for accessibility, allowing to rapidly navigate to main content with keyboard tab/enter navigation",message:"Skip to main content"});function h(e){const t=e.children??m,{containerRef:n,onClick:a}=p();return r.createElement("div",{ref:n,role:"region","aria-label":m},r.createElement("a",(0,l.Z)({},e,{href:`#${d}`,onClick:a}),t))}var g=n(35281),v=n(19727);const b={skipToContent:"skipToContent_fXgn"};function y(){return r.createElement(h,{className:b.skipToContent})}var w=n(86668),E=n(59689);function k(e){let{width:t=21,height:n=21,color:a="currentColor",strokeWidth:o=1.2,className:i,...s}=e;return r.createElement("svg",(0,l.Z)({viewBox:"0 0 15 15",width:t,height:n},s),r.createElement("g",{stroke:a,strokeWidth:o},r.createElement("path",{d:"M.75.75l13.5 13.5M14.25.75L.75 14.25"})))}const S={closeButton:"closeButton_CVFx"};function C(e){return r.createElement("button",(0,l.Z)({type:"button","aria-label":(0,u.I)({id:"theme.AnnouncementBar.closeButtonAriaLabel",message:"Close",description:"The ARIA label for close button of announcement bar"})},e,{className:(0,a.Z)("clean-btn close",S.closeButton,e.className)}),r.createElement(k,{width:14,height:14,strokeWidth:3.1}))}const _={content:"content_knG7"};function x(e){const{announcementBar:t}=(0,w.L)(),{content:n}=t;return r.createElement("div",(0,l.Z)({},e,{className:(0,a.Z)(_.content,e.className),dangerouslySetInnerHTML:{__html:n}}))}const T={announcementBar:"announcementBar_mb4j",announcementBarPlaceholder:"announcementBarPlaceholder_vyr4",announcementBarClose:"announcementBarClose_gvF7",announcementBarContent:"announcementBarContent_xLdY"};function L(){const{announcementBar:e}=(0,w.L)(),{isActive:t,close:n}=(0,E.nT)();if(!t)return null;const{backgroundColor:a,textColor:o,isCloseable:i}=e;return r.createElement("div",{className:T.announcementBar,style:{backgroundColor:a,color:o},role:"banner"},i&&r.createElement("div",{className:T.announcementBarPlaceholder}),r.createElement(x,{className:T.announcementBarContent}),i&&r.createElement(C,{onClick:n,className:T.announcementBarClose}))}var A=n(72961),N=n(12466);var P=n(902),O=n(13102);const I=r.createContext(null);function D(e){let{children:t}=e;const n=function(){const e=(0,A.e)(),t=(0,O.HY)(),[n,a]=(0,r.useState)(!1),o=null!==t.component,i=(0,P.D9)(o);return(0,r.useEffect)((()=>{o&&!i&&a(!0)}),[o,i]),(0,r.useEffect)((()=>{o?e.shown||a(!0):a(!1)}),[e.shown,o]),(0,r.useMemo)((()=>[n,a]),[n])}();return r.createElement(I.Provider,{value:n},t)}function R(e){if(e.component){const t=e.component;return r.createElement(t,e.props)}}function M(){const e=(0,r.useContext)(I);if(!e)throw new P.i6("NavbarSecondaryMenuDisplayProvider");const[t,n]=e,a=(0,r.useCallback)((()=>n(!1)),[n]),o=(0,O.HY)();return(0,r.useMemo)((()=>({shown:t,hide:a,content:R(o)})),[a,o,t])}function F(e){let{header:t,primaryMenu:n,secondaryMenu:o}=e;const{shown:i}=M();return r.createElement("div",{className:"navbar-sidebar"},t,r.createElement("div",{className:(0,a.Z)("navbar-sidebar__items",{"navbar-sidebar__items--show-secondary":i})},r.createElement("div",{className:"navbar-sidebar__item menu"},n),r.createElement("div",{className:"navbar-sidebar__item menu"},o)))}var B=n(92949),U=n(72389);function j(e){return r.createElement("svg",(0,l.Z)({viewBox:"0 0 24 24",width:24,height:24},e),r.createElement("path",{fill:"currentColor",d:"M12,9c1.65,0,3,1.35,3,3s-1.35,3-3,3s-3-1.35-3-3S10.35,9,12,9 M12,7c-2.76,0-5,2.24-5,5s2.24,5,5,5s5-2.24,5-5 S14.76,7,12,7L12,7z M2,13l2,0c0.55,0,1-0.45,1-1s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S1.45,13,2,13z M20,13l2,0c0.55,0,1-0.45,1-1 s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S19.45,13,20,13z M11,2v2c0,0.55,0.45,1,1,1s1-0.45,1-1V2c0-0.55-0.45-1-1-1S11,1.45,11,2z M11,20v2c0,0.55,0.45,1,1,1s1-0.45,1-1v-2c0-0.55-0.45-1-1-1C11.45,19,11,19.45,11,20z M5.99,4.58c-0.39-0.39-1.03-0.39-1.41,0 c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0s0.39-1.03,0-1.41L5.99,4.58z M18.36,16.95 c-0.39-0.39-1.03-0.39-1.41,0c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0c0.39-0.39,0.39-1.03,0-1.41 L18.36,16.95z M19.42,5.99c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06c-0.39,0.39-0.39,1.03,0,1.41 s1.03,0.39,1.41,0L19.42,5.99z M7.05,18.36c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06 c-0.39,0.39-0.39,1.03,0,1.41s1.03,0.39,1.41,0L7.05,18.36z"}))}function $(e){return r.createElement("svg",(0,l.Z)({viewBox:"0 0 24 24",width:24,height:24},e),r.createElement("path",{fill:"currentColor",d:"M9.37,5.51C9.19,6.15,9.1,6.82,9.1,7.5c0,4.08,3.32,7.4,7.4,7.4c0.68,0,1.35-0.09,1.99-0.27C17.45,17.19,14.93,19,12,19 c-3.86,0-7-3.14-7-7C5,9.07,6.81,6.55,9.37,5.51z M12,3c-4.97,0-9,4.03-9,9s4.03,9,9,9s9-4.03,9-9c0-0.46-0.04-0.92-0.1-1.36 c-0.98,1.37-2.58,2.26-4.4,2.26c-2.98,0-5.4-2.42-5.4-5.4c0-1.81,0.89-3.42,2.26-4.4C12.92,3.04,12.46,3,12,3L12,3z"}))}const z={toggle:"toggle_vylO",toggleButton:"toggleButton_gllP",darkToggleIcon:"darkToggleIcon_wfgR",lightToggleIcon:"lightToggleIcon_pyhR",toggleButtonDisabled:"toggleButtonDisabled_aARS"};function Z(e){let{className:t,value:n,onChange:o}=e;const i=(0,U.Z)(),l=(0,u.I)({message:"Switch between dark and light mode (currently {mode})",id:"theme.colorToggle.ariaLabel",description:"The ARIA label for the navbar color mode toggle"},{mode:"dark"===n?(0,u.I)({message:"dark mode",id:"theme.colorToggle.ariaLabel.mode.dark",description:"The name for the dark color mode"}):(0,u.I)({message:"light mode",id:"theme.colorToggle.ariaLabel.mode.light",description:"The name for the light color mode"})});return r.createElement("div",{className:(0,a.Z)(z.toggle,t)},r.createElement("button",{className:(0,a.Z)("clean-btn",z.toggleButton,!i&&z.toggleButtonDisabled),type:"button",onClick:()=>o("dark"===n?"light":"dark"),disabled:!i,title:l,"aria-label":l,"aria-live":"polite"},r.createElement(j,{className:(0,a.Z)(z.toggleIcon,z.lightToggleIcon)}),r.createElement($,{className:(0,a.Z)(z.toggleIcon,z.darkToggleIcon)})))}const H=r.memo(Z);function V(e){let{className:t}=e;const n=(0,w.L)().colorMode.disableSwitch,{colorMode:a,setColorMode:o}=(0,B.I)();return n?null:r.createElement(H,{className:t,value:a,onChange:o})}var G=n(21327);function W(){return r.createElement(G.Z,{className:"navbar__brand",imageClassName:"navbar__logo",titleClassName:"navbar__title text--truncate"})}function q(){const e=(0,A.e)();return r.createElement("button",{type:"button","aria-label":(0,u.I)({id:"theme.docs.sidebar.closeSidebarButtonAriaLabel",message:"Close navigation bar",description:"The ARIA label for close button of mobile sidebar"}),className:"clean-btn navbar-sidebar__close",onClick:()=>e.toggle()},r.createElement(k,{color:"var(--ifm-color-emphasis-600)"}))}function Y(){return r.createElement("div",{className:"navbar-sidebar__brand"},r.createElement(W,null),r.createElement(V,{className:"margin-right--md"}),r.createElement(q,null))}var K=n(39960),X=n(44996),Q=n(13919);function J(e,t){return void 0!==e&&void 0!==t&&new RegExp(e,"gi").test(t)}var ee=n(39471);function te(e){let{activeBasePath:t,activeBaseRegex:n,to:a,href:o,label:i,html:s,isDropdownLink:u,prependBaseUrlToHref:c,...d}=e;const f=(0,X.Z)(a),p=(0,X.Z)(t),m=(0,X.Z)(o,{forcePrependBaseUrl:!0}),h=i&&o&&!(0,Q.Z)(o),g=s?{dangerouslySetInnerHTML:{__html:s}}:{children:r.createElement(r.Fragment,null,i,h&&r.createElement(ee.Z,u&&{width:12,height:12}))};return o?r.createElement(K.Z,(0,l.Z)({href:c?m:o},d,g)):r.createElement(K.Z,(0,l.Z)({to:f,isNavLink:!0},(t||n)&&{isActive:(e,t)=>n?J(n,t.pathname):t.pathname.startsWith(p)},d,g))}function ne(e){let{className:t,isDropdownItem:n=!1,...o}=e;const i=r.createElement(te,(0,l.Z)({className:(0,a.Z)(n?"dropdown__link":"navbar__item navbar__link",t),isDropdownLink:n},o));return n?r.createElement("li",null,i):i}function re(e){let{className:t,isDropdownItem:n,...o}=e;return r.createElement("li",{className:"menu__list-item"},r.createElement(te,(0,l.Z)({className:(0,a.Z)("menu__link",t)},o)))}function ae(e){let{mobile:t=!1,position:n,...a}=e;const o=t?re:ne;return r.createElement(o,(0,l.Z)({},a,{activeClassName:a.activeClassName??(t?"menu__link--active":"navbar__link--active")}))}var oe=n(86043),ie=n(48596),le=n(52263);function se(e,t){return e.some((e=>function(e,t){return!!(0,ie.Mg)(e.to,t)||!!J(e.activeBaseRegex,t)||!(!e.activeBasePath||!t.startsWith(e.activeBasePath))}(e,t)))}function ue(e){let{items:t,position:n,className:o,onClick:i,...s}=e;const u=(0,r.useRef)(null),[c,d]=(0,r.useState)(!1);return(0,r.useEffect)((()=>{const e=e=>{u.current&&!u.current.contains(e.target)&&d(!1)};return document.addEventListener("mousedown",e),document.addEventListener("touchstart",e),()=>{document.removeEventListener("mousedown",e),document.removeEventListener("touchstart",e)}}),[u]),r.createElement("div",{ref:u,className:(0,a.Z)("navbar__item","dropdown","dropdown--hoverable",{"dropdown--right":"right"===n,"dropdown--show":c})},r.createElement(te,(0,l.Z)({"aria-haspopup":"true","aria-expanded":c,role:"button",href:s.to?void 0:"#",className:(0,a.Z)("navbar__link",o)},s,{onClick:s.to?void 0:e=>e.preventDefault(),onKeyDown:e=>{"Enter"===e.key&&(e.preventDefault(),d(!c))}}),s.children??s.label),r.createElement("ul",{className:"dropdown__menu"},t.map(((e,n)=>r.createElement(Te,(0,l.Z)({isDropdownItem:!0,onKeyDown:e=>{if(n===t.length-1&&"Tab"===e.key){e.preventDefault(),d(!1);const t=u.current.nextElementSibling;if(t){(t instanceof HTMLAnchorElement?t:t.querySelector("a")).focus()}}},activeClassName:"dropdown__link--active"},e,{key:n}))))))}function ce(e){let{items:t,className:n,position:o,onClick:i,...u}=e;const c=function(){const{siteConfig:{baseUrl:e}}=(0,le.Z)(),{pathname:t}=(0,s.TH)();return t.replace(e,"/")}(),d=se(t,c),{collapsed:f,toggleCollapsed:p,setCollapsed:m}=(0,oe.u)({initialState:()=>!d});return(0,r.useEffect)((()=>{d&&m(!d)}),[c,d,m]),r.createElement("li",{className:(0,a.Z)("menu__list-item",{"menu__list-item--collapsed":f})},r.createElement(te,(0,l.Z)({role:"button",className:(0,a.Z)("menu__link menu__link--sublist menu__link--sublist-caret",n)},u,{onClick:e=>{e.preventDefault(),p()}}),u.children??u.label),r.createElement(oe.z,{lazy:!0,as:"ul",className:"menu__list",collapsed:f},t.map(((e,t)=>r.createElement(Te,(0,l.Z)({mobile:!0,isDropdownItem:!0,onClick:i,activeClassName:"menu__link--active"},e,{key:t}))))))}function de(e){let{mobile:t=!1,...n}=e;const a=t?ce:ue;return r.createElement(a,n)}var fe=n(94711);function pe(e){let{width:t=20,height:n=20,...a}=e;return r.createElement("svg",(0,l.Z)({viewBox:"0 0 24 24",width:t,height:n,"aria-hidden":!0},a),r.createElement("path",{fill:"currentColor",d:"M12.87 15.07l-2.54-2.51.03-.03c1.74-1.94 2.98-4.17 3.71-6.53H17V4h-7V2H8v2H1v1.99h11.17C11.5 7.92 10.44 9.75 9 11.35 8.07 10.32 7.3 9.19 6.69 8h-2c.73 1.63 1.73 3.17 2.98 4.56l-5.09 5.02L4 19l5-5 3.11 3.11.76-2.04zM18.5 10h-2L12 22h2l1.12-3h4.75L21 22h2l-4.5-12zm-2.62 7l1.62-4.33L19.12 17h-3.24z"}))}const me={iconLanguage:"iconLanguage_nlXk"};var he=n(94184),ge=n.n(he),ve=n(28084);const be=e=>{const t=(0,r.useRef)(!1),a=(0,r.useRef)(null),[o,i]=(0,r.useState)(!1),l=(0,s.k6)(),{siteConfig:u={}}=(0,le.Z)(),c=(0,U.Z)(),{baseUrl:d}=u,f=(0,ve.eZ)("docusaurus-lunr-search"),p=()=>{t.current||(Promise.all([fetch(`${d}${f.fileNames.searchDoc}`).then((e=>e.json())),fetch(`${d}${f.fileNames.lunrIndex}`).then((e=>e.json())),Promise.all([n.e(9878),n.e(3339)]).then(n.bind(n,30894)),Promise.all([n.e(532),n.e(3343)]).then(n.bind(n,53343))]).then((e=>{let[t,n,{default:r}]=e;0!==t.length&&(((e,t,n)=>{new n({searchDocs:e,searchIndex:t,baseUrl:d,inputSelector:"#search_input_react",handleSelected:(e,t,n)=>{const r=n.url||"/";document.createElement("a").href=r,l.push(r)}})})(t,n,r),i(!0))})),t.current=!0)},m=(0,r.useCallback)((t=>{a.current.contains(t.target)||a.current.focus(),e.handleSearchBarToggle&&e.handleSearchBarToggle(!e.isSearchBarExpanded)}),[e.isSearchBarExpanded]);return c&&p(),r.createElement("div",{className:"navbar__search",key:"search-box"},r.createElement("span",{"aria-label":"expand searchbar",role:"button",className:ge()("search-icon",{"search-icon-hidden":e.isSearchBarExpanded}),onClick:m,onKeyDown:m,tabIndex:0}),r.createElement("input",{id:"search_input_react",type:"search",placeholder:o?"Search":"Loading...","aria-label":"Search",className:ge()("navbar__search-input",{"search-bar-expanded":e.isSearchBarExpanded},{"search-bar":!e.isSearchBarExpanded}),onClick:p,onMouseOver:p,onFocus:m,onBlur:m,ref:a,disabled:!o}))},ye={searchBox:"searchBox_ZlJk"};function we(e){let{children:t,className:n}=e;return r.createElement("div",{className:(0,a.Z)(n,ye.searchBox)},t)}var Ee=n(94104),ke=n(52802);const Se=e=>e.docs.find((t=>t.id===e.mainDocId));var Ce=n(60373);const _e=e=>e.docs.find((t=>t.id===e.mainDocId));const xe={default:ae,localeDropdown:function(e){let{mobile:t,dropdownItemsBefore:n,dropdownItemsAfter:a,...o}=e;const{i18n:{currentLocale:i,locales:c,localeConfigs:d}}=(0,le.Z)(),f=(0,fe.l)(),{search:p,hash:m}=(0,s.TH)(),h=[...n,...c.map((e=>{const n=`${`pathname://${f.createUrl({locale:e,fullyQualified:!1})}`}${p}${m}`;return{label:d[e].label,lang:d[e].htmlLang,to:n,target:"_self",autoAddBaseUrl:!1,className:e===i?t?"menu__link--active":"dropdown__link--active":""}})),...a],g=t?(0,u.I)({message:"Languages",id:"theme.navbar.mobileLanguageDropdown.label",description:"The label for the mobile language switcher dropdown"}):d[i].label;return r.createElement(de,(0,l.Z)({},o,{mobile:t,label:r.createElement(r.Fragment,null,r.createElement(pe,{className:me.iconLanguage}),g),items:h}))},search:function(e){let{mobile:t,className:n}=e;return t?null:r.createElement(we,{className:n},r.createElement(be,null))},dropdown:de,html:function(e){let{value:t,className:n,mobile:o=!1,isDropdownItem:i=!1}=e;const l=i?"li":"div";return r.createElement(l,{className:(0,a.Z)({navbar__item:!o&&!i,"menu__list-item":o},n),dangerouslySetInnerHTML:{__html:t}})},doc:function(e){let{docId:t,label:n,docsPluginId:a,...o}=e;const{activeDoc:i}=(0,Ee.Iw)(a),s=(0,ke.vY)(t,a);return null===s?null:r.createElement(ae,(0,l.Z)({exact:!0},o,{isActive:()=>i?.path===s.path||!!i?.sidebar&&i.sidebar===s.sidebar,label:n??s.id,to:s.path}))},docSidebar:function(e){let{sidebarId:t,label:n,docsPluginId:a,...o}=e;const{activeDoc:i}=(0,Ee.Iw)(a),s=(0,ke.oz)(t,a).link;if(!s)throw new Error(`DocSidebarNavbarItem: Sidebar with ID "${t}" doesn't have anything to be linked to.`);return r.createElement(ae,(0,l.Z)({exact:!0},o,{isActive:()=>i?.sidebar===t,label:n??s.label,to:s.path}))},docsVersion:function(e){let{label:t,to:n,docsPluginId:a,...o}=e;const i=(0,ke.lO)(a)[0],s=t??i.label,u=n??Se(i).path;return r.createElement(ae,(0,l.Z)({},o,{label:s,to:u}))},docsVersionDropdown:function(e){let{mobile:t,docsPluginId:n,dropdownActiveClassDisabled:a,dropdownItemsBefore:o,dropdownItemsAfter:i,...c}=e;const{search:d,hash:f}=(0,s.TH)(),p=(0,Ee.Iw)(n),m=(0,Ee.gB)(n),{savePreferredVersionName:h}=(0,Ce.J)(n),g=[...o,...m.map((e=>{const t=p.alternateDocVersions[e.name]??_e(e);return{label:e.label,to:`${t.path}${d}${f}`,isActive:()=>e===p.activeVersion,onClick:()=>h(e.name)}})),...i],v=(0,ke.lO)(n)[0],b=t&&g.length>1?(0,u.I)({id:"theme.navbar.mobileVersionsDropdown.label",message:"Versions",description:"The label for the navbar versions dropdown on mobile view"}):v.label,y=t&&g.length>1?void 0:_e(v).path;return g.length<=1?r.createElement(ae,(0,l.Z)({},c,{mobile:t,label:b,to:y,isActive:a?()=>!1:void 0})):r.createElement(de,(0,l.Z)({},c,{mobile:t,label:b,to:y,items:g,isActive:a?()=>!1:void 0}))}};function Te(e){let{type:t,...n}=e;const a=function(e,t){return e&&"default"!==e?e:"items"in t?"dropdown":"default"}(t,n),o=xe[a];if(!o)throw new Error(`No NavbarItem component found for type "${t}".`);return r.createElement(o,n)}function Le(){const e=(0,A.e)(),t=(0,w.L)().navbar.items;return r.createElement("ul",{className:"menu__list"},t.map(((t,n)=>r.createElement(Te,(0,l.Z)({mobile:!0},t,{onClick:()=>e.toggle(),key:n})))))}function Ae(e){return r.createElement("button",(0,l.Z)({},e,{type:"button",className:"clean-btn navbar-sidebar__back"}),r.createElement(u.Z,{id:"theme.navbar.mobileSidebarSecondaryMenu.backButtonLabel",description:"The label of the back button to return to main menu, inside the mobile navbar sidebar secondary menu (notably used to display the docs sidebar)"},"\u2190 Back to main menu"))}function Ne(){const e=0===(0,w.L)().navbar.items.length,t=M();return r.createElement(r.Fragment,null,!e&&r.createElement(Ae,{onClick:()=>t.hide()}),t.content)}function Pe(){const e=(0,A.e)();var t;return void 0===(t=e.shown)&&(t=!0),(0,r.useEffect)((()=>(document.body.style.overflow=t?"hidden":"visible",()=>{document.body.style.overflow="visible"})),[t]),e.shouldRender?r.createElement(F,{header:r.createElement(Y,null),primaryMenu:r.createElement(Le,null),secondaryMenu:r.createElement(Ne,null)}):null}const Oe={navbarHideable:"navbarHideable_m1mJ",navbarHidden:"navbarHidden_jGov"};function Ie(e){return r.createElement("div",(0,l.Z)({role:"presentation"},e,{className:(0,a.Z)("navbar-sidebar__backdrop",e.className)}))}function De(e){let{children:t}=e;const{navbar:{hideOnScroll:n,style:o}}=(0,w.L)(),i=(0,A.e)(),{navbarRef:l,isNavbarVisible:s}=function(e){const[t,n]=(0,r.useState)(e),a=(0,r.useRef)(!1),o=(0,r.useRef)(0),i=(0,r.useCallback)((e=>{null!==e&&(o.current=e.getBoundingClientRect().height)}),[]);return(0,N.RF)(((t,r)=>{let{scrollY:i}=t;if(!e)return;if(i=l?n(!1):i+u{if(!e)return;const r=t.location.hash;if(r?document.getElementById(r.substring(1)):void 0)return a.current=!0,void n(!1);n(!0)})),{navbarRef:i,isNavbarVisible:t}}(n);return r.createElement("nav",{ref:l,"aria-label":(0,u.I)({id:"theme.NavBar.navAriaLabel",message:"Main",description:"The ARIA label for the main navigation"}),className:(0,a.Z)("navbar","navbar--fixed-top",n&&[Oe.navbarHideable,!s&&Oe.navbarHidden],{"navbar--dark":"dark"===o,"navbar--primary":"primary"===o,"navbar-sidebar--show":i.shown})},t,r.createElement(Ie,{onClick:i.toggle}),r.createElement(Pe,null))}const Re="right";function Me(e){let{width:t=30,height:n=30,className:a,...o}=e;return r.createElement("svg",(0,l.Z)({className:a,width:t,height:n,viewBox:"0 0 30 30","aria-hidden":"true"},o),r.createElement("path",{stroke:"currentColor",strokeLinecap:"round",strokeMiterlimit:"10",strokeWidth:"2",d:"M4 7h22M4 15h22M4 23h22"}))}function Fe(){const{toggle:e,shown:t}=(0,A.e)();return r.createElement("button",{onClick:e,"aria-label":(0,u.I)({id:"theme.docs.sidebar.toggleSidebarButtonAriaLabel",message:"Toggle navigation bar",description:"The ARIA label for hamburger menu button of mobile navigation"}),"aria-expanded":t,className:"navbar__toggle clean-btn",type:"button"},r.createElement(Me,null))}const Be={colorModeToggle:"colorModeToggle_DEke"};function Ue(e){let{items:t}=e;return r.createElement(r.Fragment,null,t.map(((e,t)=>r.createElement(Te,(0,l.Z)({},e,{key:t})))))}function je(e){let{left:t,right:n}=e;return r.createElement("div",{className:"navbar__inner"},r.createElement("div",{className:"navbar__items"},t),r.createElement("div",{className:"navbar__items navbar__items--right"},n))}function $e(){const e=(0,A.e)(),t=(0,w.L)().navbar.items,[n,a]=function(e){function t(e){return"left"===(e.position??Re)}return[e.filter(t),e.filter((e=>!t(e)))]}(t),o=t.find((e=>"search"===e.type));return r.createElement(je,{left:r.createElement(r.Fragment,null,!e.disabled&&r.createElement(Fe,null),r.createElement(W,null),r.createElement(Ue,{items:n})),right:r.createElement(r.Fragment,null,r.createElement(Ue,{items:a}),r.createElement(V,{className:Be.colorModeToggle}),!o&&r.createElement(we,null,r.createElement(be,null)))})}function ze(){return r.createElement(De,null,r.createElement($e,null))}function Ze(e){let{item:t}=e;const{to:n,href:a,label:o,prependBaseUrlToHref:i,...s}=t,u=(0,X.Z)(n),c=(0,X.Z)(a,{forcePrependBaseUrl:!0});return r.createElement(K.Z,(0,l.Z)({className:"footer__link-item"},a?{href:i?c:a}:{to:u},s),o,a&&!(0,Q.Z)(a)&&r.createElement(ee.Z,null))}function He(e){let{item:t}=e;return t.html?r.createElement("li",{className:"footer__item",dangerouslySetInnerHTML:{__html:t.html}}):r.createElement("li",{key:t.href??t.to,className:"footer__item"},r.createElement(Ze,{item:t}))}function Ve(e){let{column:t}=e;return r.createElement("div",{className:"col footer__col"},r.createElement("div",{className:"footer__title"},t.title),r.createElement("ul",{className:"footer__items clean-list"},t.items.map(((e,t)=>r.createElement(He,{key:t,item:e})))))}function Ge(e){let{columns:t}=e;return r.createElement("div",{className:"row footer__links"},t.map(((e,t)=>r.createElement(Ve,{key:t,column:e}))))}function We(){return r.createElement("span",{className:"footer__link-separator"},"\xb7")}function qe(e){let{item:t}=e;return t.html?r.createElement("span",{className:"footer__link-item",dangerouslySetInnerHTML:{__html:t.html}}):r.createElement(Ze,{item:t})}function Ye(e){let{links:t}=e;return r.createElement("div",{className:"footer__links text--center"},r.createElement("div",{className:"footer__links"},t.map(((e,n)=>r.createElement(r.Fragment,{key:n},r.createElement(qe,{item:e}),t.length!==n+1&&r.createElement(We,null))))))}function Ke(e){let{links:t}=e;return function(e){return"title"in e[0]}(t)?r.createElement(Ge,{columns:t}):r.createElement(Ye,{links:t})}var Xe=n(50941);const Qe={footerLogoLink:"footerLogoLink_BH7S"};function Je(e){let{logo:t}=e;const{withBaseUrl:n}=(0,X.C)(),o={light:n(t.src),dark:n(t.srcDark??t.src)};return r.createElement(Xe.Z,{className:(0,a.Z)("footer__logo",t.className),alt:t.alt,sources:o,width:t.width,height:t.height,style:t.style})}function et(e){let{logo:t}=e;return t.href?r.createElement(K.Z,{href:t.href,className:Qe.footerLogoLink,target:t.target},r.createElement(Je,{logo:t})):r.createElement(Je,{logo:t})}function tt(e){let{copyright:t}=e;return r.createElement("div",{className:"footer__copyright",dangerouslySetInnerHTML:{__html:t}})}function nt(e){let{style:t,links:n,logo:o,copyright:i}=e;return r.createElement("footer",{className:(0,a.Z)("footer",{"footer--dark":"dark"===t})},r.createElement("div",{className:"container container-fluid"},n,(o||i)&&r.createElement("div",{className:"footer__bottom text--center"},o&&r.createElement("div",{className:"margin-bottom--sm"},o),i)))}function rt(){const{footer:e}=(0,w.L)();if(!e)return null;const{copyright:t,links:n,logo:a,style:o}=e;return r.createElement(nt,{style:o,links:n&&n.length>0&&r.createElement(Ke,{links:n}),logo:a&&r.createElement(et,{logo:a}),copyright:t&&r.createElement(tt,{copyright:t})})}const at=r.memo(rt),ot=(0,P.Qc)([B.S,E.pl,N.OC,Ce.L5,i.VC,function(e){let{children:t}=e;return r.createElement(O.n2,null,r.createElement(A.M,null,r.createElement(D,null,t)))}]);function it(e){let{children:t}=e;return r.createElement(ot,null,t)}function lt(e){let{error:t,tryAgain:n}=e;return r.createElement("main",{className:"container margin-vert--xl"},r.createElement("div",{className:"row"},r.createElement("div",{className:"col col--6 col--offset-3"},r.createElement("h1",{className:"hero__title"},r.createElement(u.Z,{id:"theme.ErrorPageContent.title",description:"The title of the fallback page when the page crashed"},"This page crashed.")),r.createElement("p",null,t.message),r.createElement("div",null,r.createElement("button",{type:"button",onClick:n},r.createElement(u.Z,{id:"theme.ErrorPageContent.tryAgain",description:"The label of the button to try again when the page crashed"},"Try again"))))))}const st={mainWrapper:"mainWrapper_z2l0"};function ut(e){const{children:t,noFooter:n,wrapperClassName:l,title:s,description:u}=e;return(0,v.t)(),r.createElement(it,null,r.createElement(i.d,{title:s,description:u}),r.createElement(y,null),r.createElement(L,null),r.createElement(ze,null),r.createElement("div",{id:d,className:(0,a.Z)(g.k.wrapper.main,st.mainWrapper,l)},r.createElement(o.Z,{fallback:e=>r.createElement(lt,e)},t)),!n&&r.createElement(at,null))}},21327:(e,t,n)=>{"use strict";n.d(t,{Z:()=>d});var r=n(87462),a=n(67294),o=n(39960),i=n(44996),l=n(52263),s=n(86668),u=n(50941);function c(e){let{logo:t,alt:n,imageClassName:r}=e;const o={light:(0,i.Z)(t.src),dark:(0,i.Z)(t.srcDark||t.src)},l=a.createElement(u.Z,{className:t.className,sources:o,height:t.height,width:t.width,alt:n,style:t.style});return r?a.createElement("div",{className:r},l):l}function d(e){const{siteConfig:{title:t}}=(0,l.Z)(),{navbar:{title:n,logo:u}}=(0,s.L)(),{imageClassName:d,titleClassName:f,...p}=e,m=(0,i.Z)(u?.href||"/"),h=n?"":t,g=u?.alt??h;return a.createElement(o.Z,(0,r.Z)({to:m},p,u?.target&&{target:u.target}),u&&a.createElement(c,{logo:u,alt:g,imageClassName:d}),null!=n&&a.createElement("b",{className:f},n))}},90197:(e,t,n)=>{"use strict";n.d(t,{Z:()=>o});var r=n(67294),a=n(35742);function o(e){let{locale:t,version:n,tag:o}=e;const i=t;return r.createElement(a.Z,null,t&&r.createElement("meta",{name:"docusaurus_locale",content:t}),n&&r.createElement("meta",{name:"docusaurus_version",content:n}),o&&r.createElement("meta",{name:"docusaurus_tag",content:o}),i&&r.createElement("meta",{name:"docsearch:language",content:i}),n&&r.createElement("meta",{name:"docsearch:version",content:n}),o&&r.createElement("meta",{name:"docsearch:docusaurus_tag",content:o}))}},50941:(e,t,n)=>{"use strict";n.d(t,{Z:()=>u});var r=n(87462),a=n(67294),o=n(86010),i=n(72389),l=n(92949);const s={themedImage:"themedImage_ToTc","themedImage--light":"themedImage--light_HNdA","themedImage--dark":"themedImage--dark_i4oU"};function u(e){const t=(0,i.Z)(),{colorMode:n}=(0,l.I)(),{sources:u,className:c,alt:d,...f}=e,p=t?"dark"===n?["dark"]:["light"]:["light","dark"];return a.createElement(a.Fragment,null,p.map((e=>a.createElement("img",(0,r.Z)({key:e,src:u[e],alt:d,className:(0,o.Z)(s.themedImage,s[`themedImage--${e}`],c)},f)))))}},86043:(e,t,n)=>{"use strict";n.d(t,{u:()=>l,z:()=>h});var r=n(87462),a=n(67294),o=n(10412);const i="ease-in-out";function l(e){let{initialState:t}=e;const[n,r]=(0,a.useState)(t??!1),o=(0,a.useCallback)((()=>{r((e=>!e))}),[]);return{collapsed:n,setCollapsed:r,toggleCollapsed:o}}const s={display:"none",overflow:"hidden",height:"0px"},u={display:"block",overflow:"visible",height:"auto"};function c(e,t){const n=t?s:u;e.style.display=n.display,e.style.overflow=n.overflow,e.style.height=n.height}function d(e){let{collapsibleRef:t,collapsed:n,animation:r}=e;const o=(0,a.useRef)(!1);(0,a.useEffect)((()=>{const e=t.current;function a(){const t=e.scrollHeight,n=r?.duration??function(e){const t=e/36;return Math.round(10*(4+15*t**.25+t/5))}(t);return{transition:`height ${n}ms ${r?.easing??i}`,height:`${t}px`}}function l(){const t=a();e.style.transition=t.transition,e.style.height=t.height}if(!o.current)return c(e,n),void(o.current=!0);return e.style.willChange="height",function(){const t=requestAnimationFrame((()=>{n?(l(),requestAnimationFrame((()=>{e.style.height=s.height,e.style.overflow=s.overflow}))):(e.style.display="block",requestAnimationFrame((()=>{l()})))}));return()=>cancelAnimationFrame(t)}()}),[t,n,r])}function f(e){if(!o.Z.canUseDOM)return e?s:u}function p(e){let{as:t="div",collapsed:n,children:r,animation:o,onCollapseTransitionEnd:i,className:l,disableSSRStyle:s}=e;const u=(0,a.useRef)(null);return d({collapsibleRef:u,collapsed:n,animation:o}),a.createElement(t,{ref:u,style:s?void 0:f(n),onTransitionEnd:e=>{"height"===e.propertyName&&(c(u.current,n),i?.(n))},className:l},r)}function m(e){let{collapsed:t,...n}=e;const[o,i]=(0,a.useState)(!t),[l,s]=(0,a.useState)(t);return(0,a.useLayoutEffect)((()=>{t||i(!0)}),[t]),(0,a.useLayoutEffect)((()=>{o&&s(t)}),[o,t]),o?a.createElement(p,(0,r.Z)({},n,{collapsed:l})):null}function h(e){let{lazy:t,...n}=e;const r=t?m:p;return a.createElement(r,n)}},59689:(e,t,n)=>{"use strict";n.d(t,{nT:()=>m,pl:()=>p});var r=n(67294),a=n(72389),o=n(50012),i=n(902),l=n(86668);const s=(0,o.WA)("docusaurus.announcement.dismiss"),u=(0,o.WA)("docusaurus.announcement.id"),c=()=>"true"===s.get(),d=e=>s.set(String(e)),f=r.createContext(null);function p(e){let{children:t}=e;const n=function(){const{announcementBar:e}=(0,l.L)(),t=(0,a.Z)(),[n,o]=(0,r.useState)((()=>!!t&&c()));(0,r.useEffect)((()=>{o(c())}),[]);const i=(0,r.useCallback)((()=>{d(!0),o(!0)}),[]);return(0,r.useEffect)((()=>{if(!e)return;const{id:t}=e;let n=u.get();"annoucement-bar"===n&&(n="announcement-bar");const r=t!==n;u.set(t),r&&d(!1),!r&&c()||o(!1)}),[e]),(0,r.useMemo)((()=>({isActive:!!e&&!n,close:i})),[e,n,i])}();return r.createElement(f.Provider,{value:n},t)}function m(){const e=(0,r.useContext)(f);if(!e)throw new i.i6("AnnouncementBarProvider");return e}},92949:(e,t,n)=>{"use strict";n.d(t,{I:()=>g,S:()=>h});var r=n(67294),a=n(10412),o=n(902),i=n(50012),l=n(86668);const s=r.createContext(void 0),u="theme",c=(0,i.WA)(u),d={light:"light",dark:"dark"},f=e=>e===d.dark?d.dark:d.light,p=e=>a.Z.canUseDOM?f(document.documentElement.getAttribute("data-theme")):f(e),m=e=>{c.set(f(e))};function h(e){let{children:t}=e;const n=function(){const{colorMode:{defaultMode:e,disableSwitch:t,respectPrefersColorScheme:n}}=(0,l.L)(),[a,o]=(0,r.useState)(p(e));(0,r.useEffect)((()=>{t&&c.del()}),[t]);const i=(0,r.useCallback)((function(t,r){void 0===r&&(r={});const{persist:a=!0}=r;t?(o(t),a&&m(t)):(o(n?window.matchMedia("(prefers-color-scheme: dark)").matches?d.dark:d.light:e),c.del())}),[n,e]);(0,r.useEffect)((()=>{document.documentElement.setAttribute("data-theme",f(a))}),[a]),(0,r.useEffect)((()=>{if(t)return;const e=e=>{if(e.key!==u)return;const t=c.get();null!==t&&i(f(t))};return window.addEventListener("storage",e),()=>window.removeEventListener("storage",e)}),[t,i]);const s=(0,r.useRef)(!1);return(0,r.useEffect)((()=>{if(t&&!n)return;const e=window.matchMedia("(prefers-color-scheme: dark)"),r=()=>{window.matchMedia("print").matches||s.current?s.current=window.matchMedia("print").matches:i(null)};return e.addListener(r),()=>e.removeListener(r)}),[i,t,n]),(0,r.useMemo)((()=>({colorMode:a,setColorMode:i,get isDarkTheme(){return a===d.dark},setLightTheme(){i(d.light)},setDarkTheme(){i(d.dark)}})),[a,i])}();return r.createElement(s.Provider,{value:n},t)}function g(){const e=(0,r.useContext)(s);if(null==e)throw new o.i6("ColorModeProvider","Please see https://docusaurus.io/docs/api/themes/configuration#use-color-mode.");return e}},60373:(e,t,n)=>{"use strict";n.d(t,{J:()=>b,L5:()=>g});var r=n(67294),a=n(94104),o=n(29935),i=n(86668),l=n(52802),s=n(902),u=n(50012);const c=e=>`docs-preferred-version-${e}`,d={save:(e,t,n)=>{(0,u.WA)(c(e),{persistence:t}).set(n)},read:(e,t)=>(0,u.WA)(c(e),{persistence:t}).get(),clear:(e,t)=>{(0,u.WA)(c(e),{persistence:t}).del()}},f=e=>Object.fromEntries(e.map((e=>[e,{preferredVersionName:null}])));const p=r.createContext(null);function m(){const e=(0,a._r)(),t=(0,i.L)().docs.versionPersistence,n=(0,r.useMemo)((()=>Object.keys(e)),[e]),[o,l]=(0,r.useState)((()=>f(n)));(0,r.useEffect)((()=>{l(function(e){let{pluginIds:t,versionPersistence:n,allDocsData:r}=e;function a(e){const t=d.read(e,n);return r[e].versions.some((e=>e.name===t))?{preferredVersionName:t}:(d.clear(e,n),{preferredVersionName:null})}return Object.fromEntries(t.map((e=>[e,a(e)])))}({allDocsData:e,versionPersistence:t,pluginIds:n}))}),[e,t,n]);return[o,(0,r.useMemo)((()=>({savePreferredVersion:function(e,n){d.save(e,t,n),l((t=>({...t,[e]:{preferredVersionName:n}})))}})),[t])]}function h(e){let{children:t}=e;const n=m();return r.createElement(p.Provider,{value:n},t)}function g(e){let{children:t}=e;return l.cE?r.createElement(h,null,t):r.createElement(r.Fragment,null,t)}function v(){const e=(0,r.useContext)(p);if(!e)throw new s.i6("DocsPreferredVersionContextProvider");return e}function b(e){void 0===e&&(e=o.m);const t=(0,a.zh)(e),[n,i]=v(),{preferredVersionName:l}=n[e];return{preferredVersion:t.versions.find((e=>e.name===l))??null,savePreferredVersionName:(0,r.useCallback)((t=>{i.savePreferredVersion(e,t)}),[i,e])}}},1116:(e,t,n)=>{"use strict";n.d(t,{V:()=>s,b:()=>l});var r=n(67294),a=n(902);const o=Symbol("EmptyContext"),i=r.createContext(o);function l(e){let{children:t,name:n,items:a}=e;const o=(0,r.useMemo)((()=>n&&a?{name:n,items:a}:null),[n,a]);return r.createElement(i.Provider,{value:o},t)}function s(){const e=(0,r.useContext)(i);if(e===o)throw new a.i6("DocsSidebarProvider");return e}},72961:(e,t,n)=>{"use strict";n.d(t,{M:()=>f,e:()=>p});var r=n(67294),a=n(13102),o=n(87524),i=n(16550),l=(n(61688),n(902));function s(e){!function(e){const t=(0,i.k6)(),n=(0,l.zX)(e);(0,r.useEffect)((()=>t.block(((e,t)=>n(e,t)))),[t,n])}(((t,n)=>{if("POP"===n)return e(t,n)}))}var u=n(86668);const c=r.createContext(void 0);function d(){const e=function(){const e=(0,a.HY)(),{items:t}=(0,u.L)().navbar;return 0===t.length&&!e.component}(),t=(0,o.i)(),n=!e&&"mobile"===t,[i,l]=(0,r.useState)(!1);s((()=>{if(i)return l(!1),!1}));const c=(0,r.useCallback)((()=>{l((e=>!e))}),[]);return(0,r.useEffect)((()=>{"desktop"===t&&l(!1)}),[t]),(0,r.useMemo)((()=>({disabled:e,shouldRender:n,toggle:c,shown:i})),[e,n,c,i])}function f(e){let{children:t}=e;const n=d();return r.createElement(c.Provider,{value:n},t)}function p(){const e=r.useContext(c);if(void 0===e)throw new l.i6("NavbarMobileSidebarProvider");return e}},13102:(e,t,n)=>{"use strict";n.d(t,{HY:()=>l,Zo:()=>s,n2:()=>i});var r=n(67294),a=n(902);const o=r.createContext(null);function i(e){let{children:t}=e;const n=(0,r.useState)({component:null,props:null});return r.createElement(o.Provider,{value:n},t)}function l(){const e=(0,r.useContext)(o);if(!e)throw new a.i6("NavbarSecondaryMenuContentProvider");return e[0]}function s(e){let{component:t,props:n}=e;const i=(0,r.useContext)(o);if(!i)throw new a.i6("NavbarSecondaryMenuContentProvider");const[,l]=i,s=(0,a.Ql)(n);return(0,r.useEffect)((()=>{l({component:t,props:s})}),[l,t,s]),(0,r.useEffect)((()=>()=>l({component:null,props:null})),[l]),null}},19727:(e,t,n)=>{"use strict";n.d(t,{h:()=>a,t:()=>o});var r=n(67294);const a="navigation-with-keyboard";function o(){(0,r.useEffect)((()=>{function e(e){"keydown"===e.type&&"Tab"===e.key&&document.body.classList.add(a),"mousedown"===e.type&&document.body.classList.remove(a)}return document.addEventListener("keydown",e),document.addEventListener("mousedown",e),()=>{document.body.classList.remove(a),document.removeEventListener("keydown",e),document.removeEventListener("mousedown",e)}}),[])}},87524:(e,t,n)=>{"use strict";n.d(t,{i:()=>u});var r=n(67294),a=n(10412);const o={desktop:"desktop",mobile:"mobile",ssr:"ssr"},i=996;function l(){return a.Z.canUseDOM?window.innerWidth>i?o.desktop:o.mobile:o.ssr}const s=!1;function u(){const[e,t]=(0,r.useState)((()=>s?"ssr":l()));return(0,r.useEffect)((()=>{function e(){t(l())}const n=s?window.setTimeout(e,1e3):void 0;return window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e),clearTimeout(n)}}),[]),e}},35281:(e,t,n)=>{"use strict";n.d(t,{k:()=>r});const r={page:{blogListPage:"blog-list-page",blogPostPage:"blog-post-page",blogTagsListPage:"blog-tags-list-page",blogTagPostListPage:"blog-tags-post-list-page",docsDocPage:"docs-doc-page",docsTagsListPage:"docs-tags-list-page",docsTagDocListPage:"docs-tags-doc-list-page",mdxPage:"mdx-page"},wrapper:{main:"main-wrapper",blogPages:"blog-wrapper",docsPages:"docs-wrapper",mdxPages:"mdx-wrapper"},common:{editThisPage:"theme-edit-this-page",lastUpdated:"theme-last-updated",backToTopButton:"theme-back-to-top-button",codeBlock:"theme-code-block",admonition:"theme-admonition",admonitionType:e=>`theme-admonition-${e}`},layout:{},docs:{docVersionBanner:"theme-doc-version-banner",docVersionBadge:"theme-doc-version-badge",docBreadcrumbs:"theme-doc-breadcrumbs",docMarkdown:"theme-doc-markdown",docTocMobile:"theme-doc-toc-mobile",docTocDesktop:"theme-doc-toc-desktop",docFooter:"theme-doc-footer",docFooterTagsRow:"theme-doc-footer-tags-row",docFooterEditMetaRow:"theme-doc-footer-edit-meta-row",docSidebarContainer:"theme-doc-sidebar-container",docSidebarMenu:"theme-doc-sidebar-menu",docSidebarItemCategory:"theme-doc-sidebar-item-category",docSidebarItemLink:"theme-doc-sidebar-item-link",docSidebarItemCategoryLevel:e=>`theme-doc-sidebar-item-category-level-${e}`,docSidebarItemLinkLevel:e=>`theme-doc-sidebar-item-link-level-${e}`},blog:{}}},52802:(e,t,n)=>{"use strict";n.d(t,{Wl:()=>f,_F:()=>h,cE:()=>d,hI:()=>E,lO:()=>b,vY:()=>w,oz:()=>y,s1:()=>v});var r=n(67294),a=n(16550),o=n(18790),i=n(94104),l=n(60373),s=n(1116);function u(e){return Array.from(new Set(e))}var c=n(48596);const d=!!i._r;function f(e){if(e.href)return e.href;for(const t of e.items){if("link"===t.type)return t.href;if("category"===t.type){const e=f(t);if(e)return e}}}const p=(e,t)=>void 0!==e&&(0,c.Mg)(e,t),m=(e,t)=>e.some((e=>h(e,t)));function h(e,t){return"link"===e.type?p(e.href,t):"category"===e.type&&(p(e.href,t)||m(e.items,t))}function g(e){let{sidebarItems:t,pathname:n,onlyCategories:r=!1}=e;const a=[];return function e(t){for(const o of t)if("category"===o.type&&((0,c.Mg)(o.href,n)||e(o.items))||"link"===o.type&&(0,c.Mg)(o.href,n)){return r&&"category"!==o.type||a.unshift(o),!0}return!1}(t),a}function v(){const e=(0,s.V)(),{pathname:t}=(0,a.TH)(),n=(0,i.gA)()?.pluginData.breadcrumbs;return!1!==n&&e?g({sidebarItems:e.items,pathname:t}):null}function b(e){const{activeVersion:t}=(0,i.Iw)(e),{preferredVersion:n}=(0,l.J)(e),a=(0,i.yW)(e);return(0,r.useMemo)((()=>u([t,n,a].filter(Boolean))),[t,n,a])}function y(e,t){const n=b(t);return(0,r.useMemo)((()=>{const t=n.flatMap((e=>e.sidebars?Object.entries(e.sidebars):[])),r=t.find((t=>t[0]===e));if(!r)throw new Error(`Can't find any sidebar with id "${e}" in version${n.length>1?"s":""} ${n.map((e=>e.name)).join(", ")}".\n Available sidebar ids are:\n - ${Object.keys(t).join("\n- ")}`);return r[1]}),[e,n])}function w(e,t){const n=b(t);return(0,r.useMemo)((()=>{const t=n.flatMap((e=>e.docs)),r=t.find((t=>t.id===e));if(!r){if(n.flatMap((e=>e.draftIds)).includes(e))return null;throw new Error(`DocNavbarItem: couldn't find any doc with id "${e}" in version${n.length>1?"s":""} ${n.map((e=>e.name)).join(", ")}".\nAvailable doc ids are:\n- ${u(t.map((e=>e.id))).join("\n- ")}`)}return r}),[e,n])}function E(e){let{route:t,versionMetadata:n}=e;const r=(0,a.TH)(),i=t.routes,l=i.find((e=>(0,a.LX)(r.pathname,e)));if(!l)return null;const s=l.sidebar,u=s?n.docsSidebars[s]:void 0;return{docElement:(0,o.H)(i),sidebarName:s,sidebarItems:u}}},1944:(e,t,n)=>{"use strict";n.d(t,{FG:()=>f,d:()=>c,VC:()=>p});var r=n(67294),a=n(86010),o=n(35742),i=n(30226);function l(){const e=r.useContext(i._);if(!e)throw new Error("Unexpected: no Docusaurus route context found");return e}var s=n(44996),u=n(52263);function c(e){let{title:t,description:n,keywords:a,image:i,children:l}=e;const c=function(e){const{siteConfig:t}=(0,u.Z)(),{title:n,titleDelimiter:r}=t;return e?.trim().length?`${e.trim()} ${r} ${n}`:n}(t),{withBaseUrl:d}=(0,s.C)(),f=i?d(i,{absolute:!0}):void 0;return r.createElement(o.Z,null,t&&r.createElement("title",null,c),t&&r.createElement("meta",{property:"og:title",content:c}),n&&r.createElement("meta",{name:"description",content:n}),n&&r.createElement("meta",{property:"og:description",content:n}),a&&r.createElement("meta",{name:"keywords",content:Array.isArray(a)?a.join(","):a}),f&&r.createElement("meta",{property:"og:image",content:f}),f&&r.createElement("meta",{name:"twitter:image",content:f}),l)}const d=r.createContext(void 0);function f(e){let{className:t,children:n}=e;const i=r.useContext(d),l=(0,a.Z)(i,t);return r.createElement(d.Provider,{value:l},r.createElement(o.Z,null,r.createElement("html",{className:l})),n)}function p(e){let{children:t}=e;const n=l(),o=`plugin-${n.plugin.name.replace(/docusaurus-(?:plugin|theme)-(?:content-)?/gi,"")}`;const i=`plugin-id-${n.plugin.id}`;return r.createElement(f,{className:(0,a.Z)(o,i)},t)}},902:(e,t,n)=>{"use strict";n.d(t,{D9:()=>i,Qc:()=>u,Ql:()=>s,i6:()=>l,zX:()=>o});var r=n(67294);const a=n(10412).Z.canUseDOM?r.useLayoutEffect:r.useEffect;function o(e){const t=(0,r.useRef)(e);return a((()=>{t.current=e}),[e]),(0,r.useCallback)((function(){return t.current(...arguments)}),[])}function i(e){const t=(0,r.useRef)();return a((()=>{t.current=e})),t.current}class l extends Error{constructor(e,t){super(),this.name="ReactContextError",this.message=`Hook ${this.stack?.split("\n")[1]?.match(/at (?:\w+\.)?(?\w+)/)?.groups.name??""} is called outside the <${e}>. ${t??""}`}}function s(e){const t=Object.entries(e);return t.sort(((e,t)=>e[0].localeCompare(t[0]))),(0,r.useMemo)((()=>e),t.flat())}function u(e){return t=>{let{children:n}=t;return r.createElement(r.Fragment,null,e.reduceRight(((e,t)=>r.createElement(t,null,e)),n))}}},48596:(e,t,n)=>{"use strict";n.d(t,{Mg:()=>i,Ns:()=>l});var r=n(67294),a=n(723),o=n(52263);function i(e,t){const n=e=>(!e||e.endsWith("/")?e:`${e}/`)?.toLowerCase();return n(e)===n(t)}function l(){const{baseUrl:e}=(0,o.Z)().siteConfig;return(0,r.useMemo)((()=>function(e){let{baseUrl:t,routes:n}=e;function r(e){return e.path===t&&!0===e.exact}function a(e){return e.path===t&&!e.exact}return function e(t){if(0===t.length)return;return t.find(r)||e(t.filter(a).flatMap((e=>e.routes??[])))}(n)}({routes:a.Z,baseUrl:e})),[e])}},12466:(e,t,n)=>{"use strict";n.d(t,{Ct:()=>f,OC:()=>s,RF:()=>d});var r=n(67294),a=n(10412),o=n(72389),i=n(902);const l=r.createContext(void 0);function s(e){let{children:t}=e;const n=function(){const e=(0,r.useRef)(!0);return(0,r.useMemo)((()=>({scrollEventsEnabledRef:e,enableScrollEvents:()=>{e.current=!0},disableScrollEvents:()=>{e.current=!1}})),[])}();return r.createElement(l.Provider,{value:n},t)}function u(){const e=(0,r.useContext)(l);if(null==e)throw new i.i6("ScrollControllerProvider");return e}const c=()=>a.Z.canUseDOM?{scrollX:window.pageXOffset,scrollY:window.pageYOffset}:null;function d(e,t){void 0===t&&(t=[]);const{scrollEventsEnabledRef:n}=u(),a=(0,r.useRef)(c()),o=(0,i.zX)(e);(0,r.useEffect)((()=>{const e=()=>{if(!n.current)return;const e=c();o(e,a.current),a.current=e},t={passive:!0};return e(),window.addEventListener("scroll",e,t),()=>window.removeEventListener("scroll",e,t)}),[o,n,...t])}function f(){const e=(0,r.useRef)(null),t=(0,o.Z)()&&"smooth"===getComputedStyle(document.documentElement).scrollBehavior;return{startScroll:n=>{e.current=t?function(e){return window.scrollTo({top:e,behavior:"smooth"}),()=>{}}(n):function(e){let t=null;const n=document.documentElement.scrollTop>e;return function r(){const a=document.documentElement.scrollTop;(n&&a>e||!n&&at&&cancelAnimationFrame(t)}(n)},cancelScroll:()=>e.current?.()}}},43320:(e,t,n)=>{"use strict";n.d(t,{HX:()=>r,os:()=>a});n(52263);const r="default";function a(e,t){return`docs-${e}-${t}`}},50012:(e,t,n)=>{"use strict";n.d(t,{WA:()=>s});n(67294),n(61688);const r="localStorage";function a(e){let{key:t,oldValue:n,newValue:r,storage:a}=e;if(n===r)return;const o=document.createEvent("StorageEvent");o.initStorageEvent("storage",!1,!1,t,n,r,window.location.href,a),window.dispatchEvent(o)}function o(e){if(void 0===e&&(e=r),"undefined"==typeof window)throw new Error("Browser storage is not available on Node.js/Docusaurus SSR process.");if("none"===e)return null;try{return window[e]}catch(n){return t=n,i||(console.warn("Docusaurus browser storage is not available.\nPossible reasons: running Docusaurus in an iframe, in an incognito browser session, or using too strict browser privacy settings.",t),i=!0),null}var t}let i=!1;const l={get:()=>null,set:()=>{},del:()=>{},listen:()=>()=>{}};function s(e,t){if("undefined"==typeof window)return function(e){function t(){throw new Error(`Illegal storage API usage for storage key "${e}".\nDocusaurus storage APIs are not supposed to be called on the server-rendering process.\nPlease only call storage APIs in effects and event handlers.`)}return{get:t,set:t,del:t,listen:t}}(e);const n=o(t?.persistence);return null===n?l:{get:()=>{try{return n.getItem(e)}catch(t){return console.error(`Docusaurus storage error, can't get key=${e}`,t),null}},set:t=>{try{const r=n.getItem(e);n.setItem(e,t),a({key:e,oldValue:r,newValue:t,storage:n})}catch(r){console.error(`Docusaurus storage error, can't set ${e}=${t}`,r)}},del:()=>{try{const t=n.getItem(e);n.removeItem(e),a({key:e,oldValue:t,newValue:null,storage:n})}catch(t){console.error(`Docusaurus storage error, can't delete key=${e}`,t)}},listen:t=>{try{const r=r=>{r.storageArea===n&&r.key===e&&t(r)};return window.addEventListener("storage",r),()=>window.removeEventListener("storage",r)}catch(r){return console.error(`Docusaurus storage error, can't listen for changes of key=${e}`,r),()=>{}}}}}},94711:(e,t,n)=>{"use strict";n.d(t,{l:()=>o});var r=n(52263),a=n(16550);function o(){const{siteConfig:{baseUrl:e,url:t},i18n:{defaultLocale:n,currentLocale:o}}=(0,r.Z)(),{pathname:i}=(0,a.TH)(),l=o===n?e:e.replace(`/${o}/`,"/"),s=i.replace(e,"");return{createUrl:function(e){let{locale:r,fullyQualified:a}=e;return`${a?t:""}${function(e){return e===n?`${l}`:`${l}${e}/`}(r)}${s}`}}}},85936:(e,t,n)=>{"use strict";n.d(t,{S:()=>i});var r=n(67294),a=n(16550),o=n(902);function i(e){const t=(0,a.TH)(),n=(0,o.D9)(t),i=(0,o.zX)(e);(0,r.useEffect)((()=>{n&&t!==n&&i({location:t,previousLocation:n})}),[i,t,n])}},86668:(e,t,n)=>{"use strict";n.d(t,{L:()=>a});var r=n(52263);function a(){return(0,r.Z)().siteConfig.themeConfig}},8802:(e,t)=>{"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default=function(e,t){const{trailingSlash:n,baseUrl:r}=t;if(e.startsWith("#"))return e;if(void 0===n)return e;const[a]=e.split(/[#?]/),o="/"===a||a===r?a:(i=a,n?function(e){return e.endsWith("/")?e:`${e}/`}(i):function(e){return e.endsWith("/")?e.slice(0,-1):e}(i));var i;return e.replace(a,o)}},18780:function(e,t,n){"use strict";var r=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.applyTrailingSlash=t.blogPostContainerID=void 0,t.blogPostContainerID="post-content";var a=n(8802);Object.defineProperty(t,"applyTrailingSlash",{enumerable:!0,get:function(){return r(a).default}})},94184:(e,t)=>{var n;!function(){"use strict";var r={}.hasOwnProperty;function a(){for(var e=[],t=0;t{"use strict";function r(e){var t,n,a="";if("string"==typeof e||"number"==typeof e)a+=e;else if("object"==typeof e)if(Array.isArray(e))for(t=0;ta});const a=function(){for(var e,t,n=0,a="";n{"use strict";n.d(t,{lX:()=>S,q_:()=>A,ob:()=>h,PP:()=>P,Ep:()=>m,Hp:()=>g});var r=n(87462);function a(e){return"/"===e.charAt(0)}function o(e,t){for(var n=t,r=n+1,a=e.length;r=0;f--){var p=i[f];"."===p?o(i,f):".."===p?(o(i,f),d++):d&&(o(i,f),d--)}if(!u)for(;d--;d)i.unshift("..");!u||""===i[0]||i[0]&&a(i[0])||i.unshift("");var m=i.join("/");return n&&"/"!==m.substr(-1)&&(m+="/"),m};function l(e){return e.valueOf?e.valueOf():Object.prototype.valueOf.call(e)}const s=function e(t,n){if(t===n)return!0;if(null==t||null==n)return!1;if(Array.isArray(t))return Array.isArray(n)&&t.length===n.length&&t.every((function(t,r){return e(t,n[r])}));if("object"==typeof t||"object"==typeof n){var r=l(t),a=l(n);return r!==t||a!==n?e(r,a):Object.keys(Object.assign({},t,n)).every((function(r){return e(t[r],n[r])}))}return!1};var u=n(38776);function c(e){return"/"===e.charAt(0)?e:"/"+e}function d(e){return"/"===e.charAt(0)?e.substr(1):e}function f(e,t){return function(e,t){return 0===e.toLowerCase().indexOf(t.toLowerCase())&&-1!=="/?#".indexOf(e.charAt(t.length))}(e,t)?e.substr(t.length):e}function p(e){return"/"===e.charAt(e.length-1)?e.slice(0,-1):e}function m(e){var t=e.pathname,n=e.search,r=e.hash,a=t||"/";return n&&"?"!==n&&(a+="?"===n.charAt(0)?n:"?"+n),r&&"#"!==r&&(a+="#"===r.charAt(0)?r:"#"+r),a}function h(e,t,n,a){var o;"string"==typeof e?(o=function(e){var t=e||"/",n="",r="",a=t.indexOf("#");-1!==a&&(r=t.substr(a),t=t.substr(0,a));var o=t.indexOf("?");return-1!==o&&(n=t.substr(o),t=t.substr(0,o)),{pathname:t,search:"?"===n?"":n,hash:"#"===r?"":r}}(e),o.state=t):(void 0===(o=(0,r.Z)({},e)).pathname&&(o.pathname=""),o.search?"?"!==o.search.charAt(0)&&(o.search="?"+o.search):o.search="",o.hash?"#"!==o.hash.charAt(0)&&(o.hash="#"+o.hash):o.hash="",void 0!==t&&void 0===o.state&&(o.state=t));try{o.pathname=decodeURI(o.pathname)}catch(l){throw l instanceof URIError?new URIError('Pathname "'+o.pathname+'" could not be decoded. This is likely caused by an invalid percent-encoding.'):l}return n&&(o.key=n),a?o.pathname?"/"!==o.pathname.charAt(0)&&(o.pathname=i(o.pathname,a.pathname)):o.pathname=a.pathname:o.pathname||(o.pathname="/"),o}function g(e,t){return e.pathname===t.pathname&&e.search===t.search&&e.hash===t.hash&&e.key===t.key&&s(e.state,t.state)}function v(){var e=null;var t=[];return{setPrompt:function(t){return e=t,function(){e===t&&(e=null)}},confirmTransitionTo:function(t,n,r,a){if(null!=e){var o="function"==typeof e?e(t,n):e;"string"==typeof o?"function"==typeof r?r(o,a):a(!0):a(!1!==o)}else a(!0)},appendListener:function(e){var n=!0;function r(){n&&e.apply(void 0,arguments)}return t.push(r),function(){n=!1,t=t.filter((function(e){return e!==r}))}},notifyListeners:function(){for(var e=arguments.length,n=new Array(e),r=0;rt?n.splice(t,n.length-t,a):n.push(a),d({action:r,location:a,index:t,entries:n})}}))},replace:function(e,t){var r="REPLACE",a=h(e,t,f(),w.location);c.confirmTransitionTo(a,r,n,(function(e){e&&(w.entries[w.index]=a,d({action:r,location:a}))}))},go:y,goBack:function(){y(-1)},goForward:function(){y(1)},canGo:function(e){var t=w.index+e;return t>=0&&t{"use strict";var r=n(59864),a={childContextTypes:!0,contextType:!0,contextTypes:!0,defaultProps:!0,displayName:!0,getDefaultProps:!0,getDerivedStateFromError:!0,getDerivedStateFromProps:!0,mixins:!0,propTypes:!0,type:!0},o={name:!0,length:!0,prototype:!0,caller:!0,callee:!0,arguments:!0,arity:!0},i={$$typeof:!0,compare:!0,defaultProps:!0,displayName:!0,propTypes:!0,type:!0},l={};function s(e){return r.isMemo(e)?i:l[e.$$typeof]||a}l[r.ForwardRef]={$$typeof:!0,render:!0,defaultProps:!0,displayName:!0,propTypes:!0},l[r.Memo]=i;var u=Object.defineProperty,c=Object.getOwnPropertyNames,d=Object.getOwnPropertySymbols,f=Object.getOwnPropertyDescriptor,p=Object.getPrototypeOf,m=Object.prototype;e.exports=function e(t,n,r){if("string"!=typeof n){if(m){var a=p(n);a&&a!==m&&e(t,a,r)}var i=c(n);d&&(i=i.concat(d(n)));for(var l=s(t),h=s(n),g=0;g{"use strict";e.exports=function(e,t,n,r,a,o,i,l){if(!e){var s;if(void 0===t)s=new Error("Minified exception occurred; use the non-minified dev environment for the full error message and additional helpful warnings.");else{var u=[n,r,a,o,i,l],c=0;(s=new Error(t.replace(/%s/g,(function(){return u[c++]})))).name="Invariant Violation"}throw s.framesToPop=1,s}}},5826:e=>{e.exports=Array.isArray||function(e){return"[object Array]"==Object.prototype.toString.call(e)}},32497:(e,t,n)=>{"use strict";n.r(t)},52295:(e,t,n)=>{"use strict";n.r(t)},34197:(e,t,n)=>{"use strict";n.r(t)},74865:function(e,t,n){var r,a;r=function(){var e,t,n={version:"0.2.0"},r=n.settings={minimum:.08,easing:"ease",positionUsing:"",speed:200,trickle:!0,trickleRate:.02,trickleSpeed:800,showSpinner:!0,barSelector:'[role="bar"]',spinnerSelector:'[role="spinner"]',parent:"body",template:'
'};function a(e,t,n){return en?n:e}function o(e){return 100*(-1+e)}function i(e,t,n){var a;return(a="translate3d"===r.positionUsing?{transform:"translate3d("+o(e)+"%,0,0)"}:"translate"===r.positionUsing?{transform:"translate("+o(e)+"%,0)"}:{"margin-left":o(e)+"%"}).transition="all "+t+"ms "+n,a}n.configure=function(e){var t,n;for(t in e)void 0!==(n=e[t])&&e.hasOwnProperty(t)&&(r[t]=n);return this},n.status=null,n.set=function(e){var t=n.isStarted();e=a(e,r.minimum,1),n.status=1===e?null:e;var o=n.render(!t),u=o.querySelector(r.barSelector),c=r.speed,d=r.easing;return o.offsetWidth,l((function(t){""===r.positionUsing&&(r.positionUsing=n.getPositioningCSS()),s(u,i(e,c,d)),1===e?(s(o,{transition:"none",opacity:1}),o.offsetWidth,setTimeout((function(){s(o,{transition:"all "+c+"ms linear",opacity:0}),setTimeout((function(){n.remove(),t()}),c)}),c)):setTimeout(t,c)})),this},n.isStarted=function(){return"number"==typeof n.status},n.start=function(){n.status||n.set(0);var e=function(){setTimeout((function(){n.status&&(n.trickle(),e())}),r.trickleSpeed)};return r.trickle&&e(),this},n.done=function(e){return e||n.status?n.inc(.3+.5*Math.random()).set(1):this},n.inc=function(e){var t=n.status;return t?("number"!=typeof e&&(e=(1-t)*a(Math.random()*t,.1,.95)),t=a(t+e,0,.994),n.set(t)):n.start()},n.trickle=function(){return n.inc(Math.random()*r.trickleRate)},e=0,t=0,n.promise=function(r){return r&&"resolved"!==r.state()?(0===t&&n.start(),e++,t++,r.always((function(){0==--t?(e=0,n.done()):n.set((e-t)/e)})),this):this},n.render=function(e){if(n.isRendered())return document.getElementById("nprogress");c(document.documentElement,"nprogress-busy");var t=document.createElement("div");t.id="nprogress",t.innerHTML=r.template;var a,i=t.querySelector(r.barSelector),l=e?"-100":o(n.status||0),u=document.querySelector(r.parent);return s(i,{transition:"all 0 linear",transform:"translate3d("+l+"%,0,0)"}),r.showSpinner||(a=t.querySelector(r.spinnerSelector))&&p(a),u!=document.body&&c(u,"nprogress-custom-parent"),u.appendChild(t),t},n.remove=function(){d(document.documentElement,"nprogress-busy"),d(document.querySelector(r.parent),"nprogress-custom-parent");var e=document.getElementById("nprogress");e&&p(e)},n.isRendered=function(){return!!document.getElementById("nprogress")},n.getPositioningCSS=function(){var e=document.body.style,t="WebkitTransform"in e?"Webkit":"MozTransform"in e?"Moz":"msTransform"in e?"ms":"OTransform"in e?"O":"";return t+"Perspective"in e?"translate3d":t+"Transform"in e?"translate":"margin"};var l=function(){var e=[];function t(){var n=e.shift();n&&n(t)}return function(n){e.push(n),1==e.length&&t()}}(),s=function(){var e=["Webkit","O","Moz","ms"],t={};function n(e){return e.replace(/^-ms-/,"ms-").replace(/-([\da-z])/gi,(function(e,t){return t.toUpperCase()}))}function r(t){var n=document.body.style;if(t in n)return t;for(var r,a=e.length,o=t.charAt(0).toUpperCase()+t.slice(1);a--;)if((r=e[a]+o)in n)return r;return t}function a(e){return e=n(e),t[e]||(t[e]=r(e))}function o(e,t,n){t=a(t),e.style[t]=n}return function(e,t){var n,r,a=arguments;if(2==a.length)for(n in t)void 0!==(r=t[n])&&t.hasOwnProperty(n)&&o(e,n,r);else o(e,a[1],a[2])}}();function u(e,t){return("string"==typeof e?e:f(e)).indexOf(" "+t+" ")>=0}function c(e,t){var n=f(e),r=n+t;u(n,t)||(e.className=r.substring(1))}function d(e,t){var n,r=f(e);u(e,t)&&(n=r.replace(" "+t+" "," "),e.className=n.substring(1,n.length-1))}function f(e){return(" "+(e.className||"")+" ").replace(/\s+/gi," ")}function p(e){e&&e.parentNode&&e.parentNode.removeChild(e)}return n},void 0===(a="function"==typeof r?r.call(t,n,t,e):r)||(e.exports=a)},27418:e=>{"use strict";var t=Object.getOwnPropertySymbols,n=Object.prototype.hasOwnProperty,r=Object.prototype.propertyIsEnumerable;e.exports=function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},n=0;n<10;n++)t["_"+String.fromCharCode(n)]=n;if("0123456789"!==Object.getOwnPropertyNames(t).map((function(e){return t[e]})).join(""))return!1;var r={};return"abcdefghijklmnopqrst".split("").forEach((function(e){r[e]=e})),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},r)).join("")}catch(a){return!1}}()?Object.assign:function(e,a){for(var o,i,l=function(e){if(null==e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}(e),s=1;s{var r=n(5826);e.exports=p,e.exports.parse=o,e.exports.compile=function(e,t){return l(o(e,t),t)},e.exports.tokensToFunction=l,e.exports.tokensToRegExp=f;var a=new RegExp(["(\\\\.)","([\\/.])?(?:(?:\\:(\\w+)(?:\\(((?:\\\\.|[^\\\\()])+)\\))?|\\(((?:\\\\.|[^\\\\()])+)\\))([+*?])?|(\\*))"].join("|"),"g");function o(e,t){for(var n,r=[],o=0,i=0,l="",c=t&&t.delimiter||"/";null!=(n=a.exec(e));){var d=n[0],f=n[1],p=n.index;if(l+=e.slice(i,p),i=p+d.length,f)l+=f[1];else{var m=e[i],h=n[2],g=n[3],v=n[4],b=n[5],y=n[6],w=n[7];l&&(r.push(l),l="");var E=null!=h&&null!=m&&m!==h,k="+"===y||"*"===y,S="?"===y||"*"===y,C=n[2]||c,_=v||b;r.push({name:g||o++,prefix:h||"",delimiter:C,optional:S,repeat:k,partial:E,asterisk:!!w,pattern:_?u(_):w?".*":"[^"+s(C)+"]+?"})}}return i{"use strict";n.d(t,{Z:()=>o});var r=function(){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,t=0,n={},r={util:{encode:function e(t){return t instanceof a?new a(t.type,e(t.content),t.alias):Array.isArray(t)?t.map(e):t.replace(/&/g,"&").replace(/=d.reach);S+=k.value.length,k=k.next){var C=k.value;if(t.length>e.length)return;if(!(C instanceof a)){var _,x=1;if(b){if(!(_=o(E,S,e,v))||_.index>=e.length)break;var T=_.index,L=_.index+_[0].length,A=S;for(A+=k.value.length;T>=A;)A+=(k=k.next).value.length;if(S=A-=k.value.length,k.value instanceof a)continue;for(var N=k;N!==t.tail&&(Ad.reach&&(d.reach=D);var R=k.prev;if(O&&(R=s(t,R,O),S+=O.length),u(t,R,x),k=s(t,R,new a(f,g?r.tokenize(P,g):P,y,P)),I&&s(t,k,I),x>1){var M={cause:f+","+m,reach:D};i(e,t,n,k.prev,S,M),d&&M.reach>d.reach&&(d.reach=M.reach)}}}}}}function l(){var e={value:null,prev:null,next:null},t={value:null,prev:e,next:null};e.next=t,this.head=e,this.tail=t,this.length=0}function s(e,t,n){var r=t.next,a={value:n,prev:t,next:r};return t.next=a,r.prev=a,e.length++,a}function u(e,t,n){for(var r=t.next,a=0;a"+o.content+""},r}(),a=r;r.default=r,a.languages.markup={comment:{pattern://,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]},a.languages.markup.tag.inside["attr-value"].inside.entity=a.languages.markup.entity,a.languages.markup.doctype.inside["internal-subset"].inside=a.languages.markup,a.hooks.add("wrap",(function(e){"entity"===e.type&&(e.attributes.title=e.content.replace(/&/,"&"))})),Object.defineProperty(a.languages.markup.tag,"addInlined",{value:function(e,t){var n={};n["language-"+t]={pattern:/(^$)/i,lookbehind:!0,inside:a.languages[t]},n.cdata=/^$/i;var r={"included-cdata":{pattern://i,inside:n}};r["language-"+t]={pattern:/[\s\S]+/,inside:a.languages[t]};var o={};o[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,(function(){return e})),"i"),lookbehind:!0,greedy:!0,inside:r},a.languages.insertBefore("markup","cdata",o)}}),Object.defineProperty(a.languages.markup.tag,"addAttribute",{value:function(e,t){a.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+e+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[t,"language-"+t],inside:a.languages[t]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}}),a.languages.html=a.languages.markup,a.languages.mathml=a.languages.markup,a.languages.svg=a.languages.markup,a.languages.xml=a.languages.extend("markup",{}),a.languages.ssml=a.languages.xml,a.languages.atom=a.languages.xml,a.languages.rss=a.languages.xml,function(e){var t="\\b(?:BASH|BASHOPTS|BASH_ALIASES|BASH_ARGC|BASH_ARGV|BASH_CMDS|BASH_COMPLETION_COMPAT_DIR|BASH_LINENO|BASH_REMATCH|BASH_SOURCE|BASH_VERSINFO|BASH_VERSION|COLORTERM|COLUMNS|COMP_WORDBREAKS|DBUS_SESSION_BUS_ADDRESS|DEFAULTS_PATH|DESKTOP_SESSION|DIRSTACK|DISPLAY|EUID|GDMSESSION|GDM_LANG|GNOME_KEYRING_CONTROL|GNOME_KEYRING_PID|GPG_AGENT_INFO|GROUPS|HISTCONTROL|HISTFILE|HISTFILESIZE|HISTSIZE|HOME|HOSTNAME|HOSTTYPE|IFS|INSTANCE|JOB|LANG|LANGUAGE|LC_ADDRESS|LC_ALL|LC_IDENTIFICATION|LC_MEASUREMENT|LC_MONETARY|LC_NAME|LC_NUMERIC|LC_PAPER|LC_TELEPHONE|LC_TIME|LESSCLOSE|LESSOPEN|LINES|LOGNAME|LS_COLORS|MACHTYPE|MAILCHECK|MANDATORY_PATH|NO_AT_BRIDGE|OLDPWD|OPTERR|OPTIND|ORBIT_SOCKETDIR|OSTYPE|PAPERSIZE|PATH|PIPESTATUS|PPID|PS1|PS2|PS3|PS4|PWD|RANDOM|REPLY|SECONDS|SELINUX_INIT|SESSION|SESSIONTYPE|SESSION_MANAGER|SHELL|SHELLOPTS|SHLVL|SSH_AUTH_SOCK|TERM|UID|UPSTART_EVENTS|UPSTART_INSTANCE|UPSTART_JOB|UPSTART_SESSION|USER|WINDOWID|XAUTHORITY|XDG_CONFIG_DIRS|XDG_CURRENT_DESKTOP|XDG_DATA_DIRS|XDG_GREETER_DATA_DIR|XDG_MENU_PREFIX|XDG_RUNTIME_DIR|XDG_SEAT|XDG_SEAT_PATH|XDG_SESSION_DESKTOP|XDG_SESSION_ID|XDG_SESSION_PATH|XDG_SESSION_TYPE|XDG_VTNR|XMODIFIERS)\\b",n={pattern:/(^(["']?)\w+\2)[ \t]+\S.*/,lookbehind:!0,alias:"punctuation",inside:null},r={bash:n,environment:{pattern:RegExp("\\$"+t),alias:"constant"},variable:[{pattern:/\$?\(\([\s\S]+?\)\)/,greedy:!0,inside:{variable:[{pattern:/(^\$\(\([\s\S]+)\)\)/,lookbehind:!0},/^\$\(\(/],number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee]-?\d+)?/,operator:/--|\+\+|\*\*=?|<<=?|>>=?|&&|\|\||[=!+\-*/%<>^&|]=?|[?~:]/,punctuation:/\(\(?|\)\)?|,|;/}},{pattern:/\$\((?:\([^)]+\)|[^()])+\)|`[^`]+`/,greedy:!0,inside:{variable:/^\$\(|^`|\)$|`$/}},{pattern:/\$\{[^}]+\}/,greedy:!0,inside:{operator:/:[-=?+]?|[!\/]|##?|%%?|\^\^?|,,?/,punctuation:/[\[\]]/,environment:{pattern:RegExp("(\\{)"+t),lookbehind:!0,alias:"constant"}}},/\$(?:\w+|[#?*!@$])/],entity:/\\(?:[abceEfnrtv\\"]|O?[0-7]{1,3}|U[0-9a-fA-F]{8}|u[0-9a-fA-F]{4}|x[0-9a-fA-F]{1,2})/};e.languages.bash={shebang:{pattern:/^#!\s*\/.*/,alias:"important"},comment:{pattern:/(^|[^"{\\$])#.*/,lookbehind:!0},"function-name":[{pattern:/(\bfunction\s+)[\w-]+(?=(?:\s*\(?:\s*\))?\s*\{)/,lookbehind:!0,alias:"function"},{pattern:/\b[\w-]+(?=\s*\(\s*\)\s*\{)/,alias:"function"}],"for-or-select":{pattern:/(\b(?:for|select)\s+)\w+(?=\s+in\s)/,alias:"variable",lookbehind:!0},"assign-left":{pattern:/(^|[\s;|&]|[<>]\()\w+(?=\+?=)/,inside:{environment:{pattern:RegExp("(^|[\\s;|&]|[<>]\\()"+t),lookbehind:!0,alias:"constant"}},alias:"variable",lookbehind:!0},string:[{pattern:/((?:^|[^<])<<-?\s*)(\w+)\s[\s\S]*?(?:\r?\n|\r)\2/,lookbehind:!0,greedy:!0,inside:r},{pattern:/((?:^|[^<])<<-?\s*)(["'])(\w+)\2\s[\s\S]*?(?:\r?\n|\r)\3/,lookbehind:!0,greedy:!0,inside:{bash:n}},{pattern:/(^|[^\\](?:\\\\)*)"(?:\\[\s\S]|\$\([^)]+\)|\$(?!\()|`[^`]+`|[^"\\`$])*"/,lookbehind:!0,greedy:!0,inside:r},{pattern:/(^|[^$\\])'[^']*'/,lookbehind:!0,greedy:!0},{pattern:/\$'(?:[^'\\]|\\[\s\S])*'/,greedy:!0,inside:{entity:r.entity}}],environment:{pattern:RegExp("\\$?"+t),alias:"constant"},variable:r.variable,function:{pattern:/(^|[\s;|&]|[<>]\()(?:add|apropos|apt|apt-cache|apt-get|aptitude|aspell|automysqlbackup|awk|basename|bash|bc|bconsole|bg|bzip2|cal|cat|cfdisk|chgrp|chkconfig|chmod|chown|chroot|cksum|clear|cmp|column|comm|composer|cp|cron|crontab|csplit|curl|cut|date|dc|dd|ddrescue|debootstrap|df|diff|diff3|dig|dir|dircolors|dirname|dirs|dmesg|docker|docker-compose|du|egrep|eject|env|ethtool|expand|expect|expr|fdformat|fdisk|fg|fgrep|file|find|fmt|fold|format|free|fsck|ftp|fuser|gawk|git|gparted|grep|groupadd|groupdel|groupmod|groups|grub-mkconfig|gzip|halt|head|hg|history|host|hostname|htop|iconv|id|ifconfig|ifdown|ifup|import|install|ip|jobs|join|kill|killall|less|link|ln|locate|logname|logrotate|look|lpc|lpr|lprint|lprintd|lprintq|lprm|ls|lsof|lynx|make|man|mc|mdadm|mkconfig|mkdir|mke2fs|mkfifo|mkfs|mkisofs|mknod|mkswap|mmv|more|most|mount|mtools|mtr|mutt|mv|nano|nc|netstat|nice|nl|node|nohup|notify-send|npm|nslookup|op|open|parted|passwd|paste|pathchk|ping|pkill|pnpm|podman|podman-compose|popd|pr|printcap|printenv|ps|pushd|pv|quota|quotacheck|quotactl|ram|rar|rcp|reboot|remsync|rename|renice|rev|rm|rmdir|rpm|rsync|scp|screen|sdiff|sed|sendmail|seq|service|sftp|sh|shellcheck|shuf|shutdown|sleep|slocate|sort|split|ssh|stat|strace|su|sudo|sum|suspend|swapon|sync|tac|tail|tar|tee|time|timeout|top|touch|tr|traceroute|tsort|tty|umount|uname|unexpand|uniq|units|unrar|unshar|unzip|update-grub|uptime|useradd|userdel|usermod|users|uudecode|uuencode|v|vcpkg|vdir|vi|vim|virsh|vmstat|wait|watch|wc|wget|whereis|which|who|whoami|write|xargs|xdg-open|yarn|yes|zenity|zip|zsh|zypper)(?=$|[)\s;|&])/,lookbehind:!0},keyword:{pattern:/(^|[\s;|&]|[<>]\()(?:case|do|done|elif|else|esac|fi|for|function|if|in|select|then|until|while)(?=$|[)\s;|&])/,lookbehind:!0},builtin:{pattern:/(^|[\s;|&]|[<>]\()(?:\.|:|alias|bind|break|builtin|caller|cd|command|continue|declare|echo|enable|eval|exec|exit|export|getopts|hash|help|let|local|logout|mapfile|printf|pwd|read|readarray|readonly|return|set|shift|shopt|source|test|times|trap|type|typeset|ulimit|umask|unalias|unset)(?=$|[)\s;|&])/,lookbehind:!0,alias:"class-name"},boolean:{pattern:/(^|[\s;|&]|[<>]\()(?:false|true)(?=$|[)\s;|&])/,lookbehind:!0},"file-descriptor":{pattern:/\B&\d\b/,alias:"important"},operator:{pattern:/\d?<>|>\||\+=|=[=~]?|!=?|<<[<-]?|[&\d]?>>|\d[<>]&?|[<>][&=]?|&[>&]?|\|[&|]?/,inside:{"file-descriptor":{pattern:/^\d/,alias:"important"}}},punctuation:/\$?\(\(?|\)\)?|\.\.|[{}[\];\\]/,number:{pattern:/(^|\s)(?:[1-9]\d*|0)(?:[.,]\d+)?\b/,lookbehind:!0}},n.inside=e.languages.bash;for(var a=["comment","function-name","for-or-select","assign-left","string","environment","function","keyword","builtin","boolean","file-descriptor","operator","punctuation","number"],o=r.variable[1].inside,i=0;i]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/},a.languages.c=a.languages.extend("clike",{comment:{pattern:/\/\/(?:[^\r\n\\]|\\(?:\r\n?|\n|(?![\r\n])))*|\/\*[\s\S]*?(?:\*\/|$)/,greedy:!0},string:{pattern:/"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"/,greedy:!0},"class-name":{pattern:/(\b(?:enum|struct)\s+(?:__attribute__\s*\(\([\s\S]*?\)\)\s*)?)\w+|\b[a-z]\w*_t\b/,lookbehind:!0},keyword:/\b(?:_Alignas|_Alignof|_Atomic|_Bool|_Complex|_Generic|_Imaginary|_Noreturn|_Static_assert|_Thread_local|__attribute__|asm|auto|break|case|char|const|continue|default|do|double|else|enum|extern|float|for|goto|if|inline|int|long|register|return|short|signed|sizeof|static|struct|switch|typedef|typeof|union|unsigned|void|volatile|while)\b/,function:/\b[a-z_]\w*(?=\s*\()/i,number:/(?:\b0x(?:[\da-f]+(?:\.[\da-f]*)?|\.[\da-f]+)(?:p[+-]?\d+)?|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?)[ful]{0,4}/i,operator:/>>=?|<<=?|->|([-+&|:])\1|[?:~]|[-+*/%&|^!=<>]=?/}),a.languages.insertBefore("c","string",{char:{pattern:/'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n]){0,32}'/,greedy:!0}}),a.languages.insertBefore("c","string",{macro:{pattern:/(^[\t ]*)#\s*[a-z](?:[^\r\n\\/]|\/(?!\*)|\/\*(?:[^*]|\*(?!\/))*\*\/|\\(?:\r\n|[\s\S]))*/im,lookbehind:!0,greedy:!0,alias:"property",inside:{string:[{pattern:/^(#\s*include\s*)<[^>]+>/,lookbehind:!0},a.languages.c.string],char:a.languages.c.char,comment:a.languages.c.comment,"macro-name":[{pattern:/(^#\s*define\s+)\w+\b(?!\()/i,lookbehind:!0},{pattern:/(^#\s*define\s+)\w+\b(?=\()/i,lookbehind:!0,alias:"function"}],directive:{pattern:/^(#\s*)[a-z]+/,lookbehind:!0,alias:"keyword"},"directive-hash":/^#/,punctuation:/##|\\(?=[\r\n])/,expression:{pattern:/\S[\s\S]*/,inside:a.languages.c}}}}),a.languages.insertBefore("c","function",{constant:/\b(?:EOF|NULL|SEEK_CUR|SEEK_END|SEEK_SET|__DATE__|__FILE__|__LINE__|__TIMESTAMP__|__TIME__|__func__|stderr|stdin|stdout)\b/}),delete a.languages.c.boolean,function(e){var t=/\b(?:alignas|alignof|asm|auto|bool|break|case|catch|char|char16_t|char32_t|char8_t|class|co_await|co_return|co_yield|compl|concept|const|const_cast|consteval|constexpr|constinit|continue|decltype|default|delete|do|double|dynamic_cast|else|enum|explicit|export|extern|final|float|for|friend|goto|if|import|inline|int|int16_t|int32_t|int64_t|int8_t|long|module|mutable|namespace|new|noexcept|nullptr|operator|override|private|protected|public|register|reinterpret_cast|requires|return|short|signed|sizeof|static|static_assert|static_cast|struct|switch|template|this|thread_local|throw|try|typedef|typeid|typename|uint16_t|uint32_t|uint64_t|uint8_t|union|unsigned|using|virtual|void|volatile|wchar_t|while)\b/,n=/\b(?!)\w+(?:\s*\.\s*\w+)*\b/.source.replace(//g,(function(){return t.source}));e.languages.cpp=e.languages.extend("c",{"class-name":[{pattern:RegExp(/(\b(?:class|concept|enum|struct|typename)\s+)(?!)\w+/.source.replace(//g,(function(){return t.source}))),lookbehind:!0},/\b[A-Z]\w*(?=\s*::\s*\w+\s*\()/,/\b[A-Z_]\w*(?=\s*::\s*~\w+\s*\()/i,/\b\w+(?=\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>\s*::\s*\w+\s*\()/],keyword:t,number:{pattern:/(?:\b0b[01']+|\b0x(?:[\da-f']+(?:\.[\da-f']*)?|\.[\da-f']+)(?:p[+-]?[\d']+)?|(?:\b[\d']+(?:\.[\d']*)?|\B\.[\d']+)(?:e[+-]?[\d']+)?)[ful]{0,4}/i,greedy:!0},operator:/>>=?|<<=?|->|--|\+\+|&&|\|\||[?:~]|<=>|[-+*/%&|^!=<>]=?|\b(?:and|and_eq|bitand|bitor|not|not_eq|or|or_eq|xor|xor_eq)\b/,boolean:/\b(?:false|true)\b/}),e.languages.insertBefore("cpp","string",{module:{pattern:RegExp(/(\b(?:import|module)\s+)/.source+"(?:"+/"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|<[^<>\r\n]*>/.source+"|"+/(?:\s*:\s*)?|:\s*/.source.replace(//g,(function(){return n}))+")"),lookbehind:!0,greedy:!0,inside:{string:/^[<"][\s\S]+/,operator:/:/,punctuation:/\./}},"raw-string":{pattern:/R"([^()\\ ]{0,16})\([\s\S]*?\)\1"/,alias:"string",greedy:!0}}),e.languages.insertBefore("cpp","keyword",{"generic-function":{pattern:/\b(?!operator\b)[a-z_]\w*\s*<(?:[^<>]|<[^<>]*>)*>(?=\s*\()/i,inside:{function:/^\w+/,generic:{pattern:/<[\s\S]+/,alias:"class-name",inside:e.languages.cpp}}}}),e.languages.insertBefore("cpp","operator",{"double-colon":{pattern:/::/,alias:"punctuation"}}),e.languages.insertBefore("cpp","class-name",{"base-clause":{pattern:/(\b(?:class|struct)\s+\w+\s*:\s*)[^;{}"'\s]+(?:\s+[^;{}"'\s]+)*(?=\s*[;{])/,lookbehind:!0,greedy:!0,inside:e.languages.extend("cpp",{})}}),e.languages.insertBefore("inside","double-colon",{"class-name":/\b[a-z_]\w*\b(?!\s*::)/i},e.languages.cpp["base-clause"])}(a),function(e){var t=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;e.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:/@[\w-](?:[^;{\s]|\s+(?![\s{]))*(?:;|(?=\s*\{))/,inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+t.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+t.source+"$"),alias:"url"}}},selector:{pattern:RegExp("(^|[{}\\s])[^{}\\s](?:[^{};\"'\\s]|\\s+(?![\\s{])|"+t.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:t,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},e.languages.css.atrule.inside.rest=e.languages.css;var n=e.languages.markup;n&&(n.tag.addInlined("style","css"),n.tag.addAttribute("style","css"))}(a),function(e){var t,n=/("|')(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/;e.languages.css.selector={pattern:e.languages.css.selector.pattern,lookbehind:!0,inside:t={"pseudo-element":/:(?:after|before|first-letter|first-line|selection)|::[-\w]+/,"pseudo-class":/:[-\w]+/,class:/\.[-\w]+/,id:/#[-\w]+/,attribute:{pattern:RegExp("\\[(?:[^[\\]\"']|"+n.source+")*\\]"),greedy:!0,inside:{punctuation:/^\[|\]$/,"case-sensitivity":{pattern:/(\s)[si]$/i,lookbehind:!0,alias:"keyword"},namespace:{pattern:/^(\s*)(?:(?!\s)[-*\w\xA0-\uFFFF])*\|(?!=)/,lookbehind:!0,inside:{punctuation:/\|$/}},"attr-name":{pattern:/^(\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+/,lookbehind:!0},"attr-value":[n,{pattern:/(=\s*)(?:(?!\s)[-\w\xA0-\uFFFF])+(?=\s*$)/,lookbehind:!0}],operator:/[|~*^$]?=/}},"n-th":[{pattern:/(\(\s*)[+-]?\d*[\dn](?:\s*[+-]\s*\d+)?(?=\s*\))/,lookbehind:!0,inside:{number:/[\dn]+/,operator:/[+-]/}},{pattern:/(\(\s*)(?:even|odd)(?=\s*\))/i,lookbehind:!0}],combinator:/>|\+|~|\|\|/,punctuation:/[(),]/}},e.languages.css.atrule.inside["selector-function-argument"].inside=t,e.languages.insertBefore("css","property",{variable:{pattern:/(^|[^-\w\xA0-\uFFFF])--(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*/i,lookbehind:!0}});var r={pattern:/(\b\d+)(?:%|[a-z]+(?![\w-]))/,lookbehind:!0},a={pattern:/(^|[^\w.-])-?(?:\d+(?:\.\d+)?|\.\d+)/,lookbehind:!0};e.languages.insertBefore("css","function",{operator:{pattern:/(\s)[+\-*\/](?=\s)/,lookbehind:!0},hexcode:{pattern:/\B#[\da-f]{3,8}\b/i,alias:"color"},color:[{pattern:/(^|[^\w-])(?:AliceBlue|AntiqueWhite|Aqua|Aquamarine|Azure|Beige|Bisque|Black|BlanchedAlmond|Blue|BlueViolet|Brown|BurlyWood|CadetBlue|Chartreuse|Chocolate|Coral|CornflowerBlue|Cornsilk|Crimson|Cyan|DarkBlue|DarkCyan|DarkGoldenRod|DarkGr[ae]y|DarkGreen|DarkKhaki|DarkMagenta|DarkOliveGreen|DarkOrange|DarkOrchid|DarkRed|DarkSalmon|DarkSeaGreen|DarkSlateBlue|DarkSlateGr[ae]y|DarkTurquoise|DarkViolet|DeepPink|DeepSkyBlue|DimGr[ae]y|DodgerBlue|FireBrick|FloralWhite|ForestGreen|Fuchsia|Gainsboro|GhostWhite|Gold|GoldenRod|Gr[ae]y|Green|GreenYellow|HoneyDew|HotPink|IndianRed|Indigo|Ivory|Khaki|Lavender|LavenderBlush|LawnGreen|LemonChiffon|LightBlue|LightCoral|LightCyan|LightGoldenRodYellow|LightGr[ae]y|LightGreen|LightPink|LightSalmon|LightSeaGreen|LightSkyBlue|LightSlateGr[ae]y|LightSteelBlue|LightYellow|Lime|LimeGreen|Linen|Magenta|Maroon|MediumAquaMarine|MediumBlue|MediumOrchid|MediumPurple|MediumSeaGreen|MediumSlateBlue|MediumSpringGreen|MediumTurquoise|MediumVioletRed|MidnightBlue|MintCream|MistyRose|Moccasin|NavajoWhite|Navy|OldLace|Olive|OliveDrab|Orange|OrangeRed|Orchid|PaleGoldenRod|PaleGreen|PaleTurquoise|PaleVioletRed|PapayaWhip|PeachPuff|Peru|Pink|Plum|PowderBlue|Purple|Red|RosyBrown|RoyalBlue|SaddleBrown|Salmon|SandyBrown|SeaGreen|SeaShell|Sienna|Silver|SkyBlue|SlateBlue|SlateGr[ae]y|Snow|SpringGreen|SteelBlue|Tan|Teal|Thistle|Tomato|Transparent|Turquoise|Violet|Wheat|White|WhiteSmoke|Yellow|YellowGreen)(?![\w-])/i,lookbehind:!0},{pattern:/\b(?:hsl|rgb)\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*\)\B|\b(?:hsl|rgb)a\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*,\s*(?:0|0?\.\d+|1)\s*\)\B/i,inside:{unit:r,number:a,function:/[\w-]+(?=\()/,punctuation:/[(),]/}}],entity:/\\[\da-f]{1,8}/i,unit:r,number:a})}(a),a.languages.javascript=a.languages.extend("clike",{"class-name":[a.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/}),a.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/,a.languages.insertBefore("javascript","keyword",{regex:{pattern:/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)\/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/,lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:a.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:a.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:a.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:a.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:a.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/}),a.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:a.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}}),a.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}}),a.languages.markup&&(a.languages.markup.tag.addInlined("script","javascript"),a.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript")),a.languages.js=a.languages.javascript,function(e){var t=/#(?!\{).+/,n={pattern:/#\{[^}]+\}/,alias:"variable"};e.languages.coffeescript=e.languages.extend("javascript",{comment:t,string:[{pattern:/'(?:\\[\s\S]|[^\\'])*'/,greedy:!0},{pattern:/"(?:\\[\s\S]|[^\\"])*"/,greedy:!0,inside:{interpolation:n}}],keyword:/\b(?:and|break|by|catch|class|continue|debugger|delete|do|each|else|extend|extends|false|finally|for|if|in|instanceof|is|isnt|let|loop|namespace|new|no|not|null|of|off|on|or|own|return|super|switch|then|this|throw|true|try|typeof|undefined|unless|until|when|while|window|with|yes|yield)\b/,"class-member":{pattern:/@(?!\d)\w+/,alias:"variable"}}),e.languages.insertBefore("coffeescript","comment",{"multiline-comment":{pattern:/###[\s\S]+?###/,alias:"comment"},"block-regex":{pattern:/\/{3}[\s\S]*?\/{3}/,alias:"regex",inside:{comment:t,interpolation:n}}}),e.languages.insertBefore("coffeescript","string",{"inline-javascript":{pattern:/`(?:\\[\s\S]|[^\\`])*`/,inside:{delimiter:{pattern:/^`|`$/,alias:"punctuation"},script:{pattern:/[\s\S]+/,alias:"language-javascript",inside:e.languages.javascript}}},"multiline-string":[{pattern:/'''[\s\S]*?'''/,greedy:!0,alias:"string"},{pattern:/"""[\s\S]*?"""/,greedy:!0,alias:"string",inside:{interpolation:n}}]}),e.languages.insertBefore("coffeescript","keyword",{property:/(?!\d)\w+(?=\s*:(?!:))/}),delete e.languages.coffeescript["template-string"],e.languages.coffee=e.languages.coffeescript}(a),function(e){var t=/[*&][^\s[\]{},]+/,n=/!(?:<[\w\-%#;/?:@&=+$,.!~*'()[\]]+>|(?:[a-zA-Z\d-]*!)?[\w\-%#;/?:@&=+$.~*'()]+)?/,r="(?:"+n.source+"(?:[ \t]+"+t.source+")?|"+t.source+"(?:[ \t]+"+n.source+")?)",a=/(?:[^\s\x00-\x08\x0e-\x1f!"#%&'*,\-:>?@[\]`{|}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]|[?:-])(?:[ \t]*(?:(?![#:])|:))*/.source.replace(//g,(function(){return/[^\s\x00-\x08\x0e-\x1f,[\]{}\x7f-\x84\x86-\x9f\ud800-\udfff\ufffe\uffff]/.source})),o=/"(?:[^"\\\r\n]|\\.)*"|'(?:[^'\\\r\n]|\\.)*'/.source;function i(e,t){t=(t||"").replace(/m/g,"")+"m";var n=/([:\-,[{]\s*(?:\s<>[ \t]+)?)(?:<>)(?=[ \t]*(?:$|,|\]|\}|(?:[\r\n]\s*)?#))/.source.replace(/<>/g,(function(){return r})).replace(/<>/g,(function(){return e}));return RegExp(n,t)}e.languages.yaml={scalar:{pattern:RegExp(/([\-:]\s*(?:\s<>[ \t]+)?[|>])[ \t]*(?:((?:\r?\n|\r)[ \t]+)\S[^\r\n]*(?:\2[^\r\n]+)*)/.source.replace(/<>/g,(function(){return r}))),lookbehind:!0,alias:"string"},comment:/#.*/,key:{pattern:RegExp(/((?:^|[:\-,[{\r\n?])[ \t]*(?:<>[ \t]+)?)<>(?=\s*:\s)/.source.replace(/<>/g,(function(){return r})).replace(/<>/g,(function(){return"(?:"+a+"|"+o+")"}))),lookbehind:!0,greedy:!0,alias:"atrule"},directive:{pattern:/(^[ \t]*)%.+/m,lookbehind:!0,alias:"important"},datetime:{pattern:i(/\d{4}-\d\d?-\d\d?(?:[tT]|[ \t]+)\d\d?:\d{2}:\d{2}(?:\.\d*)?(?:[ \t]*(?:Z|[-+]\d\d?(?::\d{2})?))?|\d{4}-\d{2}-\d{2}|\d\d?:\d{2}(?::\d{2}(?:\.\d*)?)?/.source),lookbehind:!0,alias:"number"},boolean:{pattern:i(/false|true/.source,"i"),lookbehind:!0,alias:"important"},null:{pattern:i(/null|~/.source,"i"),lookbehind:!0,alias:"important"},string:{pattern:i(o),lookbehind:!0,greedy:!0},number:{pattern:i(/[+-]?(?:0x[\da-f]+|0o[0-7]+|(?:\d+(?:\.\d*)?|\.\d+)(?:e[+-]?\d+)?|\.inf|\.nan)/.source,"i"),lookbehind:!0},tag:n,important:t,punctuation:/---|[:[\]{}\-,|>?]|\.\.\./},e.languages.yml=e.languages.yaml}(a),function(e){var t=/(?:\\.|[^\\\n\r]|(?:\n|\r\n?)(?![\r\n]))/.source;function n(e){return e=e.replace(//g,(function(){return t})),RegExp(/((?:^|[^\\])(?:\\{2})*)/.source+"(?:"+e+")")}var r=/(?:\\.|``(?:[^`\r\n]|`(?!`))+``|`[^`\r\n]+`|[^\\|\r\n`])+/.source,a=/\|?__(?:\|__)+\|?(?:(?:\n|\r\n?)|(?![\s\S]))/.source.replace(/__/g,(function(){return r})),o=/\|?[ \t]*:?-{3,}:?[ \t]*(?:\|[ \t]*:?-{3,}:?[ \t]*)+\|?(?:\n|\r\n?)/.source;e.languages.markdown=e.languages.extend("markup",{}),e.languages.insertBefore("markdown","prolog",{"front-matter-block":{pattern:/(^(?:\s*[\r\n])?)---(?!.)[\s\S]*?[\r\n]---(?!.)/,lookbehind:!0,greedy:!0,inside:{punctuation:/^---|---$/,"front-matter":{pattern:/\S+(?:\s+\S+)*/,alias:["yaml","language-yaml"],inside:e.languages.yaml}}},blockquote:{pattern:/^>(?:[\t ]*>)*/m,alias:"punctuation"},table:{pattern:RegExp("^"+a+o+"(?:"+a+")*","m"),inside:{"table-data-rows":{pattern:RegExp("^("+a+o+")(?:"+a+")*$"),lookbehind:!0,inside:{"table-data":{pattern:RegExp(r),inside:e.languages.markdown},punctuation:/\|/}},"table-line":{pattern:RegExp("^("+a+")"+o+"$"),lookbehind:!0,inside:{punctuation:/\||:?-{3,}:?/}},"table-header-row":{pattern:RegExp("^"+a+"$"),inside:{"table-header":{pattern:RegExp(r),alias:"important",inside:e.languages.markdown},punctuation:/\|/}}}},code:[{pattern:/((?:^|\n)[ \t]*\n|(?:^|\r\n?)[ \t]*\r\n?)(?: {4}|\t).+(?:(?:\n|\r\n?)(?: {4}|\t).+)*/,lookbehind:!0,alias:"keyword"},{pattern:/^```[\s\S]*?^```$/m,greedy:!0,inside:{"code-block":{pattern:/^(```.*(?:\n|\r\n?))[\s\S]+?(?=(?:\n|\r\n?)^```$)/m,lookbehind:!0},"code-language":{pattern:/^(```).+/,lookbehind:!0},punctuation:/```/}}],title:[{pattern:/\S.*(?:\n|\r\n?)(?:==+|--+)(?=[ \t]*$)/m,alias:"important",inside:{punctuation:/==+$|--+$/}},{pattern:/(^\s*)#.+/m,lookbehind:!0,alias:"important",inside:{punctuation:/^#+|#+$/}}],hr:{pattern:/(^\s*)([*-])(?:[\t ]*\2){2,}(?=\s*$)/m,lookbehind:!0,alias:"punctuation"},list:{pattern:/(^\s*)(?:[*+-]|\d+\.)(?=[\t ].)/m,lookbehind:!0,alias:"punctuation"},"url-reference":{pattern:/!?\[[^\]]+\]:[\t ]+(?:\S+|<(?:\\.|[^>\\])+>)(?:[\t ]+(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\)))?/,inside:{variable:{pattern:/^(!?\[)[^\]]+/,lookbehind:!0},string:/(?:"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|\((?:\\.|[^)\\])*\))$/,punctuation:/^[\[\]!:]|[<>]/},alias:"url"},bold:{pattern:n(/\b__(?:(?!_)|_(?:(?!_))+_)+__\b|\*\*(?:(?!\*)|\*(?:(?!\*))+\*)+\*\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^..)[\s\S]+(?=..$)/,lookbehind:!0,inside:{}},punctuation:/\*\*|__/}},italic:{pattern:n(/\b_(?:(?!_)|__(?:(?!_))+__)+_\b|\*(?:(?!\*)|\*\*(?:(?!\*))+\*\*)+\*/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^.)[\s\S]+(?=.$)/,lookbehind:!0,inside:{}},punctuation:/[*_]/}},strike:{pattern:n(/(~~?)(?:(?!~))+\2/.source),lookbehind:!0,greedy:!0,inside:{content:{pattern:/(^~~?)[\s\S]+(?=\1$)/,lookbehind:!0,inside:{}},punctuation:/~~?/}},"code-snippet":{pattern:/(^|[^\\`])(?:``[^`\r\n]+(?:`[^`\r\n]+)*``(?!`)|`[^`\r\n]+`(?!`))/,lookbehind:!0,greedy:!0,alias:["code","keyword"]},url:{pattern:n(/!?\[(?:(?!\]))+\](?:\([^\s)]+(?:[\t ]+"(?:\\.|[^"\\])*")?\)|[ \t]?\[(?:(?!\]))+\])/.source),lookbehind:!0,greedy:!0,inside:{operator:/^!/,content:{pattern:/(^\[)[^\]]+(?=\])/,lookbehind:!0,inside:{}},variable:{pattern:/(^\][ \t]?\[)[^\]]+(?=\]$)/,lookbehind:!0},url:{pattern:/(^\]\()[^\s)]+/,lookbehind:!0},string:{pattern:/(^[ \t]+)"(?:\\.|[^"\\])*"(?=\)$)/,lookbehind:!0}}}}),["url","bold","italic","strike"].forEach((function(t){["url","bold","italic","strike","code-snippet"].forEach((function(n){t!==n&&(e.languages.markdown[t].inside.content.inside[n]=e.languages.markdown[n])}))})),e.hooks.add("after-tokenize",(function(e){"markdown"!==e.language&&"md"!==e.language||function e(t){if(t&&"string"!=typeof t)for(var n=0,r=t.length;n",quot:'"'},s=String.fromCodePoint||String.fromCharCode;e.languages.md=e.languages.markdown}(a),a.languages.graphql={comment:/#.*/,description:{pattern:/(?:"""(?:[^"]|(?!""")")*"""|"(?:\\.|[^\\"\r\n])*")(?=\s*[a-z_])/i,greedy:!0,alias:"string",inside:{"language-markdown":{pattern:/(^"(?:"")?)(?!\1)[\s\S]+(?=\1$)/,lookbehind:!0,inside:a.languages.markdown}}},string:{pattern:/"""(?:[^"]|(?!""")")*"""|"(?:\\.|[^\\"\r\n])*"/,greedy:!0},number:/(?:\B-|\b)\d+(?:\.\d+)?(?:e[+-]?\d+)?\b/i,boolean:/\b(?:false|true)\b/,variable:/\$[a-z_]\w*/i,directive:{pattern:/@[a-z_]\w*/i,alias:"function"},"attr-name":{pattern:/\b[a-z_]\w*(?=\s*(?:\((?:[^()"]|"(?:\\.|[^\\"\r\n])*")*\))?:)/i,greedy:!0},"atom-input":{pattern:/\b[A-Z]\w*Input\b/,alias:"class-name"},scalar:/\b(?:Boolean|Float|ID|Int|String)\b/,constant:/\b[A-Z][A-Z_\d]*\b/,"class-name":{pattern:/(\b(?:enum|implements|interface|on|scalar|type|union)\s+|&\s*|:\s*|\[)[A-Z_]\w*/,lookbehind:!0},fragment:{pattern:/(\bfragment\s+|\.{3}\s*(?!on\b))[a-zA-Z_]\w*/,lookbehind:!0,alias:"function"},"definition-mutation":{pattern:/(\bmutation\s+)[a-zA-Z_]\w*/,lookbehind:!0,alias:"function"},"definition-query":{pattern:/(\bquery\s+)[a-zA-Z_]\w*/,lookbehind:!0,alias:"function"},keyword:/\b(?:directive|enum|extend|fragment|implements|input|interface|mutation|on|query|repeatable|scalar|schema|subscription|type|union)\b/,operator:/[!=|&]|\.{3}/,"property-query":/\w+(?=\s*\()/,object:/\w+(?=\s*\{)/,punctuation:/[!(){}\[\]:=,]/,property:/\w+/},a.hooks.add("after-tokenize",(function(e){if("graphql"===e.language)for(var t=e.tokens.filter((function(e){return"string"!=typeof e&&"comment"!==e.type&&"scalar"!==e.type})),n=0;n0)){var l=f(/^\{$/,/^\}$/);if(-1===l)continue;for(var s=n;s=0&&p(u,"variable-input")}}}}function c(e){return t[n+e]}function d(e,t){t=t||0;for(var n=0;n?|<|>)?|>[>=]?|\b(?:AND|BETWEEN|DIV|ILIKE|IN|IS|LIKE|NOT|OR|REGEXP|RLIKE|SOUNDS LIKE|XOR)\b/i,punctuation:/[;[\]()`,.]/},function(e){var t=e.languages.javascript["template-string"],n=t.pattern.source,r=t.inside.interpolation,a=r.inside["interpolation-punctuation"],o=r.pattern.source;function i(t,r){if(e.languages[t])return{pattern:RegExp("((?:"+r+")\\s*)"+n),lookbehind:!0,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},"embedded-code":{pattern:/[\s\S]+/,alias:t}}}}function l(e,t){return"___"+t.toUpperCase()+"_"+e+"___"}function s(t,n,r){var a={code:t,grammar:n,language:r};return e.hooks.run("before-tokenize",a),a.tokens=e.tokenize(a.code,a.grammar),e.hooks.run("after-tokenize",a),a.tokens}function u(t){var n={};n["interpolation-punctuation"]=a;var o=e.tokenize(t,n);if(3===o.length){var i=[1,1];i.push.apply(i,s(o[1],e.languages.javascript,"javascript")),o.splice.apply(o,i)}return new e.Token("interpolation",o,r.alias,t)}function c(t,n,r){var a=e.tokenize(t,{interpolation:{pattern:RegExp(o),lookbehind:!0}}),i=0,c={},d=s(a.map((function(e){if("string"==typeof e)return e;for(var n,a=e.content;-1!==t.indexOf(n=l(i++,r)););return c[n]=a,n})).join(""),n,r),f=Object.keys(c);return i=0,function e(t){for(var n=0;n=f.length)return;var r=t[n];if("string"==typeof r||"string"==typeof r.content){var a=f[i],o="string"==typeof r?r:r.content,l=o.indexOf(a);if(-1!==l){++i;var s=o.substring(0,l),d=u(c[a]),p=o.substring(l+a.length),m=[];if(s&&m.push(s),m.push(d),p){var h=[p];e(h),m.push.apply(m,h)}"string"==typeof r?(t.splice.apply(t,[n,1].concat(m)),n+=m.length-1):r.content=m}}else{var g=r.content;Array.isArray(g)?e(g):e([g])}}}(d),new e.Token(r,d,"language-"+r,t)}e.languages.javascript["template-string"]=[i("css",/\b(?:styled(?:\([^)]*\))?(?:\s*\.\s*\w+(?:\([^)]*\))*)*|css(?:\s*\.\s*(?:global|resolve))?|createGlobalStyle|keyframes)/.source),i("html",/\bhtml|\.\s*(?:inner|outer)HTML\s*\+?=/.source),i("svg",/\bsvg/.source),i("markdown",/\b(?:markdown|md)/.source),i("graphql",/\b(?:gql|graphql(?:\s*\.\s*experimental)?)/.source),i("sql",/\bsql/.source),t].filter(Boolean);var d={javascript:!0,js:!0,typescript:!0,ts:!0,jsx:!0,tsx:!0};function f(e){return"string"==typeof e?e:Array.isArray(e)?e.map(f).join(""):f(e.content)}e.hooks.add("after-tokenize",(function(t){t.language in d&&function t(n){for(var r=0,a=n.length;r]|<(?:[^<>]|<[^<>]*>)*>)*>)?/,lookbehind:!0,greedy:!0,inside:null},builtin:/\b(?:Array|Function|Promise|any|boolean|console|never|number|string|symbol|unknown)\b/}),e.languages.typescript.keyword.push(/\b(?:abstract|declare|is|keyof|readonly|require)\b/,/\b(?:asserts|infer|interface|module|namespace|type)\b(?=\s*(?:[{_$a-zA-Z\xA0-\uFFFF]|$))/,/\btype\b(?=\s*(?:[\{*]|$))/),delete e.languages.typescript.parameter,delete e.languages.typescript["literal-property"];var t=e.languages.extend("typescript",{});delete t["class-name"],e.languages.typescript["class-name"].inside=t,e.languages.insertBefore("typescript","function",{decorator:{pattern:/@[$\w\xA0-\uFFFF]+/,inside:{at:{pattern:/^@/,alias:"operator"},function:/^[\s\S]+/}},"generic-function":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*<(?:[^<>]|<(?:[^<>]|<[^<>]*>)*>)*>(?=\s*\()/,greedy:!0,inside:{function:/^#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*/,generic:{pattern:/<[\s\S]+/,alias:"class-name",inside:t}}}}),e.languages.ts=e.languages.typescript}(a),function(e){function t(e,t){return RegExp(e.replace(//g,(function(){return/(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*/.source})),t)}e.languages.insertBefore("javascript","function-variable",{"method-variable":{pattern:RegExp("(\\.\\s*)"+e.languages.javascript["function-variable"].pattern.source),lookbehind:!0,alias:["function-variable","method","function","property-access"]}}),e.languages.insertBefore("javascript","function",{method:{pattern:RegExp("(\\.\\s*)"+e.languages.javascript.function.source),lookbehind:!0,alias:["function","property-access"]}}),e.languages.insertBefore("javascript","constant",{"known-class-name":[{pattern:/\b(?:(?:Float(?:32|64)|(?:Int|Uint)(?:8|16|32)|Uint8Clamped)?Array|ArrayBuffer|BigInt|Boolean|DataView|Date|Error|Function|Intl|JSON|(?:Weak)?(?:Map|Set)|Math|Number|Object|Promise|Proxy|Reflect|RegExp|String|Symbol|WebAssembly)\b/,alias:"class-name"},{pattern:/\b(?:[A-Z]\w*)Error\b/,alias:"class-name"}]}),e.languages.insertBefore("javascript","keyword",{imports:{pattern:t(/(\bimport\b\s*)(?:(?:\s*,\s*(?:\*\s*as\s+|\{[^{}]*\}))?|\*\s*as\s+|\{[^{}]*\})(?=\s*\bfrom\b)/.source),lookbehind:!0,inside:e.languages.javascript},exports:{pattern:t(/(\bexport\b\s*)(?:\*(?:\s*as\s+)?(?=\s*\bfrom\b)|\{[^{}]*\})/.source),lookbehind:!0,inside:e.languages.javascript}}),e.languages.javascript.keyword.unshift({pattern:/\b(?:as|default|export|from|import)\b/,alias:"module"},{pattern:/\b(?:await|break|catch|continue|do|else|finally|for|if|return|switch|throw|try|while|yield)\b/,alias:"control-flow"},{pattern:/\bnull\b/,alias:["null","nil"]},{pattern:/\bundefined\b/,alias:"nil"}),e.languages.insertBefore("javascript","operator",{spread:{pattern:/\.{3}/,alias:"operator"},arrow:{pattern:/=>/,alias:"operator"}}),e.languages.insertBefore("javascript","punctuation",{"property-access":{pattern:t(/(\.\s*)#?/.source),lookbehind:!0},"maybe-class-name":{pattern:/(^|[^$\w\xA0-\uFFFF])[A-Z][$\w\xA0-\uFFFF]+/,lookbehind:!0},dom:{pattern:/\b(?:document|(?:local|session)Storage|location|navigator|performance|window)\b/,alias:"variable"},console:{pattern:/\bconsole(?=\s*\.)/,alias:"class-name"}});for(var n=["function","function-variable","method","method-variable","property-access"],r=0;r*\.{3}(?:[^{}]|)*\})/.source;function o(e,t){return e=e.replace(//g,(function(){return n})).replace(//g,(function(){return r})).replace(//g,(function(){return a})),RegExp(e,t)}a=o(a).source,e.languages.jsx=e.languages.extend("markup",t),e.languages.jsx.tag.pattern=o(/<\/?(?:[\w.:-]+(?:+(?:[\w.:$-]+(?:=(?:"(?:\\[\s\S]|[^\\"])*"|'(?:\\[\s\S]|[^\\'])*'|[^\s{'"/>=]+|))?|))**\/?)?>/.source),e.languages.jsx.tag.inside.tag.pattern=/^<\/?[^\s>\/]*/,e.languages.jsx.tag.inside["attr-value"].pattern=/=(?!\{)(?:"(?:\\[\s\S]|[^\\"])*"|'(?:\\[\s\S]|[^\\'])*'|[^\s'">]+)/,e.languages.jsx.tag.inside.tag.inside["class-name"]=/^[A-Z]\w*(?:\.[A-Z]\w*)*$/,e.languages.jsx.tag.inside.comment=t.comment,e.languages.insertBefore("inside","attr-name",{spread:{pattern:o(//.source),inside:e.languages.jsx}},e.languages.jsx.tag),e.languages.insertBefore("inside","special-attr",{script:{pattern:o(/=/.source),alias:"language-javascript",inside:{"script-punctuation":{pattern:/^=(?=\{)/,alias:"punctuation"},rest:e.languages.jsx}}},e.languages.jsx.tag);var i=function(e){return e?"string"==typeof e?e:"string"==typeof e.content?e.content:e.content.map(i).join(""):""},l=function(t){for(var n=[],r=0;r0&&n[n.length-1].tagName===i(a.content[0].content[1])&&n.pop():"/>"===a.content[a.content.length-1].content||n.push({tagName:i(a.content[0].content[1]),openedBraces:0}):n.length>0&&"punctuation"===a.type&&"{"===a.content?n[n.length-1].openedBraces++:n.length>0&&n[n.length-1].openedBraces>0&&"punctuation"===a.type&&"}"===a.content?n[n.length-1].openedBraces--:o=!0),(o||"string"==typeof a)&&n.length>0&&0===n[n.length-1].openedBraces){var s=i(a);r0&&("string"==typeof t[r-1]||"plain-text"===t[r-1].type)&&(s=i(t[r-1])+s,t.splice(r-1,1),r--),t[r]=new e.Token("plain-text",s,null,s)}a.content&&"string"!=typeof a.content&&l(a.content)}};e.hooks.add("after-tokenize",(function(e){"jsx"!==e.language&&"tsx"!==e.language||l(e.tokens)}))}(a),function(e){e.languages.diff={coord:[/^(?:\*{3}|-{3}|\+{3}).*$/m,/^@@.*@@$/m,/^\d.*$/m]};var t={"deleted-sign":"-","deleted-arrow":"<","inserted-sign":"+","inserted-arrow":">",unchanged:" ",diff:"!"};Object.keys(t).forEach((function(n){var r=t[n],a=[];/^\w+$/.test(n)||a.push(/\w+/.exec(n)[0]),"diff"===n&&a.push("bold"),e.languages.diff[n]={pattern:RegExp("^(?:["+r+"].*(?:\r\n?|\n|(?![\\s\\S])))+","m"),alias:a,inside:{line:{pattern:/(.)(?=[\s\S]).*(?:\r\n?|\n)?/,lookbehind:!0},prefix:{pattern:/[\s\S]/,alias:/\w+/.exec(n)[0]}}}})),Object.defineProperty(e.languages.diff,"PREFIXES",{value:t})}(a),a.languages.git={comment:/^#.*/m,deleted:/^[-\u2013].*/m,inserted:/^\+.*/m,string:/("|')(?:\\.|(?!\1)[^\\\r\n])*\1/,command:{pattern:/^.*\$ git .*$/m,inside:{parameter:/\s--?\w+/}},coord:/^@@.*@@$/m,"commit-sha1":/^commit \w{40}$/m},a.languages.go=a.languages.extend("clike",{string:{pattern:/(^|[^\\])"(?:\\.|[^"\\\r\n])*"|`[^`]*`/,lookbehind:!0,greedy:!0},keyword:/\b(?:break|case|chan|const|continue|default|defer|else|fallthrough|for|func|go(?:to)?|if|import|interface|map|package|range|return|select|struct|switch|type|var)\b/,boolean:/\b(?:_|false|iota|nil|true)\b/,number:[/\b0(?:b[01_]+|o[0-7_]+)i?\b/i,/\b0x(?:[a-f\d_]+(?:\.[a-f\d_]*)?|\.[a-f\d_]+)(?:p[+-]?\d+(?:_\d+)*)?i?(?!\w)/i,/(?:\b\d[\d_]*(?:\.[\d_]*)?|\B\.\d[\d_]*)(?:e[+-]?[\d_]+)?i?(?!\w)/i],operator:/[*\/%^!=]=?|\+[=+]?|-[=-]?|\|[=|]?|&(?:=|&|\^=?)?|>(?:>=?|=)?|<(?:<=?|=|-)?|:=|\.\.\./,builtin:/\b(?:append|bool|byte|cap|close|complex|complex(?:64|128)|copy|delete|error|float(?:32|64)|u?int(?:8|16|32|64)?|imag|len|make|new|panic|print(?:ln)?|real|recover|rune|string|uintptr)\b/}),a.languages.insertBefore("go","string",{char:{pattern:/'(?:\\.|[^'\\\r\n]){0,10}'/,greedy:!0}}),delete a.languages.go["class-name"],function(e){function t(e,t){return"___"+e.toUpperCase()+t+"___"}Object.defineProperties(e.languages["markup-templating"]={},{buildPlaceholders:{value:function(n,r,a,o){if(n.language===r){var i=n.tokenStack=[];n.code=n.code.replace(a,(function(e){if("function"==typeof o&&!o(e))return e;for(var a,l=i.length;-1!==n.code.indexOf(a=t(r,l));)++l;return i[l]=e,a})),n.grammar=e.languages.markup}}},tokenizePlaceholders:{value:function(n,r){if(n.language===r&&n.tokenStack){n.grammar=e.languages[r];var a=0,o=Object.keys(n.tokenStack);!function i(l){for(var s=0;s=o.length);s++){var u=l[s];if("string"==typeof u||u.content&&"string"==typeof u.content){var c=o[a],d=n.tokenStack[c],f="string"==typeof u?u:u.content,p=t(r,c),m=f.indexOf(p);if(m>-1){++a;var h=f.substring(0,m),g=new e.Token(r,e.tokenize(d,n.grammar),"language-"+r,d),v=f.substring(m+p.length),b=[];h&&b.push.apply(b,i([h])),b.push(g),v&&b.push.apply(b,i([v])),"string"==typeof u?l.splice.apply(l,[s,1].concat(b)):u.content=b}}else u.content&&i(u.content)}return l}(n.tokens)}}}})}(a),function(e){e.languages.handlebars={comment:/\{\{![\s\S]*?\}\}/,delimiter:{pattern:/^\{\{\{?|\}\}\}?$/,alias:"punctuation"},string:/(["'])(?:\\.|(?!\1)[^\\\r\n])*\1/,number:/\b0x[\dA-Fa-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:[Ee][+-]?\d+)?/,boolean:/\b(?:false|true)\b/,block:{pattern:/^(\s*(?:~\s*)?)[#\/]\S+?(?=\s*(?:~\s*)?$|\s)/,lookbehind:!0,alias:"keyword"},brackets:{pattern:/\[[^\]]+\]/,inside:{punctuation:/\[|\]/,variable:/[\s\S]+/}},punctuation:/[!"#%&':()*+,.\/;<=>@\[\\\]^`{|}~]/,variable:/[^!"#%&'()*+,\/;<=>@\[\\\]^`{|}~\s]+/},e.hooks.add("before-tokenize",(function(t){e.languages["markup-templating"].buildPlaceholders(t,"handlebars",/\{\{\{[\s\S]+?\}\}\}|\{\{[\s\S]+?\}\}/g)})),e.hooks.add("after-tokenize",(function(t){e.languages["markup-templating"].tokenizePlaceholders(t,"handlebars")})),e.languages.hbs=e.languages.handlebars}(a),a.languages.json={property:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?=\s*:)/,lookbehind:!0,greedy:!0},string:{pattern:/(^|[^\\])"(?:\\.|[^\\"\r\n])*"(?!\s*:)/,lookbehind:!0,greedy:!0},comment:{pattern:/\/\/.*|\/\*[\s\S]*?(?:\*\/|$)/,greedy:!0},number:/-?\b\d+(?:\.\d+)?(?:e[+-]?\d+)?\b/i,punctuation:/[{}[\],]/,operator:/:/,boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"}},a.languages.webmanifest=a.languages.json,a.languages.less=a.languages.extend("css",{comment:[/\/\*[\s\S]*?\*\//,{pattern:/(^|[^\\])\/\/.*/,lookbehind:!0}],atrule:{pattern:/@[\w-](?:\((?:[^(){}]|\([^(){}]*\))*\)|[^(){};\s]|\s+(?!\s))*?(?=\s*\{)/,inside:{punctuation:/[:()]/}},selector:{pattern:/(?:@\{[\w-]+\}|[^{};\s@])(?:@\{[\w-]+\}|\((?:[^(){}]|\([^(){}]*\))*\)|[^(){};@\s]|\s+(?!\s))*?(?=\s*\{)/,inside:{variable:/@+[\w-]+/}},property:/(?:@\{[\w-]+\}|[\w-])+(?:\+_?)?(?=\s*:)/,operator:/[+\-*\/]/}),a.languages.insertBefore("less","property",{variable:[{pattern:/@[\w-]+\s*:/,inside:{punctuation:/:/}},/@@?[\w-]+/],"mixin-usage":{pattern:/([{;]\s*)[.#](?!\d)[\w-].*?(?=[(;])/,lookbehind:!0,alias:"function"}}),a.languages.makefile={comment:{pattern:/(^|[^\\])#(?:\\(?:\r\n|[\s\S])|[^\\\r\n])*/,lookbehind:!0},string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"builtin-target":{pattern:/\.[A-Z][^:#=\s]+(?=\s*:(?!=))/,alias:"builtin"},target:{pattern:/^(?:[^:=\s]|[ \t]+(?![\s:]))+(?=\s*:(?!=))/m,alias:"symbol",inside:{variable:/\$+(?:(?!\$)[^(){}:#=\s]+|(?=[({]))/}},variable:/\$+(?:(?!\$)[^(){}:#=\s]+|\([@*%<^+?][DF]\)|(?=[({]))/,keyword:/-include\b|\b(?:define|else|endef|endif|export|ifn?def|ifn?eq|include|override|private|sinclude|undefine|unexport|vpath)\b/,function:{pattern:/(\()(?:abspath|addsuffix|and|basename|call|dir|error|eval|file|filter(?:-out)?|findstring|firstword|flavor|foreach|guile|if|info|join|lastword|load|notdir|or|origin|patsubst|realpath|shell|sort|strip|subst|suffix|value|warning|wildcard|word(?:list|s)?)(?=[ \t])/,lookbehind:!0},operator:/(?:::|[?:+!])?=|[|@]/,punctuation:/[:;(){}]/},a.languages.objectivec=a.languages.extend("c",{string:{pattern:/@?"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"/,greedy:!0},keyword:/\b(?:asm|auto|break|case|char|const|continue|default|do|double|else|enum|extern|float|for|goto|if|in|inline|int|long|register|return|self|short|signed|sizeof|static|struct|super|switch|typedef|typeof|union|unsigned|void|volatile|while)\b|(?:@interface|@end|@implementation|@protocol|@class|@public|@protected|@private|@property|@try|@catch|@finally|@throw|@synthesize|@dynamic|@selector)\b/,operator:/-[->]?|\+\+?|!=?|<>?=?|==?|&&?|\|\|?|[~^%?*\/@]/}),delete a.languages.objectivec["class-name"],a.languages.objc=a.languages.objectivec,a.languages.ocaml={comment:{pattern:/\(\*[\s\S]*?\*\)/,greedy:!0},char:{pattern:/'(?:[^\\\r\n']|\\(?:.|[ox]?[0-9a-f]{1,3}))'/i,greedy:!0},string:[{pattern:/"(?:\\(?:[\s\S]|\r\n)|[^\\\r\n"])*"/,greedy:!0},{pattern:/\{([a-z_]*)\|[\s\S]*?\|\1\}/,greedy:!0}],number:[/\b(?:0b[01][01_]*|0o[0-7][0-7_]*)\b/i,/\b0x[a-f0-9][a-f0-9_]*(?:\.[a-f0-9_]*)?(?:p[+-]?\d[\d_]*)?(?!\w)/i,/\b\d[\d_]*(?:\.[\d_]*)?(?:e[+-]?\d[\d_]*)?(?!\w)/i],directive:{pattern:/\B#\w+/,alias:"property"},label:{pattern:/\B~\w+/,alias:"property"},"type-variable":{pattern:/\B'\w+/,alias:"function"},variant:{pattern:/`\w+/,alias:"symbol"},keyword:/\b(?:as|assert|begin|class|constraint|do|done|downto|else|end|exception|external|for|fun|function|functor|if|in|include|inherit|initializer|lazy|let|match|method|module|mutable|new|nonrec|object|of|open|private|rec|sig|struct|then|to|try|type|val|value|virtual|when|where|while|with)\b/,boolean:/\b(?:false|true)\b/,"operator-like-punctuation":{pattern:/\[[<>|]|[>|]\]|\{<|>\}/,alias:"punctuation"},operator:/\.[.~]|:[=>]|[=<>@^|&+\-*\/$%!?~][!$%&*+\-.\/:<=>?@^|~]*|\b(?:and|asr|land|lor|lsl|lsr|lxor|mod|or)\b/,punctuation:/;;|::|[(){}\[\].,:;#]|\b_\b/},a.languages.python={comment:{pattern:/(^|[^\\])#.*/,lookbehind:!0,greedy:!0},"string-interpolation":{pattern:/(?:f|fr|rf)(?:("""|''')[\s\S]*?\1|("|')(?:\\.|(?!\2)[^\\\r\n])*\2)/i,greedy:!0,inside:{interpolation:{pattern:/((?:^|[^{])(?:\{\{)*)\{(?!\{)(?:[^{}]|\{(?!\{)(?:[^{}]|\{(?!\{)(?:[^{}])+\})+\})+\}/,lookbehind:!0,inside:{"format-spec":{pattern:/(:)[^:(){}]+(?=\}$)/,lookbehind:!0},"conversion-option":{pattern:/![sra](?=[:}]$)/,alias:"punctuation"},rest:null}},string:/[\s\S]+/}},"triple-quoted-string":{pattern:/(?:[rub]|br|rb)?("""|''')[\s\S]*?\1/i,greedy:!0,alias:"string"},string:{pattern:/(?:[rub]|br|rb)?("|')(?:\\.|(?!\1)[^\\\r\n])*\1/i,greedy:!0},function:{pattern:/((?:^|\s)def[ \t]+)[a-zA-Z_]\w*(?=\s*\()/g,lookbehind:!0},"class-name":{pattern:/(\bclass\s+)\w+/i,lookbehind:!0},decorator:{pattern:/(^[\t ]*)@\w+(?:\.\w+)*/m,lookbehind:!0,alias:["annotation","punctuation"],inside:{punctuation:/\./}},keyword:/\b(?:_(?=\s*:)|and|as|assert|async|await|break|case|class|continue|def|del|elif|else|except|exec|finally|for|from|global|if|import|in|is|lambda|match|nonlocal|not|or|pass|print|raise|return|try|while|with|yield)\b/,builtin:/\b(?:__import__|abs|all|any|apply|ascii|basestring|bin|bool|buffer|bytearray|bytes|callable|chr|classmethod|cmp|coerce|compile|complex|delattr|dict|dir|divmod|enumerate|eval|execfile|file|filter|float|format|frozenset|getattr|globals|hasattr|hash|help|hex|id|input|int|intern|isinstance|issubclass|iter|len|list|locals|long|map|max|memoryview|min|next|object|oct|open|ord|pow|property|range|raw_input|reduce|reload|repr|reversed|round|set|setattr|slice|sorted|staticmethod|str|sum|super|tuple|type|unichr|unicode|vars|xrange|zip)\b/,boolean:/\b(?:False|None|True)\b/,number:/\b0(?:b(?:_?[01])+|o(?:_?[0-7])+|x(?:_?[a-f0-9])+)\b|(?:\b\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\B\.\d+(?:_\d+)*)(?:e[+-]?\d+(?:_\d+)*)?j?(?!\w)/i,operator:/[-+%=]=?|!=|:=|\*\*?=?|\/\/?=?|<[<=>]?|>[=>]?|[&|^~]/,punctuation:/[{}[\];(),.:]/},a.languages.python["string-interpolation"].inside.interpolation.inside.rest=a.languages.python,a.languages.py=a.languages.python,a.languages.reason=a.languages.extend("clike",{string:{pattern:/"(?:\\(?:\r\n|[\s\S])|[^\\\r\n"])*"/,greedy:!0},"class-name":/\b[A-Z]\w*/,keyword:/\b(?:and|as|assert|begin|class|constraint|do|done|downto|else|end|exception|external|for|fun|function|functor|if|in|include|inherit|initializer|lazy|let|method|module|mutable|new|nonrec|object|of|open|or|private|rec|sig|struct|switch|then|to|try|type|val|virtual|when|while|with)\b/,operator:/\.{3}|:[:=]|\|>|->|=(?:==?|>)?|<=?|>=?|[|^?'#!~`]|[+\-*\/]\.?|\b(?:asr|land|lor|lsl|lsr|lxor|mod)\b/}),a.languages.insertBefore("reason","class-name",{char:{pattern:/'(?:\\x[\da-f]{2}|\\o[0-3][0-7][0-7]|\\\d{3}|\\.|[^'\\\r\n])'/,greedy:!0},constructor:/\b[A-Z]\w*\b(?!\s*\.)/,label:{pattern:/\b[a-z]\w*(?=::)/,alias:"symbol"}}),delete a.languages.reason.function,function(e){e.languages.sass=e.languages.extend("css",{comment:{pattern:/^([ \t]*)\/[\/*].*(?:(?:\r?\n|\r)\1[ \t].+)*/m,lookbehind:!0,greedy:!0}}),e.languages.insertBefore("sass","atrule",{"atrule-line":{pattern:/^(?:[ \t]*)[@+=].+/m,greedy:!0,inside:{atrule:/(?:@[\w-]+|[+=])/}}}),delete e.languages.sass.atrule;var t=/\$[-\w]+|#\{\$[-\w]+\}/,n=[/[+*\/%]|[=!]=|<=?|>=?|\b(?:and|not|or)\b/,{pattern:/(\s)-(?=\s)/,lookbehind:!0}];e.languages.insertBefore("sass","property",{"variable-line":{pattern:/^[ \t]*\$.+/m,greedy:!0,inside:{punctuation:/:/,variable:t,operator:n}},"property-line":{pattern:/^[ \t]*(?:[^:\s]+ *:.*|:[^:\s].*)/m,greedy:!0,inside:{property:[/[^:\s]+(?=\s*:)/,{pattern:/(:)[^:\s]+/,lookbehind:!0}],punctuation:/:/,variable:t,operator:n,important:e.languages.sass.important}}}),delete e.languages.sass.property,delete e.languages.sass.important,e.languages.insertBefore("sass","punctuation",{selector:{pattern:/^([ \t]*)\S(?:,[^,\r\n]+|[^,\r\n]*)(?:,[^,\r\n]+)*(?:,(?:\r?\n|\r)\1[ \t]+\S(?:,[^,\r\n]+|[^,\r\n]*)(?:,[^,\r\n]+)*)*/m,lookbehind:!0,greedy:!0}})}(a),a.languages.scss=a.languages.extend("css",{comment:{pattern:/(^|[^\\])(?:\/\*[\s\S]*?\*\/|\/\/.*)/,lookbehind:!0},atrule:{pattern:/@[\w-](?:\([^()]+\)|[^()\s]|\s+(?!\s))*?(?=\s+[{;])/,inside:{rule:/@[\w-]+/}},url:/(?:[-a-z]+-)?url(?=\()/i,selector:{pattern:/(?=\S)[^@;{}()]?(?:[^@;{}()\s]|\s+(?!\s)|#\{\$[-\w]+\})+(?=\s*\{(?:\}|\s|[^}][^:{}]*[:{][^}]))/,inside:{parent:{pattern:/&/,alias:"important"},placeholder:/%[-\w]+/,variable:/\$[-\w]+|#\{\$[-\w]+\}/}},property:{pattern:/(?:[-\w]|\$[-\w]|#\{\$[-\w]+\})+(?=\s*:)/,inside:{variable:/\$[-\w]+|#\{\$[-\w]+\}/}}}),a.languages.insertBefore("scss","atrule",{keyword:[/@(?:content|debug|each|else(?: if)?|extend|for|forward|function|if|import|include|mixin|return|use|warn|while)\b/i,{pattern:/( )(?:from|through)(?= )/,lookbehind:!0}]}),a.languages.insertBefore("scss","important",{variable:/\$[-\w]+|#\{\$[-\w]+\}/}),a.languages.insertBefore("scss","function",{"module-modifier":{pattern:/\b(?:as|hide|show|with)\b/i,alias:"keyword"},placeholder:{pattern:/%[-\w]+/,alias:"selector"},statement:{pattern:/\B!(?:default|optional)\b/i,alias:"keyword"},boolean:/\b(?:false|true)\b/,null:{pattern:/\bnull\b/,alias:"keyword"},operator:{pattern:/(\s)(?:[-+*\/%]|[=!]=|<=?|>=?|and|not|or)(?=\s)/,lookbehind:!0}}),a.languages.scss.atrule.inside.rest=a.languages.scss,function(e){var t={pattern:/(\b\d+)(?:%|[a-z]+)/,lookbehind:!0},n={pattern:/(^|[^\w.-])-?(?:\d+(?:\.\d+)?|\.\d+)/,lookbehind:!0},r={comment:{pattern:/(^|[^\\])(?:\/\*[\s\S]*?\*\/|\/\/.*)/,lookbehind:!0},url:{pattern:/\burl\((["']?).*?\1\)/i,greedy:!0},string:{pattern:/("|')(?:(?!\1)[^\\\r\n]|\\(?:\r\n|[\s\S]))*\1/,greedy:!0},interpolation:null,func:null,important:/\B!(?:important|optional)\b/i,keyword:{pattern:/(^|\s+)(?:(?:else|for|if|return|unless)(?=\s|$)|@[\w-]+)/,lookbehind:!0},hexcode:/#[\da-f]{3,6}/i,color:[/\b(?:AliceBlue|AntiqueWhite|Aqua|Aquamarine|Azure|Beige|Bisque|Black|BlanchedAlmond|Blue|BlueViolet|Brown|BurlyWood|CadetBlue|Chartreuse|Chocolate|Coral|CornflowerBlue|Cornsilk|Crimson|Cyan|DarkBlue|DarkCyan|DarkGoldenRod|DarkGr[ae]y|DarkGreen|DarkKhaki|DarkMagenta|DarkOliveGreen|DarkOrange|DarkOrchid|DarkRed|DarkSalmon|DarkSeaGreen|DarkSlateBlue|DarkSlateGr[ae]y|DarkTurquoise|DarkViolet|DeepPink|DeepSkyBlue|DimGr[ae]y|DodgerBlue|FireBrick|FloralWhite|ForestGreen|Fuchsia|Gainsboro|GhostWhite|Gold|GoldenRod|Gr[ae]y|Green|GreenYellow|HoneyDew|HotPink|IndianRed|Indigo|Ivory|Khaki|Lavender|LavenderBlush|LawnGreen|LemonChiffon|LightBlue|LightCoral|LightCyan|LightGoldenRodYellow|LightGr[ae]y|LightGreen|LightPink|LightSalmon|LightSeaGreen|LightSkyBlue|LightSlateGr[ae]y|LightSteelBlue|LightYellow|Lime|LimeGreen|Linen|Magenta|Maroon|MediumAquaMarine|MediumBlue|MediumOrchid|MediumPurple|MediumSeaGreen|MediumSlateBlue|MediumSpringGreen|MediumTurquoise|MediumVioletRed|MidnightBlue|MintCream|MistyRose|Moccasin|NavajoWhite|Navy|OldLace|Olive|OliveDrab|Orange|OrangeRed|Orchid|PaleGoldenRod|PaleGreen|PaleTurquoise|PaleVioletRed|PapayaWhip|PeachPuff|Peru|Pink|Plum|PowderBlue|Purple|Red|RosyBrown|RoyalBlue|SaddleBrown|Salmon|SandyBrown|SeaGreen|SeaShell|Sienna|Silver|SkyBlue|SlateBlue|SlateGr[ae]y|Snow|SpringGreen|SteelBlue|Tan|Teal|Thistle|Tomato|Transparent|Turquoise|Violet|Wheat|White|WhiteSmoke|Yellow|YellowGreen)\b/i,{pattern:/\b(?:hsl|rgb)\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*\)\B|\b(?:hsl|rgb)a\(\s*\d{1,3}\s*,\s*\d{1,3}%?\s*,\s*\d{1,3}%?\s*,\s*(?:0|0?\.\d+|1)\s*\)\B/i,inside:{unit:t,number:n,function:/[\w-]+(?=\()/,punctuation:/[(),]/}}],entity:/\\[\da-f]{1,8}/i,unit:t,boolean:/\b(?:false|true)\b/,operator:[/~|[+!\/%<>?=]=?|[-:]=|\*[*=]?|\.{2,3}|&&|\|\||\B-\B|\b(?:and|in|is(?: a| defined| not|nt)?|not|or)\b/],number:n,punctuation:/[{}()\[\];:,]/};r.interpolation={pattern:/\{[^\r\n}:]+\}/,alias:"variable",inside:{delimiter:{pattern:/^\{|\}$/,alias:"punctuation"},rest:r}},r.func={pattern:/[\w-]+\([^)]*\).*/,inside:{function:/^[^(]+/,rest:r}},e.languages.stylus={"atrule-declaration":{pattern:/(^[ \t]*)@.+/m,lookbehind:!0,inside:{atrule:/^@[\w-]+/,rest:r}},"variable-declaration":{pattern:/(^[ \t]*)[\w$-]+\s*.?=[ \t]*(?:\{[^{}]*\}|\S.*|$)/m,lookbehind:!0,inside:{variable:/^\S+/,rest:r}},statement:{pattern:/(^[ \t]*)(?:else|for|if|return|unless)[ \t].+/m,lookbehind:!0,inside:{keyword:/^\S+/,rest:r}},"property-declaration":{pattern:/((?:^|\{)([ \t]*))(?:[\w-]|\{[^}\r\n]+\})+(?:\s*:\s*|[ \t]+)(?!\s)[^{\r\n]*(?:;|[^{\r\n,]$(?!(?:\r?\n|\r)(?:\{|\2[ \t])))/m,lookbehind:!0,inside:{property:{pattern:/^[^\s:]+/,inside:{interpolation:r.interpolation}},rest:r}},selector:{pattern:/(^[ \t]*)(?:(?=\S)(?:[^{}\r\n:()]|::?[\w-]+(?:\([^)\r\n]*\)|(?![\w-]))|\{[^}\r\n]+\})+)(?:(?:\r?\n|\r)(?:\1(?:(?=\S)(?:[^{}\r\n:()]|::?[\w-]+(?:\([^)\r\n]*\)|(?![\w-]))|\{[^}\r\n]+\})+)))*(?:,$|\{|(?=(?:\r?\n|\r)(?:\{|\1[ \t])))/m,lookbehind:!0,inside:{interpolation:r.interpolation,comment:r.comment,punctuation:/[{},]/}},func:r.func,string:r.string,comment:{pattern:/(^|[^\\])(?:\/\*[\s\S]*?\*\/|\/\/.*)/,lookbehind:!0,greedy:!0},interpolation:r.interpolation,punctuation:/[{}()\[\];:.]/}}(a),function(e){var t=e.util.clone(e.languages.typescript);e.languages.tsx=e.languages.extend("jsx",t),delete e.languages.tsx.parameter,delete e.languages.tsx["literal-property"];var n=e.languages.tsx.tag;n.pattern=RegExp(/(^|[^\w$]|(?=<\/))/.source+"(?:"+n.pattern.source+")",n.pattern.flags),n.lookbehind=!0}(a),a.languages.wasm={comment:[/\(;[\s\S]*?;\)/,{pattern:/;;.*/,greedy:!0}],string:{pattern:/"(?:\\[\s\S]|[^"\\])*"/,greedy:!0},keyword:[{pattern:/\b(?:align|offset)=/,inside:{operator:/=/}},{pattern:/\b(?:(?:f32|f64|i32|i64)(?:\.(?:abs|add|and|ceil|clz|const|convert_[su]\/i(?:32|64)|copysign|ctz|demote\/f64|div(?:_[su])?|eqz?|extend_[su]\/i32|floor|ge(?:_[su])?|gt(?:_[su])?|le(?:_[su])?|load(?:(?:8|16|32)_[su])?|lt(?:_[su])?|max|min|mul|neg?|nearest|or|popcnt|promote\/f32|reinterpret\/[fi](?:32|64)|rem_[su]|rot[lr]|shl|shr_[su]|sqrt|store(?:8|16|32)?|sub|trunc(?:_[su]\/f(?:32|64))?|wrap\/i64|xor))?|memory\.(?:grow|size))\b/,inside:{punctuation:/\./}},/\b(?:anyfunc|block|br(?:_if|_table)?|call(?:_indirect)?|data|drop|elem|else|end|export|func|get_(?:global|local)|global|if|import|local|loop|memory|module|mut|nop|offset|param|result|return|select|set_(?:global|local)|start|table|tee_local|then|type|unreachable)\b/],variable:/\$[\w!#$%&'*+\-./:<=>?@\\^`|~]+/,number:/[+-]?\b(?:\d(?:_?\d)*(?:\.\d(?:_?\d)*)?(?:[eE][+-]?\d(?:_?\d)*)?|0x[\da-fA-F](?:_?[\da-fA-F])*(?:\.[\da-fA-F](?:_?[\da-fA-D])*)?(?:[pP][+-]?\d(?:_?\d)*)?)\b|\binf\b|\bnan(?::0x[\da-fA-F](?:_?[\da-fA-D])*)?\b/,punctuation:/[()]/};const o=a},66841:()=>{Prism.languages.lua={comment:/^#!.+|--(?:\[(=*)\[[\s\S]*?\]\1\]|.*)/m,string:{pattern:/(["'])(?:(?!\1)[^\\\r\n]|\\z(?:\r\n|\s)|\\(?:\r\n|[^z]))*\1|\[(=*)\[[\s\S]*?\]\2\]/,greedy:!0},number:/\b0x[a-f\d]+(?:\.[a-f\d]*)?(?:p[+-]?\d+)?\b|\b\d+(?:\.\B|(?:\.\d*)?(?:e[+-]?\d+)?\b)|\B\.\d+(?:e[+-]?\d+)?\b/i,keyword:/\b(?:and|break|do|else|elseif|end|false|for|function|goto|if|in|local|nil|not|or|repeat|return|then|true|until|while)\b/,function:/(?!\d)\w+(?=\s*(?:[({]))/,operator:[/[-+*%^&|#]|\/\/?|<[<=]?|>[>=]?|[=~]=?/,{pattern:/(^|[^.])\.\.(?!\.)/,lookbehind:!0}],punctuation:/[\[\](){},;]|\.+|:+/}},33003:(e,t,n)=>{var r={"./prism-lua":66841};function a(e){var t=o(e);return n(t)}function o(e){if(!n.o(r,e)){var t=new Error("Cannot find module '"+e+"'");throw t.code="MODULE_NOT_FOUND",t}return r[e]}a.keys=function(){return Object.keys(r)},a.resolve=o,e.exports=a,a.id=33003},92703:(e,t,n)=>{"use strict";var r=n(50414);function a(){}function o(){}o.resetWarningCache=a,e.exports=function(){function e(e,t,n,a,o,i){if(i!==r){var l=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw l.name="Invariant Violation",l}}function t(){return e}e.isRequired=e;var n={array:e,bigint:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,elementType:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t,checkPropTypes:o,resetWarningCache:a};return n.PropTypes=n,n}},45697:(e,t,n)=>{e.exports=n(92703)()},50414:e=>{"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},64448:(e,t,n)=>{"use strict";var r=n(67294),a=n(27418),o=n(63840);function i(e){for(var t="https://reactjs.org/docs/error-decoder.html?invariant="+e,n=1;n