@preply/ds-ai-cli 11.2.0 → 11.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bin.js +35 -27
- package/package.json +3 -3
package/dist/bin.js
CHANGED
|
@@ -13,7 +13,7 @@ var __require = /* @__PURE__ */ createRequire(import.meta.url);
|
|
|
13
13
|
var package_default = {
|
|
14
14
|
name: "@preply/ds-ai-cli",
|
|
15
15
|
description: "CLI for querying the Preply Design System",
|
|
16
|
-
version: "11.
|
|
16
|
+
version: "11.4.0",
|
|
17
17
|
publishConfig: { "access": "public" },
|
|
18
18
|
type: "module",
|
|
19
19
|
bin: { "ds-ai": "./dist/bin.js" },
|
|
@@ -6588,6 +6588,10 @@ var gi = re([
|
|
|
6588
6588
|
web: "TokyoUISoundOff",
|
|
6589
6589
|
"react-native": "SoundOff"
|
|
6590
6590
|
},
|
|
6591
|
+
{
|
|
6592
|
+
web: "TokyoUISoundWave",
|
|
6593
|
+
"react-native": "SoundWave"
|
|
6594
|
+
},
|
|
6591
6595
|
{
|
|
6592
6596
|
web: "TokyoUISparkle",
|
|
6593
6597
|
"react-native": "Sparkle"
|
|
@@ -6620,6 +6624,10 @@ var gi = re([
|
|
|
6620
6624
|
web: "TokyoUISpeaksFace",
|
|
6621
6625
|
"react-native": "SpeaksFace"
|
|
6622
6626
|
},
|
|
6627
|
+
{
|
|
6628
|
+
web: "TokyoUIStamp",
|
|
6629
|
+
"react-native": "Stamp"
|
|
6630
|
+
},
|
|
6623
6631
|
{
|
|
6624
6632
|
web: "TokyoUIStar",
|
|
6625
6633
|
"react-native": "Star"
|
|
@@ -34311,7 +34319,7 @@ var Ni = de({
|
|
|
34311
34319
|
import: "import { AccordionItem } from '@preply/ds-web-lib';",
|
|
34312
34320
|
description: "A single `Accordion` item, the wrapper of AccordionHeader and AccordionContent."
|
|
34313
34321
|
},
|
|
34314
|
-
docs: "# AccordionItem\n\n```\nimport { AccordionItem } from '@preply/ds-web-lib';\n```\n\nA single `Accordion` item, the wrapper of AccordionHeader and AccordionContent.\n\n## Props\n\n### `aria-label`\n\n- Type: `string | undefined`\n\nDefines a string value that labels the current element.\n\n@see\n\naria-labelledby.\n\n### `open`\n\n- Type: `boolean | undefined`\n\n### `aria-labelledby`\n\n- Type: `string | undefined`\n\nIdentifies the element (or elements) that labels the current element.\n\n@see\n\naria-describedby.\n\n### `aria-describedby`\n\n- Type: `string | undefined`\n\nIdentifies the element (or elements) that describes the object.\n\n@see\n\naria-labelledby\n\n### `onOpenChange`\n\n- Type: `((open: boolean) => void) | undefined`\n\nCalled whenever the users open/close the Accordion item (mapped to the internal HTML Details's\n`toggle` event).\n\n### `name`\n\n- Type: `string | undefined`\n\nAllows to create exclusive Accordions. Just pass the same `name` to all the AccordionItem\ninstances to make the whole Accordion exclusive.\n\n@example\n\n```\n<Accordion>\n <AccordionItem name=\"choose-subscription-duration\">\n <AccordionHeader>\n Two-week subscription\n </AccordionHeader>\n <AccordionContent>We will charge you every two weeks.</AccordionContent>\n </AccordionItem>\n <AccordionItem name=\"choose-subscription-duration\">\n <AccordionHeader>\n Four-week subscription\n </AccordionHeader>\n <AccordionContent>We will charge you every four weeks.</AccordionContent>\n </AccordionItem>\n</Accordion>\n```\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\nSets data attributes on the DOM element.\n\n@example\n\n```\n<AccordionItem dataset={{ 'qa-id': 'best-tutor-platform' }} /> // will add data-qa-id=\"best-tutor-platform\" to the HTML element.\n```\n\n### `
|
|
34322
|
+
docs: "# AccordionItem\n\n```\nimport { AccordionItem } from '@preply/ds-web-lib';\n```\n\nA single `Accordion` item, the wrapper of AccordionHeader and AccordionContent.\n\n## Props\n\n### `aria-label`\n\n- Type: `string | undefined`\n\nDefines a string value that labels the current element.\n\n@see\n\naria-labelledby.\n\n### `open`\n\n- Type: `boolean | undefined`\n\n### `aria-labelledby`\n\n- Type: `string | undefined`\n\nIdentifies the element (or elements) that labels the current element.\n\n@see\n\naria-describedby.\n\n### `aria-describedby`\n\n- Type: `string | undefined`\n\nIdentifies the element (or elements) that describes the object.\n\n@see\n\naria-labelledby\n\n### `onOpenChange`\n\n- Type: `((open: boolean) => void) | undefined`\n\nCalled whenever the users open/close the Accordion item (mapped to the internal HTML Details's\n`toggle` event).\n\n### `name`\n\n- Type: `string | undefined`\n\nAllows to create exclusive Accordions. Just pass the same `name` to all the AccordionItem\ninstances to make the whole Accordion exclusive.\n\n@example\n\n```\n<Accordion>\n <AccordionItem name=\"choose-subscription-duration\">\n <AccordionHeader>\n Two-week subscription\n </AccordionHeader>\n <AccordionContent>We will charge you every two weeks.</AccordionContent>\n </AccordionItem>\n <AccordionItem name=\"choose-subscription-duration\">\n <AccordionHeader>\n Four-week subscription\n </AccordionHeader>\n <AccordionContent>We will charge you every four weeks.</AccordionContent>\n </AccordionItem>\n</Accordion>\n```\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\nSets data attributes on the DOM element.\n\n@example\n\n```\n<AccordionItem dataset={{ 'qa-id': 'best-tutor-platform' }} /> // will add data-qa-id=\"best-tutor-platform\" to the HTML element.\n```\n\n### `ref`\n\n- Type: `LegacyRef<HTMLDetailsElement> | undefined`\n- Detailed type: `undefined | null | string | (instance: HTMLDetailsElement | null) => void | RefObject<HTMLDetailsElement>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
34315
34323
|
},
|
|
34316
34324
|
AccordionHeader: {
|
|
34317
34325
|
meta: {
|
|
@@ -34359,7 +34367,7 @@ var Ni = de({
|
|
|
34359
34367
|
import: "import { AlertBannerAction } from '@preply/ds-web-lib';",
|
|
34360
34368
|
description: "The AlertBannerAction is a container that sets defaults when Button or IconButton are passed."
|
|
34361
34369
|
},
|
|
34362
|
-
docs: "# AlertBannerAction\n\n```\nimport { AlertBannerAction } from '@preply/ds-web-lib';\n```\n\nThe AlertBannerAction is a container that sets defaults when Button or IconButton are passed.\n\n@example\n\n```\n<AlertBannerAction className={myCustomStyle}>\n <Button {...} />\n</AlertBannerAction>\n\nIf you want the default action but need to pass your own props to it, you\ncan use the `DefaultAlertBannerAction` component.\n<AlertBannerAction>\n <Button\n leadingSvgIcon={MyCustomIcon}\n >\n My custom text\n </Button\n</AlertBannerAction>\n```\n\n@see\n\nButton *\nIconButton\n\n## Props\n\n### `id`\n\n- Type: `string | undefined`\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `
|
|
34370
|
+
docs: "# AlertBannerAction\n\n```\nimport { AlertBannerAction } from '@preply/ds-web-lib';\n```\n\nThe AlertBannerAction is a container that sets defaults when Button or IconButton are passed.\n\n@example\n\n```\n<AlertBannerAction className={myCustomStyle}>\n <Button {...} />\n</AlertBannerAction>\n\nIf you want the default action but need to pass your own props to it, you\ncan use the `DefaultAlertBannerAction` component.\n<AlertBannerAction>\n <Button\n leadingSvgIcon={MyCustomIcon}\n >\n My custom text\n </Button\n</AlertBannerAction>\n```\n\n@see\n\nButton *\nIconButton\n\n## Props\n\n### `id`\n\n- Type: `string | undefined`\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `onClick`\n\n- Type: `MouseEventHandler | undefined`\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`\n\n### `variant`\n\n- Type: `ButtonVariant | undefined`\n- Detailed type: `undefined | \"critical\" | \"primary\" | \"secondary\" | \"tertiary\" | \"quaternary\" | \"ghost\" | \"onColor\" | \"classroom\" | \"primaryB2b\" | \"primaryTutor\" | \"inverted\" | \"newFeature\" | \"ai\"`\n\n### `size`\n\n- Type: `Responsive<ButtonSize> | undefined`\n- Detailed type: `undefined | \"large\" | \"medium\" | \"small\" | ResponsiveProp<ButtonSize>`\n\n### `fullWidth`\n\n- Type: `Responsive<boolean> | undefined`\n- Detailed type: `undefined | false | true | ResponsiveProp<boolean>`\n\n### `wrap`\n\n- Type: `boolean | undefined`\n\n### `href`\n\n- Type: `string | undefined`\n\n### `download`\n\n- Type: `boolean | undefined`\n\n### `opensInNewTab`\n\n- Type: `boolean | undefined`\n\n### `nofollow`\n\n- Type: `boolean | undefined`\n\n### `submitsForm`\n\n- Type: `boolean | undefined`\n\n### `assistiveText`\n\n- Type: `string | undefined`\n\n### `onKeyDown`\n\n- Type: `KeyboardEventHandler | undefined`\n\n### `onKeyUp`\n\n- Type: `KeyboardEventHandler | undefined`\n\n### `onMouseDown`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onMouseUp`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onMouseEnter`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onMouseMove`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onPointerDown`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onPointerEnter`\n\n- Type: `MouseEventHandler | undefined`\n\n### `disabled`\n\n- Type: `boolean | undefined`\n\n### `busy`\n\n- Type: `boolean | undefined`\n\nReplaces the content with a loading indicator.\n\n### `selected`\n\n- Type: `boolean | undefined`\n\nUsed only for classroom and ghost variants\n\n### `as`\n\n- Type: `ReactElement<any, string | JSXElementConstructor<any>> | undefined`\n- Detailed type: `undefined | ReactElement<any, string | JSXElementConstructor<any>>`\n\nCustom element to render the button.\n\nAllows rendering the button using a different React element or component.\nThis is particularly useful for integrating with router libraries like `react-router` or `next/router`.\n\n@example\n\n```\n// Render as a react router link component\nimport { Link } from 'react-router-dom';\n\n<ButtonBase as={<Link to=\"/home\" />} />\n```\n\n### `url`\n\n- Type: `string | undefined`\n\n@deprecated\n\nUse `href` instead\n\n### `a11yLabel`\n\n- Type: `string | undefined`\n\n@deprecated\n\nUse `assistiveText` instead\n\n### `dsInternalSimulation`\n\n- Type: `\"hover\" | \"focus\" | \"active\" | undefined`\n\n@deprecated\n\nThis is meant for internal DS usage only. Do not use it in your code.\n\n@ignore\n\n### `leadingSvgIcon`\n\n- Type: `SvgComponentOrElement | undefined`\n- Detailed type: `undefined | ComponentClass<SVGAttributes<SVGElement>, any> | FunctionComponent<SVGAttributes<SVGElement>> | ReactElement<any, string | JSXElementConstructor<any>>`\n\nThe leading SVG icon.\n\n@example\n\n```\nimport TokyoUITag from '@preply/ds-media-icons/dist/24/TokyoUITag.svg';\n\n<Button leadingSvgIcon={TokyoUITag}>Button</Button>\nor\n<Button leadingSvgIcon={<TokyoUITag />}>Button</Button>\n```\n\n### `trailingSvgIcon`\n\n- Type: `SvgComponentOrElement | undefined`\n- Detailed type: `undefined | ComponentClass<SVGAttributes<SVGElement>, any> | FunctionComponent<SVGAttributes<SVGElement>> | ReactElement<any, string | JSXElementConstructor<any>>`\n\nThe trailing SVG icon.\n\n@example\n\n```\nimport TokyoUITag from '@preply/ds-media-icons/dist/24/TokyoUITag.svg';\n\n<Button trailingSvgIcon={TokyoUITag}>Button</Button>\nor\n<Button trailingSvgIcon={<TokyoUITag />}>Button</Button>\n```\n\n### `className`\n\n- Type: `string | undefined`\n\n### `ref`\n\n- Type: `LegacyRef<HTMLButtonElement> | undefined`\n- Detailed type: `undefined | null | string | (instance: HTMLButtonElement | null) => void | RefObject<HTMLButtonElement>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}"
|
|
34363
34371
|
},
|
|
34364
34372
|
AlertBannerIcon: {
|
|
34365
34373
|
meta: {
|
|
@@ -34455,7 +34463,7 @@ var Ni = de({
|
|
|
34455
34463
|
import: "import { Button } from '@preply/ds-web-lib';",
|
|
34456
34464
|
description: ""
|
|
34457
34465
|
},
|
|
34458
|
-
docs: "# Button\n\n```\nimport { Button } from '@preply/ds-web-lib';\n```\n\n## Props\n\n### `id`\n\n- Type: `string | undefined`\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `
|
|
34466
|
+
docs: "# Button\n\n```\nimport { Button } from '@preply/ds-web-lib';\n```\n\n## Props\n\n### `id`\n\n- Type: `string | undefined`\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `onClick`\n\n- Type: `MouseEventHandler | undefined`\n\n### `variant`\n\n- Type: `ButtonVariant | undefined`\n- Detailed type: `undefined | \"critical\" | \"primary\" | \"secondary\" | \"tertiary\" | \"quaternary\" | \"ghost\" | \"onColor\" | \"classroom\" | \"primaryB2b\" | \"primaryTutor\" | \"inverted\" | \"newFeature\" | \"ai\"`\n- Default value: `primary`\n\n### `size`\n\n- Type: `Responsive<ButtonSize> | undefined`\n- Detailed type: `undefined | \"large\" | \"medium\" | \"small\" | ResponsiveProp<ButtonSize>`\n- Default value: `small`\n\n### `fullWidth`\n\n- Type: `Responsive<boolean> | undefined`\n- Detailed type: `undefined | false | true | ResponsiveProp<boolean>`\n\n### `wrap`\n\n- Type: `boolean | undefined`\n\n### `href`\n\n- Type: `string | undefined`\n\n### `download`\n\n- Type: `boolean | undefined`\n\n### `opensInNewTab`\n\n- Type: `boolean | undefined`\n\n### `nofollow`\n\n- Type: `boolean | undefined`\n\n### `submitsForm`\n\n- Type: `boolean | undefined`\n\n### `assistiveText`\n\n- Type: `string | undefined`\n\n### `onKeyDown`\n\n- Type: `KeyboardEventHandler | undefined`\n\n### `onKeyUp`\n\n- Type: `KeyboardEventHandler | undefined`\n\n### `onMouseDown`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onMouseUp`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onMouseEnter`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onMouseMove`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onPointerDown`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onPointerEnter`\n\n- Type: `MouseEventHandler | undefined`\n\n### `disabled`\n\n- Type: `boolean | undefined`\n\n### `busy`\n\n- Type: `boolean | undefined`\n\nReplaces the content with a loading indicator.\n\n### `selected`\n\n- Type: `boolean | undefined`\n\nUsed only for classroom and ghost variants\n\n### `as`\n\n- Type: `ReactElement<any, string | JSXElementConstructor<any>> | undefined`\n- Detailed type: `undefined | ReactElement<any, string | JSXElementConstructor<any>>`\n\nCustom element to render the button.\n\nAllows rendering the button using a different React element or component.\nThis is particularly useful for integrating with router libraries like `react-router` or `next/router`.\n\n@example\n\n```\n// Render as a react router link component\nimport { Link } from 'react-router-dom';\n\n<ButtonBase as={<Link to=\"/home\" />} />\n```\n\n### `url`\n\n- Type: `string | undefined`\n\n@deprecated\n\nUse `href` instead\n\n### `a11yLabel`\n\n- Type: `string | undefined`\n\n@deprecated\n\nUse `assistiveText` instead\n\n### `dsInternalSimulation`\n\n- Type: `\"hover\" | \"focus\" | \"active\" | undefined`\n\n@deprecated\n\nThis is meant for internal DS usage only. Do not use it in your code.\n\n@ignore\n\n### `leadingSvgIcon`\n\n- Type: `SvgComponentOrElement | undefined`\n- Detailed type: `undefined | ComponentClass<SVGAttributes<SVGElement>, any> | FunctionComponent<SVGAttributes<SVGElement>> | ReactElement<any, string | JSXElementConstructor<any>>`\n\nThe leading SVG icon.\n\n@example\n\n```\nimport TokyoUITag from '@preply/ds-media-icons/dist/24/TokyoUITag.svg';\n\n<Button leadingSvgIcon={TokyoUITag}>Button</Button>\nor\n<Button leadingSvgIcon={<TokyoUITag />}>Button</Button>\n```\n\n### `trailingSvgIcon`\n\n- Type: `SvgComponentOrElement | undefined`\n- Detailed type: `undefined | ComponentClass<SVGAttributes<SVGElement>, any> | FunctionComponent<SVGAttributes<SVGElement>> | ReactElement<any, string | JSXElementConstructor<any>>`\n\nThe trailing SVG icon.\n\n@example\n\n```\nimport TokyoUITag from '@preply/ds-media-icons/dist/24/TokyoUITag.svg';\n\n<Button trailingSvgIcon={TokyoUITag}>Button</Button>\nor\n<Button trailingSvgIcon={<TokyoUITag />}>Button</Button>\n```\n\n### `ref`\n\n- Type: `LegacyRef<HTMLAnchorElement | HTMLButtonElement> | undefined`\n- Detailed type: `undefined | null | string | (instance: HTMLAnchorElement | HTMLButtonElement | null) => void | RefObject<HTMLAnchorElement | HTMLButtonElement>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
34459
34467
|
},
|
|
34460
34468
|
CalloutBanner: {
|
|
34461
34469
|
meta: {
|
|
@@ -34535,7 +34543,7 @@ var Ni = de({
|
|
|
34535
34543
|
import: "import { Checkbox } from '@preply/ds-web-lib';",
|
|
34536
34544
|
description: "To make this accessible, you must label it using a `<label>` or `aria-label`:"
|
|
34537
34545
|
},
|
|
34538
|
-
docs: "# Checkbox\n\n```\nimport { Checkbox } from '@preply/ds-web-lib';\n```\n\nTo make this accessible, you must label it using a `<label>` or `aria-label`:\n\n@example\n\n```\nUsing `<label>` parent\n<label>\nSetting:\n<Checkbox />\n</label>\nUsing `<label>` sibling\n<label id=\"setting-label\">Setting:</label>\n<Checkbox aria-labelledby=\"setting-label\" />\nUsing `aria-label`\n<Checkbox aria-label=\"Setting\" />\n\nIt is uncontrolled by default, and can be manually controlled via the `checked` prop.\n```\n\n## Props\n\n### `id`\n\n- Type: `string | undefined`\n\n### `aria-label`\n\n- Type: `string | undefined`\n\nDefines a string value that labels the current element.\n\n@see\n\naria-labelledby.\n\n### `aria-labelledby`\n\n- Type: `string | undefined`\n\nIdentifies the element (or elements) that labels the current element.\n\n@see\n\naria-describedby.\n\n### `aria-describedby`\n\n- Type: `string | undefined`\n\nIdentifies the element (or elements) that describes the object.\n\n@see\n\naria-labelledby\n\n### `name`\n\n- Type: `string | undefined`\n\n### `disabled`\n\n- Type: `boolean | undefined`\n\n### `defaultChecked`\n\n- Type: `boolean | undefined`\n\n### `onFocus`\n\n- Type: `FocusEventHandler<HTMLInputElement> | undefined`\n\n### `onBlur`\n\n- Type: `FocusEventHandler<HTMLInputElement> | undefined`\n\n### `onChange`\n\n- Type: `ChangeEventHandler<HTMLInputElement> | undefined`\n\n### `checked`\n\n- Type: `boolean | undefined`\n\n### `required`\n\n- Type: `boolean | undefined`\n\n### `hasError`\n\n- Type: `boolean | undefined`\n\nShows the component's error state, and sets `aria-invalid=\"true\"` on the input element.\n\n### `indeterminate`\n\n- Type: `boolean | undefined`\n\nMakes the component look indeterminate. Please note that the indeterminate state is parallel\nto che checked/unchecked state, meaning that a checkbox can be checked and indeterminate at\nthe same time. it's up to you to handle the logic of when to set this prop.\n\nIf you're implementing a tri-state checkbox group, pleas refer to the\n{@link https://www.w3.org/WAI/ARIA/apg/patterns/checkbox/ARIA Checkbox Pattern}.\n\n### `onCheckedChange`\n\n- Type: `((checked: boolean) => void) | undefined`\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\nSets data attributes on the DOM element.\n\n@example\n\n```\n<Checkbox dataset={{ 'qa-id': 'accept-conditions' }} /> // will add data-qa-id=\"accept-conditions\" to the HTML element\n```\n\n### `
|
|
34546
|
+
docs: "# Checkbox\n\n```\nimport { Checkbox } from '@preply/ds-web-lib';\n```\n\nTo make this accessible, you must label it using a `<label>` or `aria-label`:\n\n@example\n\n```\nUsing `<label>` parent\n<label>\nSetting:\n<Checkbox />\n</label>\nUsing `<label>` sibling\n<label id=\"setting-label\">Setting:</label>\n<Checkbox aria-labelledby=\"setting-label\" />\nUsing `aria-label`\n<Checkbox aria-label=\"Setting\" />\n\nIt is uncontrolled by default, and can be manually controlled via the `checked` prop.\n```\n\n## Props\n\n### `id`\n\n- Type: `string | undefined`\n\n### `aria-label`\n\n- Type: `string | undefined`\n\nDefines a string value that labels the current element.\n\n@see\n\naria-labelledby.\n\n### `aria-labelledby`\n\n- Type: `string | undefined`\n\nIdentifies the element (or elements) that labels the current element.\n\n@see\n\naria-describedby.\n\n### `aria-describedby`\n\n- Type: `string | undefined`\n\nIdentifies the element (or elements) that describes the object.\n\n@see\n\naria-labelledby\n\n### `name`\n\n- Type: `string | undefined`\n\n### `disabled`\n\n- Type: `boolean | undefined`\n\n### `defaultChecked`\n\n- Type: `boolean | undefined`\n\n### `onFocus`\n\n- Type: `FocusEventHandler<HTMLInputElement> | undefined`\n\n### `onBlur`\n\n- Type: `FocusEventHandler<HTMLInputElement> | undefined`\n\n### `onChange`\n\n- Type: `ChangeEventHandler<HTMLInputElement> | undefined`\n\n### `checked`\n\n- Type: `boolean | undefined`\n\n### `required`\n\n- Type: `boolean | undefined`\n\n### `hasError`\n\n- Type: `boolean | undefined`\n\nShows the component's error state, and sets `aria-invalid=\"true\"` on the input element.\n\n### `indeterminate`\n\n- Type: `boolean | undefined`\n\nMakes the component look indeterminate. Please note that the indeterminate state is parallel\nto che checked/unchecked state, meaning that a checkbox can be checked and indeterminate at\nthe same time. it's up to you to handle the logic of when to set this prop.\n\nIf you're implementing a tri-state checkbox group, pleas refer to the\n{@link https://www.w3.org/WAI/ARIA/apg/patterns/checkbox/ARIA Checkbox Pattern}.\n\n### `onCheckedChange`\n\n- Type: `((checked: boolean) => void) | undefined`\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\nSets data attributes on the DOM element.\n\n@example\n\n```\n<Checkbox dataset={{ 'qa-id': 'accept-conditions' }} /> // will add data-qa-id=\"accept-conditions\" to the HTML element\n```\n\n### `ref`\n\n- Type: `LegacyRef<HTMLInputElement> | undefined`\n- Detailed type: `undefined | null | string | (instance: HTMLInputElement | null) => void | RefObject<HTMLInputElement>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
34539
34547
|
},
|
|
34540
34548
|
SingleSelectChips: {
|
|
34541
34549
|
meta: {
|
|
@@ -34543,7 +34551,7 @@ var Ni = de({
|
|
|
34543
34551
|
import: "import { SingleSelectChips } from '@preply/ds-web-lib';",
|
|
34544
34552
|
description: "A chips component that allows selection of a single option from a group.\nUsers can select one chip at a time, and clicking a selected chip will deselect it."
|
|
34545
34553
|
},
|
|
34546
|
-
docs: "# SingleSelectChips\n\n```\nimport { SingleSelectChips } from '@preply/ds-web-lib';\n```\n\nA chips component that allows selection of a single option from a group.\nUsers can select one chip at a time, and clicking a selected chip will deselect it.\n\n@remarks\n\n**Keyboard interactions:**\n- **Tab** to enter/exit the component (uses [roving tabindex pattern](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex))\n- **Arrow keys** to navigate between chips within the group\n- **Space/Enter** to select/deselect the focused chip\n\n@example\n\n````\n```tsx\n<SingleSelectChips aria-label=\"Choose a skill\" defaultValue=\"vocabulary\">\n <SingleSelectChipsItem value=\"vocabulary\">Vocabulary</SingleSelectChipsItem>\n <SingleSelectChipsItem value=\"speaking\">Speaking</SingleSelectChipsItem>\n <SingleSelectChipsItem value=\"listening\">Listening</SingleSelectChipsItem>\n</SingleSelectChips>\n```\n````\n\n## Props\n\n### `aria-label`\n\n- Type: `string`\n- Required\n\nAccessible label for the chips group. Required for screen reader users\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`\n\n### `defaultValue`\n\n- Type: `string | null | undefined`\n\nDefault value for uncontrolled usage. Will be ignored if `value` is provided\n\n### `aria-controls`\n\n- Type: `string | undefined`\n\nIf the chips control other elements on the page, use `aria-controls` with the target element's ID.\n\n### `value`\n\n- Type: `string | null | undefined`\n\nCurrent value of the chips. When provided, the component operates in controlled mode\n\n### `onValueChange`\n\n- Type: `((value: T | null) => void) | undefined`\n- Detailed type: `undefined | (value: T | null) => void`\n\nCallback fired when the value changes. Receives the new value as an argument\n\n### `orientation`\n\n- Type: `Orientation | undefined`\n- Detailed type: `undefined | \"horizontal\" | \"vertical\"`\n- Default value: `'horizontal'`\n\nLayout orientation of the chips group.\n\n### `items`\n\n- Type: `(Omit<ChipsItemProps, \"
|
|
34554
|
+
docs: "# SingleSelectChips\n\n```\nimport { SingleSelectChips } from '@preply/ds-web-lib';\n```\n\nA chips component that allows selection of a single option from a group.\nUsers can select one chip at a time, and clicking a selected chip will deselect it.\n\n@remarks\n\n**Keyboard interactions:**\n- **Tab** to enter/exit the component (uses [roving tabindex pattern](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex))\n- **Arrow keys** to navigate between chips within the group\n- **Space/Enter** to select/deselect the focused chip\n\n@example\n\n````\n```tsx\n<SingleSelectChips aria-label=\"Choose a skill\" defaultValue=\"vocabulary\">\n <SingleSelectChipsItem value=\"vocabulary\">Vocabulary</SingleSelectChipsItem>\n <SingleSelectChipsItem value=\"speaking\">Speaking</SingleSelectChipsItem>\n <SingleSelectChipsItem value=\"listening\">Listening</SingleSelectChipsItem>\n</SingleSelectChips>\n```\n````\n\n## Props\n\n### `aria-label`\n\n- Type: `string`\n- Required\n\nAccessible label for the chips group. Required for screen reader users\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`\n\n### `defaultValue`\n\n- Type: `string | null | undefined`\n\nDefault value for uncontrolled usage. Will be ignored if `value` is provided\n\n### `aria-controls`\n\n- Type: `string | undefined`\n\nIf the chips control other elements on the page, use `aria-controls` with the target element's ID.\n\n### `value`\n\n- Type: `string | null | undefined`\n\nCurrent value of the chips. When provided, the component operates in controlled mode\n\n### `onValueChange`\n\n- Type: `((value: T | null) => void) | undefined`\n- Detailed type: `undefined | (value: T | null) => void`\n\nCallback fired when the value changes. Receives the new value as an argument\n\n### `orientation`\n\n- Type: `Orientation | undefined`\n- Detailed type: `undefined | \"horizontal\" | \"vertical\"`\n- Default value: `'horizontal'`\n\nLayout orientation of the chips group.\n\n### `items`\n\n- Type: `(Omit<ChipsItemProps, \"children\" | \"value\"> & { value: T extends unknown[] ? NonNullable<T[number]> : NonNullable<T>; label: ReactNode; })[] | undefined`\n- Detailed type: `undefined | (Omit<ChipsItemProps, \"children\" | \"value\"> & { value: T extends unknown[] ? NonNullable<T[number]> : NonNullable<T>; label: ReactNode; })[]`\n\n### `ref`\n\n- Type: `((instance: HTMLUListElement | null) => void) | RefObject<HTMLUListElement> | null | undefined`\n- Detailed type: `undefined | null | (instance: HTMLUListElement | null) => void | RefObject<HTMLUListElement>`"
|
|
34547
34555
|
},
|
|
34548
34556
|
SingleSelectChipsItem: {
|
|
34549
34557
|
meta: {
|
|
@@ -34551,7 +34559,7 @@ var Ni = de({
|
|
|
34551
34559
|
import: "import { SingleSelectChipsItem } from '@preply/ds-web-lib';",
|
|
34552
34560
|
description: "Individual chip item for use within SingleSelectChips."
|
|
34553
34561
|
},
|
|
34554
|
-
docs: "# SingleSelectChipsItem\n\n```\nimport { SingleSelectChipsItem } from '@preply/ds-web-lib';\n```\n\nIndividual chip item for use within SingleSelectChips.\n\n@example\n\n````\n```tsx\n<SingleSelectChipsItem value=\"english\">\n English\n</SingleSelectChipsItem>\n```\n````\n\n## Props\n\n### `
|
|
34562
|
+
docs: "# SingleSelectChipsItem\n\n```\nimport { SingleSelectChipsItem } from '@preply/ds-web-lib';\n```\n\nIndividual chip item for use within SingleSelectChips.\n\n@example\n\n````\n```tsx\n<SingleSelectChipsItem value=\"english\">\n English\n</SingleSelectChipsItem>\n```\n````\n\n## Props\n\n### `disabled`\n\n- Type: `boolean | undefined`\n\n### `icon`\n\n- Type: `SvgComponentOrElement | undefined`\n- Detailed type: `undefined | ComponentClass<SVGAttributes<SVGElement>, any> | FunctionComponent<SVGAttributes<SVGElement>> | ReactElement<any, string | JSXElementConstructor<any>>`\n\n### `countryFlagCode`\n\n- Type: `\"id\" | \"as\" | \"no\" | \"is\" | \"ai\" | \"li\" | \"th\" | \"tr\" | \"td\" | \"af\" | \"ax\" | \"al\" | \"dz\" | \"ad\" | \"ao\" | \"aq\" | \"ag\" | \"ar\" | \"am\" | \"aw\" | \"sh-ac\" | \"asean\" | \"au\" | \"at\" | \"az\" | \"bs\" | ... 244 more ... | undefined`\n- Detailed type: `undefined | \"id\" | \"as\" | \"no\" | \"is\" | \"ai\" | \"li\" | \"th\" | \"tr\" | \"td\" | \"af\" | \"ax\" | \"al\" | \"dz\" | \"ad\" | \"ao\" | \"aq\" | \"ag\" | \"ar\" | \"am\" | \"aw\" | \"sh-ac\" | \"asean\" | \"au\" | \"at\" | \"az\" | \"bs\" | \"bh\" | \"bd\" | \"bb\" | \"es-pv\" | \"by\" | \"be\" | \"bz\" | \"bj\" | \"bm\" | \"bt\" | \"bo\" | \"bq\" | \"ba\" | \"bw\" | \"bv\" | \"br\" | \"io\" | \"bn\" | \"bg\" | \"bf\" | \"bi\" | \"cv\" | \"kh\" | \"cm\" | \"ca\" | \"ic\" | \"es-ct\" | \"ky\" | \"cf\" | \"cefta\" | \"cl\" | \"cn\" | \"cx\" | \"cp\" | \"cc\" | \"co\" | \"km\" | \"ck\" | \"cr\" | \"hr\" | \"cu\" | \"cw\" | \"cy\" | \"cz\" | \"ci\" | \"cd\" | \"dk\" | \"dg\" | \"dj\" | \"dm\" | \"do\" | \"eac\" | \"ec\" | \"eg\" | \"sv\" | \"gb-eng\" | \"gq\" | \"er\" | \"ee\" | \"sz\" | \"et\" | \"eu\" | \"fk\" | \"fo\" | \"fm\" | \"fj\" | \"fi\" | \"fr\" | \"gf\" | \"pf\" | \"tf\" | \"ga\" | \"es-ga\" | \"gm\" | \"ge\" | \"de\" | \"gh\" | \"gi\" | \"gr\" | \"gl\" | \"gd\" | \"gp\" | \"gu\" | \"gt\" | \"gg\" | \"gn\" | \"gw\" | \"gy\" | \"ht\" | \"hm\" | \"va\" | \"hn\" | \"hk\" | \"hu\" | \"in\" | \"ir\" | \"iq\" | \"ie\" | \"im\" | \"il\" | \"it\" | \"jm\" | \"jp\" | \"je\" | \"jo\" | \"kz\" | \"ke\" | \"ki\" | \"xk\" | \"kw\" | \"kg\" | \"la\" | \"lv\" | \"arab\" | \"lb\" | \"ls\" | \"lr\" | \"ly\" | \"lt\" | \"lu\" | \"mo\" | \"mg\" | \"mw\" | \"my\" | \"mv\" | \"ml\" | \"mt\" | \"mh\" | \"mq\" | \"mr\" | \"mu\" | \"yt\" | \"mx\" | \"md\" | \"mc\" | \"mn\" | \"me\" | \"ms\" | \"ma\" | \"mz\" | \"mm\" | \"na\" | \"nr\" | \"np\" | \"nl\" | \"nc\" | \"nz\" | \"ni\" | \"ne\" | \"ng\" | \"nu\" | \"nf\" | \"kp\" | \"mk\" | \"gb-nir\" | \"mp\" | \"om\" | \"pc\" | \"pk\" | \"pw\" | \"pa\" | \"pg\" | \"py\" | \"pe\" | \"ph\" | \"pn\" | \"pl\" | \"pt\" | \"pr\" | \"qa\" | \"cg\" | \"ro\" | \"ru\" | \"rw\" | \"re\" | \"bl\" | \"sh-hl\" | \"sh\" | \"kn\" | \"lc\" | \"mf\" | \"pm\" | \"vc\" | \"ws\" | \"sm\" | \"st\" | \"sa\" | \"gb-sct\" | \"sn\" | \"rs\" | \"sc\" | \"sl\" | \"sg\" | \"sx\" | \"sk\" | \"si\" | \"sb\" | \"so\" | \"za\" | \"gs\" | \"kr\" | \"ss\" | \"es\" | \"lk\" | \"ps\" | \"sd\" | \"sr\" | \"sj\" | \"se\" | \"ch\" | \"sy\" | \"tw\" | \"tj\" | \"tz\" | \"tl\" | \"tg\" | \"tk\" | \"to\" | \"tt\" | \"sh-ta\" | \"tn\" | \"tm\" | \"tc\" | \"tv\" | \"ug\" | \"ua\" | \"ae\" | \"gb\" | \"un\" | \"um\" | \"us\" | \"uy\" | \"uz\" | \"vu\" | \"ve\" | \"vn\" | \"vg\" | \"vi\" | \"gb-wls\" | \"wf\" | \"eh\" | \"ye\" | \"zm\" | \"zw\"`\n\n### `value`\n\n- Type: `string`\n- Required\n\nUnique identifier for this chip. Used for selection tracking\n\n### `children`\n\n- Type: `ReactNode`\n- Required\n\nContent to display inside the chip\n\n### `counter`\n\n- Type: `number | undefined`\n\nOptional numeric counter to display alongside the chip label\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `ref`\n\n- Type: `LegacyRef<HTMLButtonElement> | undefined`\n- Detailed type: `undefined | null | string | (instance: HTMLButtonElement | null) => void | RefObject<HTMLButtonElement>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
34555
34563
|
},
|
|
34556
34564
|
MultiSelectChips: {
|
|
34557
34565
|
meta: {
|
|
@@ -34559,7 +34567,7 @@ var Ni = de({
|
|
|
34559
34567
|
import: "import { MultiSelectChips } from '@preply/ds-web-lib';",
|
|
34560
34568
|
description: "A chips component that allows selection of multiple options from a group.\nUsers can select multiple chips, and clicking a selected chip will deselect it."
|
|
34561
34569
|
},
|
|
34562
|
-
docs: "# MultiSelectChips\n\n```\nimport { MultiSelectChips } from '@preply/ds-web-lib';\n```\n\nA chips component that allows selection of multiple options from a group.\nUsers can select multiple chips, and clicking a selected chip will deselect it.\n\n@remarks\n\n**Keyboard interactions:**\n- **Tab** to enter/exit the component (uses [roving tabindex pattern](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex))\n- **Arrow keys** to navigate between chips within the group\n- **Space/Enter** to toggle selection of the focused chip\n\n@example\n\n````\n```tsx\n<MultiSelectChips aria-label=\"Select skills\" defaultValue={['vocabulary', 'speaking']}>\n <MultiSelectChipsItem value=\"vocabulary\">Vocabulary</MultiSelectChipsItem>\n <MultiSelectChipsItem value=\"speaking\">Speaking</MultiSelectChipsItem>\n <MultiSelectChipsItem value=\"listening\">Listening</MultiSelectChipsItem>\n</MultiSelectChips>\n```\n````\n\n## Props\n\n### `aria-label`\n\n- Type: `string`\n- Required\n\nAccessible label for the chips group. Required for screen reader users\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`\n\n### `defaultValue`\n\n- Type: `T[] | undefined`\n\nDefault value for uncontrolled usage. Will be ignored if `value` is provided\n\n### `aria-controls`\n\n- Type: `string | undefined`\n\nIf the chips control other elements on the page, use `aria-controls` with the target element's ID.\n\n### `value`\n\n- Type: `T[] | undefined`\n\nCurrent value of the chips. When provided, the component operates in controlled mode\n\n### `onValueChange`\n\n- Type: `((value: T[]) => void) | undefined`\n\nCallback fired when the value changes. Receives the new value as an argument\n\n### `orientation`\n\n- Type: `Orientation | undefined`\n- Detailed type: `undefined | \"horizontal\" | \"vertical\"`\n- Default value: `'horizontal'`\n\nLayout orientation of the chips group.\n\n### `items`\n\n- Type: `(Omit<ChipsItemProps, \"
|
|
34570
|
+
docs: "# MultiSelectChips\n\n```\nimport { MultiSelectChips } from '@preply/ds-web-lib';\n```\n\nA chips component that allows selection of multiple options from a group.\nUsers can select multiple chips, and clicking a selected chip will deselect it.\n\n@remarks\n\n**Keyboard interactions:**\n- **Tab** to enter/exit the component (uses [roving tabindex pattern](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex))\n- **Arrow keys** to navigate between chips within the group\n- **Space/Enter** to toggle selection of the focused chip\n\n@example\n\n````\n```tsx\n<MultiSelectChips aria-label=\"Select skills\" defaultValue={['vocabulary', 'speaking']}>\n <MultiSelectChipsItem value=\"vocabulary\">Vocabulary</MultiSelectChipsItem>\n <MultiSelectChipsItem value=\"speaking\">Speaking</MultiSelectChipsItem>\n <MultiSelectChipsItem value=\"listening\">Listening</MultiSelectChipsItem>\n</MultiSelectChips>\n```\n````\n\n## Props\n\n### `aria-label`\n\n- Type: `string`\n- Required\n\nAccessible label for the chips group. Required for screen reader users\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`\n\n### `defaultValue`\n\n- Type: `T[] | undefined`\n\nDefault value for uncontrolled usage. Will be ignored if `value` is provided\n\n### `aria-controls`\n\n- Type: `string | undefined`\n\nIf the chips control other elements on the page, use `aria-controls` with the target element's ID.\n\n### `value`\n\n- Type: `T[] | undefined`\n\nCurrent value of the chips. When provided, the component operates in controlled mode\n\n### `onValueChange`\n\n- Type: `((value: T[]) => void) | undefined`\n\nCallback fired when the value changes. Receives the new value as an argument\n\n### `orientation`\n\n- Type: `Orientation | undefined`\n- Detailed type: `undefined | \"horizontal\" | \"vertical\"`\n- Default value: `'horizontal'`\n\nLayout orientation of the chips group.\n\n### `items`\n\n- Type: `(Omit<ChipsItemProps, \"children\" | \"value\"> & { value: NonNullable<T>; label: ReactNode; })[] | undefined`\n- Detailed type: `undefined | (Omit<ChipsItemProps, \"children\" | \"value\"> & { value: NonNullable<T>; label: ReactNode; })[]`\n\n### `ref`\n\n- Type: `((instance: HTMLUListElement | null) => void) | RefObject<HTMLUListElement> | null | undefined`\n- Detailed type: `undefined | null | (instance: HTMLUListElement | null) => void | RefObject<HTMLUListElement>`"
|
|
34563
34571
|
},
|
|
34564
34572
|
MultiSelectChipsItem: {
|
|
34565
34573
|
meta: {
|
|
@@ -34567,7 +34575,7 @@ var Ni = de({
|
|
|
34567
34575
|
import: "import { MultiSelectChipsItem } from '@preply/ds-web-lib';",
|
|
34568
34576
|
description: "Individual chip item for use within MultiSelectChips."
|
|
34569
34577
|
},
|
|
34570
|
-
docs: "# MultiSelectChipsItem\n\n```\nimport { MultiSelectChipsItem } from '@preply/ds-web-lib';\n```\n\nIndividual chip item for use within MultiSelectChips.\n\n@example\n\n````\n```tsx\n<MultiSelectChipsItem value=\"english\">\n English\n</MultiSelectChipsItem>\n```\n````\n\n## Props\n\n### `
|
|
34578
|
+
docs: "# MultiSelectChipsItem\n\n```\nimport { MultiSelectChipsItem } from '@preply/ds-web-lib';\n```\n\nIndividual chip item for use within MultiSelectChips.\n\n@example\n\n````\n```tsx\n<MultiSelectChipsItem value=\"english\">\n English\n</MultiSelectChipsItem>\n```\n````\n\n## Props\n\n### `disabled`\n\n- Type: `boolean | undefined`\n\n### `icon`\n\n- Type: `SvgComponentOrElement | undefined`\n- Detailed type: `undefined | ComponentClass<SVGAttributes<SVGElement>, any> | FunctionComponent<SVGAttributes<SVGElement>> | ReactElement<any, string | JSXElementConstructor<any>>`\n\n### `countryFlagCode`\n\n- Type: `\"id\" | \"as\" | \"no\" | \"is\" | \"ai\" | \"li\" | \"th\" | \"tr\" | \"td\" | \"af\" | \"ax\" | \"al\" | \"dz\" | \"ad\" | \"ao\" | \"aq\" | \"ag\" | \"ar\" | \"am\" | \"aw\" | \"sh-ac\" | \"asean\" | \"au\" | \"at\" | \"az\" | \"bs\" | ... 244 more ... | undefined`\n- Detailed type: `undefined | \"id\" | \"as\" | \"no\" | \"is\" | \"ai\" | \"li\" | \"th\" | \"tr\" | \"td\" | \"af\" | \"ax\" | \"al\" | \"dz\" | \"ad\" | \"ao\" | \"aq\" | \"ag\" | \"ar\" | \"am\" | \"aw\" | \"sh-ac\" | \"asean\" | \"au\" | \"at\" | \"az\" | \"bs\" | \"bh\" | \"bd\" | \"bb\" | \"es-pv\" | \"by\" | \"be\" | \"bz\" | \"bj\" | \"bm\" | \"bt\" | \"bo\" | \"bq\" | \"ba\" | \"bw\" | \"bv\" | \"br\" | \"io\" | \"bn\" | \"bg\" | \"bf\" | \"bi\" | \"cv\" | \"kh\" | \"cm\" | \"ca\" | \"ic\" | \"es-ct\" | \"ky\" | \"cf\" | \"cefta\" | \"cl\" | \"cn\" | \"cx\" | \"cp\" | \"cc\" | \"co\" | \"km\" | \"ck\" | \"cr\" | \"hr\" | \"cu\" | \"cw\" | \"cy\" | \"cz\" | \"ci\" | \"cd\" | \"dk\" | \"dg\" | \"dj\" | \"dm\" | \"do\" | \"eac\" | \"ec\" | \"eg\" | \"sv\" | \"gb-eng\" | \"gq\" | \"er\" | \"ee\" | \"sz\" | \"et\" | \"eu\" | \"fk\" | \"fo\" | \"fm\" | \"fj\" | \"fi\" | \"fr\" | \"gf\" | \"pf\" | \"tf\" | \"ga\" | \"es-ga\" | \"gm\" | \"ge\" | \"de\" | \"gh\" | \"gi\" | \"gr\" | \"gl\" | \"gd\" | \"gp\" | \"gu\" | \"gt\" | \"gg\" | \"gn\" | \"gw\" | \"gy\" | \"ht\" | \"hm\" | \"va\" | \"hn\" | \"hk\" | \"hu\" | \"in\" | \"ir\" | \"iq\" | \"ie\" | \"im\" | \"il\" | \"it\" | \"jm\" | \"jp\" | \"je\" | \"jo\" | \"kz\" | \"ke\" | \"ki\" | \"xk\" | \"kw\" | \"kg\" | \"la\" | \"lv\" | \"arab\" | \"lb\" | \"ls\" | \"lr\" | \"ly\" | \"lt\" | \"lu\" | \"mo\" | \"mg\" | \"mw\" | \"my\" | \"mv\" | \"ml\" | \"mt\" | \"mh\" | \"mq\" | \"mr\" | \"mu\" | \"yt\" | \"mx\" | \"md\" | \"mc\" | \"mn\" | \"me\" | \"ms\" | \"ma\" | \"mz\" | \"mm\" | \"na\" | \"nr\" | \"np\" | \"nl\" | \"nc\" | \"nz\" | \"ni\" | \"ne\" | \"ng\" | \"nu\" | \"nf\" | \"kp\" | \"mk\" | \"gb-nir\" | \"mp\" | \"om\" | \"pc\" | \"pk\" | \"pw\" | \"pa\" | \"pg\" | \"py\" | \"pe\" | \"ph\" | \"pn\" | \"pl\" | \"pt\" | \"pr\" | \"qa\" | \"cg\" | \"ro\" | \"ru\" | \"rw\" | \"re\" | \"bl\" | \"sh-hl\" | \"sh\" | \"kn\" | \"lc\" | \"mf\" | \"pm\" | \"vc\" | \"ws\" | \"sm\" | \"st\" | \"sa\" | \"gb-sct\" | \"sn\" | \"rs\" | \"sc\" | \"sl\" | \"sg\" | \"sx\" | \"sk\" | \"si\" | \"sb\" | \"so\" | \"za\" | \"gs\" | \"kr\" | \"ss\" | \"es\" | \"lk\" | \"ps\" | \"sd\" | \"sr\" | \"sj\" | \"se\" | \"ch\" | \"sy\" | \"tw\" | \"tj\" | \"tz\" | \"tl\" | \"tg\" | \"tk\" | \"to\" | \"tt\" | \"sh-ta\" | \"tn\" | \"tm\" | \"tc\" | \"tv\" | \"ug\" | \"ua\" | \"ae\" | \"gb\" | \"un\" | \"um\" | \"us\" | \"uy\" | \"uz\" | \"vu\" | \"ve\" | \"vn\" | \"vg\" | \"vi\" | \"gb-wls\" | \"wf\" | \"eh\" | \"ye\" | \"zm\" | \"zw\"`\n\n### `value`\n\n- Type: `string`\n- Required\n\nUnique identifier for this chip. Used for selection tracking\n\n### `children`\n\n- Type: `ReactNode`\n- Required\n\nContent to display inside the chip\n\n### `counter`\n\n- Type: `number | undefined`\n\nOptional numeric counter to display alongside the chip label\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `ref`\n\n- Type: `LegacyRef<HTMLButtonElement> | undefined`\n- Detailed type: `undefined | null | string | (instance: HTMLButtonElement | null) => void | RefObject<HTMLButtonElement>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
34571
34579
|
},
|
|
34572
34580
|
DismissibleChips: {
|
|
34573
34581
|
meta: {
|
|
@@ -34575,7 +34583,7 @@ var Ni = de({
|
|
|
34575
34583
|
import: "import { DismissibleChips } from '@preply/ds-web-lib';",
|
|
34576
34584
|
description: "A chips component for displaying dismissible/removable items."
|
|
34577
34585
|
},
|
|
34578
|
-
docs: "# DismissibleChips\n\n```\nimport { DismissibleChips } from '@preply/ds-web-lib';\n```\n\nA chips component for displaying dismissible/removable items.\n\n@remarks\n\n**Keyboard interactions:**\n- **Tab** to enter/exit the component (uses [roving tabindex pattern](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex))\n- **Arrow keys** to navigate between chips within the group\n- **Space/Enter** to remove the focused chip\n- **Delete/Backspace** to remove the focused chip\n\n@example\n\n````\n```tsx\n<DismissibleChips\n aria-label=\"Selected skills\"\n defaultValue={['vocabulary', 'speaking', 'listening']}\n>\n <DismissibleChipsItem value=\"vocabulary\">Vocabulary</DismissibleChipsItem>\n <DismissibleChipsItem value=\"speaking\">Speaking</DismissibleChipsItem>\n <DismissibleChipsItem value=\"listening\">Listening</DismissibleChipsItem>\n</DismissibleChips>\n```\n````\n\n## Props\n\n### `aria-label`\n\n- Type: `string`\n- Required\n\nAccessible label for the chips group. Required for screen reader users\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`\n\n### `defaultValue`\n\n- Type: `T[] | undefined`\n\nDefault value for uncontrolled usage. Will be ignored if `value` is provided\n\n### `aria-controls`\n\n- Type: `string | undefined`\n\nIf the chips control other elements on the page, use `aria-controls` with the target element's ID.\n\n### `value`\n\n- Type: `T[] | undefined`\n\nCurrent value of the chips. When provided, the component operates in controlled mode\n\n### `onValueChange`\n\n- Type: `((value: T[]) => void) | undefined`\n\nCallback fired when the value changes. Receives the new value as an argument\n\n### `orientation`\n\n- Type: `Orientation | undefined`\n- Detailed type: `undefined | \"horizontal\" | \"vertical\"`\n- Default value: `'horizontal'`\n\nLayout orientation of the chips group.\n\n### `items`\n\n- Type: `(Omit<ChipsItemProps, \"
|
|
34586
|
+
docs: "# DismissibleChips\n\n```\nimport { DismissibleChips } from '@preply/ds-web-lib';\n```\n\nA chips component for displaying dismissible/removable items.\n\n@remarks\n\n**Keyboard interactions:**\n- **Tab** to enter/exit the component (uses [roving tabindex pattern](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex))\n- **Arrow keys** to navigate between chips within the group\n- **Space/Enter** to remove the focused chip\n- **Delete/Backspace** to remove the focused chip\n\n@example\n\n````\n```tsx\n<DismissibleChips\n aria-label=\"Selected skills\"\n defaultValue={['vocabulary', 'speaking', 'listening']}\n>\n <DismissibleChipsItem value=\"vocabulary\">Vocabulary</DismissibleChipsItem>\n <DismissibleChipsItem value=\"speaking\">Speaking</DismissibleChipsItem>\n <DismissibleChipsItem value=\"listening\">Listening</DismissibleChipsItem>\n</DismissibleChips>\n```\n````\n\n## Props\n\n### `aria-label`\n\n- Type: `string`\n- Required\n\nAccessible label for the chips group. Required for screen reader users\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`\n\n### `defaultValue`\n\n- Type: `T[] | undefined`\n\nDefault value for uncontrolled usage. Will be ignored if `value` is provided\n\n### `aria-controls`\n\n- Type: `string | undefined`\n\nIf the chips control other elements on the page, use `aria-controls` with the target element's ID.\n\n### `value`\n\n- Type: `T[] | undefined`\n\nCurrent value of the chips. When provided, the component operates in controlled mode\n\n### `onValueChange`\n\n- Type: `((value: T[]) => void) | undefined`\n\nCallback fired when the value changes. Receives the new value as an argument\n\n### `orientation`\n\n- Type: `Orientation | undefined`\n- Detailed type: `undefined | \"horizontal\" | \"vertical\"`\n- Default value: `'horizontal'`\n\nLayout orientation of the chips group.\n\n### `items`\n\n- Type: `(Omit<ChipsItemProps, \"children\" | \"value\"> & { value: NonNullable<T>; label: ReactNode; })[] | undefined`\n- Detailed type: `undefined | (Omit<ChipsItemProps, \"children\" | \"value\"> & { value: NonNullable<T>; label: ReactNode; })[]`\n\n### `ref`\n\n- Type: `((instance: HTMLUListElement | null) => void) | RefObject<HTMLUListElement> | null | undefined`\n- Detailed type: `undefined | null | (instance: HTMLUListElement | null) => void | RefObject<HTMLUListElement>`"
|
|
34579
34587
|
},
|
|
34580
34588
|
DismissibleChipsItem: {
|
|
34581
34589
|
meta: {
|
|
@@ -34583,7 +34591,7 @@ var Ni = de({
|
|
|
34583
34591
|
import: "import { DismissibleChipsItem } from '@preply/ds-web-lib';",
|
|
34584
34592
|
description: "Individual dismissible chip item for use within DismissibleChips."
|
|
34585
34593
|
},
|
|
34586
|
-
docs: "# DismissibleChipsItem\n\n```\nimport { DismissibleChipsItem } from '@preply/ds-web-lib';\n```\n\nIndividual dismissible chip item for use within DismissibleChips.\n\n@example\n\n````\n```tsx\n<DismissibleChipsItem value=\"english\">\n English\n</DismissibleChipsItem>\n```\n````\n\n## Props\n\n### `
|
|
34594
|
+
docs: "# DismissibleChipsItem\n\n```\nimport { DismissibleChipsItem } from '@preply/ds-web-lib';\n```\n\nIndividual dismissible chip item for use within DismissibleChips.\n\n@example\n\n````\n```tsx\n<DismissibleChipsItem value=\"english\">\n English\n</DismissibleChipsItem>\n```\n````\n\n## Props\n\n### `disabled`\n\n- Type: `boolean | undefined`\n\n### `icon`\n\n- Type: `SvgComponentOrElement | undefined`\n- Detailed type: `undefined | ComponentClass<SVGAttributes<SVGElement>, any> | FunctionComponent<SVGAttributes<SVGElement>> | ReactElement<any, string | JSXElementConstructor<any>>`\n\n### `countryFlagCode`\n\n- Type: `\"id\" | \"as\" | \"no\" | \"is\" | \"ai\" | \"li\" | \"th\" | \"tr\" | \"td\" | \"af\" | \"ax\" | \"al\" | \"dz\" | \"ad\" | \"ao\" | \"aq\" | \"ag\" | \"ar\" | \"am\" | \"aw\" | \"sh-ac\" | \"asean\" | \"au\" | \"at\" | \"az\" | \"bs\" | ... 244 more ... | undefined`\n- Detailed type: `undefined | \"id\" | \"as\" | \"no\" | \"is\" | \"ai\" | \"li\" | \"th\" | \"tr\" | \"td\" | \"af\" | \"ax\" | \"al\" | \"dz\" | \"ad\" | \"ao\" | \"aq\" | \"ag\" | \"ar\" | \"am\" | \"aw\" | \"sh-ac\" | \"asean\" | \"au\" | \"at\" | \"az\" | \"bs\" | \"bh\" | \"bd\" | \"bb\" | \"es-pv\" | \"by\" | \"be\" | \"bz\" | \"bj\" | \"bm\" | \"bt\" | \"bo\" | \"bq\" | \"ba\" | \"bw\" | \"bv\" | \"br\" | \"io\" | \"bn\" | \"bg\" | \"bf\" | \"bi\" | \"cv\" | \"kh\" | \"cm\" | \"ca\" | \"ic\" | \"es-ct\" | \"ky\" | \"cf\" | \"cefta\" | \"cl\" | \"cn\" | \"cx\" | \"cp\" | \"cc\" | \"co\" | \"km\" | \"ck\" | \"cr\" | \"hr\" | \"cu\" | \"cw\" | \"cy\" | \"cz\" | \"ci\" | \"cd\" | \"dk\" | \"dg\" | \"dj\" | \"dm\" | \"do\" | \"eac\" | \"ec\" | \"eg\" | \"sv\" | \"gb-eng\" | \"gq\" | \"er\" | \"ee\" | \"sz\" | \"et\" | \"eu\" | \"fk\" | \"fo\" | \"fm\" | \"fj\" | \"fi\" | \"fr\" | \"gf\" | \"pf\" | \"tf\" | \"ga\" | \"es-ga\" | \"gm\" | \"ge\" | \"de\" | \"gh\" | \"gi\" | \"gr\" | \"gl\" | \"gd\" | \"gp\" | \"gu\" | \"gt\" | \"gg\" | \"gn\" | \"gw\" | \"gy\" | \"ht\" | \"hm\" | \"va\" | \"hn\" | \"hk\" | \"hu\" | \"in\" | \"ir\" | \"iq\" | \"ie\" | \"im\" | \"il\" | \"it\" | \"jm\" | \"jp\" | \"je\" | \"jo\" | \"kz\" | \"ke\" | \"ki\" | \"xk\" | \"kw\" | \"kg\" | \"la\" | \"lv\" | \"arab\" | \"lb\" | \"ls\" | \"lr\" | \"ly\" | \"lt\" | \"lu\" | \"mo\" | \"mg\" | \"mw\" | \"my\" | \"mv\" | \"ml\" | \"mt\" | \"mh\" | \"mq\" | \"mr\" | \"mu\" | \"yt\" | \"mx\" | \"md\" | \"mc\" | \"mn\" | \"me\" | \"ms\" | \"ma\" | \"mz\" | \"mm\" | \"na\" | \"nr\" | \"np\" | \"nl\" | \"nc\" | \"nz\" | \"ni\" | \"ne\" | \"ng\" | \"nu\" | \"nf\" | \"kp\" | \"mk\" | \"gb-nir\" | \"mp\" | \"om\" | \"pc\" | \"pk\" | \"pw\" | \"pa\" | \"pg\" | \"py\" | \"pe\" | \"ph\" | \"pn\" | \"pl\" | \"pt\" | \"pr\" | \"qa\" | \"cg\" | \"ro\" | \"ru\" | \"rw\" | \"re\" | \"bl\" | \"sh-hl\" | \"sh\" | \"kn\" | \"lc\" | \"mf\" | \"pm\" | \"vc\" | \"ws\" | \"sm\" | \"st\" | \"sa\" | \"gb-sct\" | \"sn\" | \"rs\" | \"sc\" | \"sl\" | \"sg\" | \"sx\" | \"sk\" | \"si\" | \"sb\" | \"so\" | \"za\" | \"gs\" | \"kr\" | \"ss\" | \"es\" | \"lk\" | \"ps\" | \"sd\" | \"sr\" | \"sj\" | \"se\" | \"ch\" | \"sy\" | \"tw\" | \"tj\" | \"tz\" | \"tl\" | \"tg\" | \"tk\" | \"to\" | \"tt\" | \"sh-ta\" | \"tn\" | \"tm\" | \"tc\" | \"tv\" | \"ug\" | \"ua\" | \"ae\" | \"gb\" | \"un\" | \"um\" | \"us\" | \"uy\" | \"uz\" | \"vu\" | \"ve\" | \"vn\" | \"vg\" | \"vi\" | \"gb-wls\" | \"wf\" | \"eh\" | \"ye\" | \"zm\" | \"zw\"`\n\n### `value`\n\n- Type: `string`\n- Required\n\nUnique identifier for this chip. Used for selection tracking\n\n### `children`\n\n- Type: `ReactNode`\n- Required\n\nContent to display inside the chip\n\n### `counter`\n\n- Type: `number | undefined`\n\nOptional numeric counter to display alongside the chip label\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `ref`\n\n- Type: `LegacyRef<HTMLButtonElement> | undefined`\n- Detailed type: `undefined | null | string | (instance: HTMLButtonElement | null) => void | RefObject<HTMLButtonElement>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
34587
34595
|
},
|
|
34588
34596
|
createOnboardingTour: {
|
|
34589
34597
|
meta: {
|
|
@@ -34688,7 +34696,7 @@ var Ni = de({
|
|
|
34688
34696
|
import: "import { DialogStepsNext } from '@preply/ds-web-lib';",
|
|
34689
34697
|
description: ""
|
|
34690
34698
|
},
|
|
34691
|
-
docs: "# DialogStepsNext\n\n```\nimport { DialogStepsNext } from '@preply/ds-web-lib';\n```\n\n## Props\n\n### `id`\n\n- Type: `string | undefined`\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `
|
|
34699
|
+
docs: "# DialogStepsNext\n\n```\nimport { DialogStepsNext } from '@preply/ds-web-lib';\n```\n\n## Props\n\n### `id`\n\n- Type: `string | undefined`\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `onClick`\n\n- Type: `MouseEventHandler | undefined`\n\n### `variant`\n\n- Type: `ButtonVariant | undefined`\n- Detailed type: `undefined | \"critical\" | \"primary\" | \"secondary\" | \"tertiary\" | \"quaternary\" | \"ghost\" | \"onColor\" | \"classroom\" | \"primaryB2b\" | \"primaryTutor\" | \"inverted\" | \"newFeature\" | \"ai\"`\n\n### `size`\n\n- Type: `Responsive<ButtonSize> | undefined`\n- Detailed type: `undefined | \"large\" | \"medium\" | \"small\" | ResponsiveProp<ButtonSize>`\n\n### `fullWidth`\n\n- Type: `Responsive<boolean> | undefined`\n- Detailed type: `undefined | false | true | ResponsiveProp<boolean>`\n\n### `wrap`\n\n- Type: `boolean | undefined`\n\n### `href`\n\n- Type: `string | undefined`\n\n### `download`\n\n- Type: `boolean | undefined`\n\n### `opensInNewTab`\n\n- Type: `boolean | undefined`\n\n### `nofollow`\n\n- Type: `boolean | undefined`\n\n### `submitsForm`\n\n- Type: `boolean | undefined`\n\n### `assistiveText`\n\n- Type: `string | undefined`\n\n### `onKeyDown`\n\n- Type: `KeyboardEventHandler | undefined`\n\n### `onKeyUp`\n\n- Type: `KeyboardEventHandler | undefined`\n\n### `onMouseDown`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onMouseUp`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onMouseEnter`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onMouseMove`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onPointerDown`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onPointerEnter`\n\n- Type: `MouseEventHandler | undefined`\n\n### `disabled`\n\n- Type: `boolean | undefined`\n\n### `busy`\n\n- Type: `boolean | undefined`\n\nReplaces the content with a loading indicator.\n\n### `selected`\n\n- Type: `boolean | undefined`\n\nUsed only for classroom and ghost variants\n\n### `as`\n\n- Type: `ReactElement<any, string | JSXElementConstructor<any>> | undefined`\n- Detailed type: `undefined | ReactElement<any, string | JSXElementConstructor<any>>`\n\nCustom element to render the button.\n\nAllows rendering the button using a different React element or component.\nThis is particularly useful for integrating with router libraries like `react-router` or `next/router`.\n\n@example\n\n```\n// Render as a react router link component\nimport { Link } from 'react-router-dom';\n\n<ButtonBase as={<Link to=\"/home\" />} />\n```\n\n### `url`\n\n- Type: `string | undefined`\n\n@deprecated\n\nUse `href` instead\n\n### `a11yLabel`\n\n- Type: `string | undefined`\n\n@deprecated\n\nUse `assistiveText` instead\n\n### `dsInternalSimulation`\n\n- Type: `\"hover\" | \"focus\" | \"active\" | undefined`\n\n@deprecated\n\nThis is meant for internal DS usage only. Do not use it in your code.\n\n@ignore\n\n### `leadingSvgIcon`\n\n- Type: `SvgComponentOrElement | undefined`\n- Detailed type: `undefined | ComponentClass<SVGAttributes<SVGElement>, any> | FunctionComponent<SVGAttributes<SVGElement>> | ReactElement<any, string | JSXElementConstructor<any>>`\n\nThe leading SVG icon.\n\n@example\n\n```\nimport TokyoUITag from '@preply/ds-media-icons/dist/24/TokyoUITag.svg';\n\n<Button leadingSvgIcon={TokyoUITag}>Button</Button>\nor\n<Button leadingSvgIcon={<TokyoUITag />}>Button</Button>\n```\n\n### `trailingSvgIcon`\n\n- Type: `SvgComponentOrElement | undefined`\n- Detailed type: `undefined | ComponentClass<SVGAttributes<SVGElement>, any> | FunctionComponent<SVGAttributes<SVGElement>> | ReactElement<any, string | JSXElementConstructor<any>>`\n\nThe trailing SVG icon.\n\n@example\n\n```\nimport TokyoUITag from '@preply/ds-media-icons/dist/24/TokyoUITag.svg';\n\n<Button trailingSvgIcon={TokyoUITag}>Button</Button>\nor\n<Button trailingSvgIcon={<TokyoUITag />}>Button</Button>\n```\n\n### `ref`\n\n- Type: `LegacyRef<HTMLAnchorElement | HTMLButtonElement> | undefined`\n- Detailed type: `undefined | null | string | (instance: HTMLAnchorElement | HTMLButtonElement | null) => void | RefObject<HTMLAnchorElement | HTMLButtonElement>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
34692
34700
|
},
|
|
34693
34701
|
DialogStepsPrevious: {
|
|
34694
34702
|
meta: {
|
|
@@ -34696,7 +34704,7 @@ var Ni = de({
|
|
|
34696
34704
|
import: "import { DialogStepsPrevious } from '@preply/ds-web-lib';",
|
|
34697
34705
|
description: ""
|
|
34698
34706
|
},
|
|
34699
|
-
docs: "# DialogStepsPrevious\n\n```\nimport { DialogStepsPrevious } from '@preply/ds-web-lib';\n```\n\n## Props\n\n### `id`\n\n- Type: `string | undefined`\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `
|
|
34707
|
+
docs: "# DialogStepsPrevious\n\n```\nimport { DialogStepsPrevious } from '@preply/ds-web-lib';\n```\n\n## Props\n\n### `id`\n\n- Type: `string | undefined`\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `onClick`\n\n- Type: `MouseEventHandler | undefined`\n\n### `variant`\n\n- Type: `ButtonVariant | undefined`\n- Detailed type: `undefined | \"critical\" | \"primary\" | \"secondary\" | \"tertiary\" | \"quaternary\" | \"ghost\" | \"onColor\" | \"classroom\" | \"primaryB2b\" | \"primaryTutor\" | \"inverted\" | \"newFeature\" | \"ai\"`\n\n### `size`\n\n- Type: `Responsive<ButtonSize> | undefined`\n- Detailed type: `undefined | \"large\" | \"medium\" | \"small\" | ResponsiveProp<ButtonSize>`\n\n### `fullWidth`\n\n- Type: `Responsive<boolean> | undefined`\n- Detailed type: `undefined | false | true | ResponsiveProp<boolean>`\n\n### `wrap`\n\n- Type: `boolean | undefined`\n\n### `href`\n\n- Type: `string | undefined`\n\n### `download`\n\n- Type: `boolean | undefined`\n\n### `opensInNewTab`\n\n- Type: `boolean | undefined`\n\n### `nofollow`\n\n- Type: `boolean | undefined`\n\n### `submitsForm`\n\n- Type: `boolean | undefined`\n\n### `assistiveText`\n\n- Type: `string | undefined`\n\n### `onKeyDown`\n\n- Type: `KeyboardEventHandler | undefined`\n\n### `onKeyUp`\n\n- Type: `KeyboardEventHandler | undefined`\n\n### `onMouseDown`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onMouseUp`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onMouseEnter`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onMouseMove`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onPointerDown`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onPointerEnter`\n\n- Type: `MouseEventHandler | undefined`\n\n### `disabled`\n\n- Type: `boolean | undefined`\n\n### `busy`\n\n- Type: `boolean | undefined`\n\nReplaces the content with a loading indicator.\n\n### `selected`\n\n- Type: `boolean | undefined`\n\nUsed only for classroom and ghost variants\n\n### `as`\n\n- Type: `ReactElement<any, string | JSXElementConstructor<any>> | undefined`\n- Detailed type: `undefined | ReactElement<any, string | JSXElementConstructor<any>>`\n\nCustom element to render the button.\n\nAllows rendering the button using a different React element or component.\nThis is particularly useful for integrating with router libraries like `react-router` or `next/router`.\n\n@example\n\n```\n// Render as a react router link component\nimport { Link } from 'react-router-dom';\n\n<ButtonBase as={<Link to=\"/home\" />} />\n```\n\n### `url`\n\n- Type: `string | undefined`\n\n@deprecated\n\nUse `href` instead\n\n### `a11yLabel`\n\n- Type: `string | undefined`\n\n@deprecated\n\nUse `assistiveText` instead\n\n### `dsInternalSimulation`\n\n- Type: `\"hover\" | \"focus\" | \"active\" | undefined`\n\n@deprecated\n\nThis is meant for internal DS usage only. Do not use it in your code.\n\n@ignore\n\n### `leadingSvgIcon`\n\n- Type: `SvgComponentOrElement | undefined`\n- Detailed type: `undefined | ComponentClass<SVGAttributes<SVGElement>, any> | FunctionComponent<SVGAttributes<SVGElement>> | ReactElement<any, string | JSXElementConstructor<any>>`\n\nThe leading SVG icon.\n\n@example\n\n```\nimport TokyoUITag from '@preply/ds-media-icons/dist/24/TokyoUITag.svg';\n\n<Button leadingSvgIcon={TokyoUITag}>Button</Button>\nor\n<Button leadingSvgIcon={<TokyoUITag />}>Button</Button>\n```\n\n### `trailingSvgIcon`\n\n- Type: `SvgComponentOrElement | undefined`\n- Detailed type: `undefined | ComponentClass<SVGAttributes<SVGElement>, any> | FunctionComponent<SVGAttributes<SVGElement>> | ReactElement<any, string | JSXElementConstructor<any>>`\n\nThe trailing SVG icon.\n\n@example\n\n```\nimport TokyoUITag from '@preply/ds-media-icons/dist/24/TokyoUITag.svg';\n\n<Button trailingSvgIcon={TokyoUITag}>Button</Button>\nor\n<Button trailingSvgIcon={<TokyoUITag />}>Button</Button>\n```\n\n### `ref`\n\n- Type: `LegacyRef<HTMLAnchorElement | HTMLButtonElement> | undefined`\n- Detailed type: `undefined | null | string | (instance: HTMLAnchorElement | HTMLButtonElement | null) => void | RefObject<HTMLAnchorElement | HTMLButtonElement>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
34700
34708
|
},
|
|
34701
34709
|
Divider: {
|
|
34702
34710
|
meta: {
|
|
@@ -34832,7 +34840,7 @@ var Ni = de({
|
|
|
34832
34840
|
import: "import { IconButton } from '@preply/ds-web-lib';",
|
|
34833
34841
|
description: ""
|
|
34834
34842
|
},
|
|
34835
|
-
docs: "# IconButton\n\n```\nimport { IconButton } from '@preply/ds-web-lib';\n```\n\n## Props\n\n### `id`\n\n- Type: `string | undefined`\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `
|
|
34843
|
+
docs: "# IconButton\n\n```\nimport { IconButton } from '@preply/ds-web-lib';\n```\n\n## Props\n\n### `id`\n\n- Type: `string | undefined`\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `onClick`\n\n- Type: `MouseEventHandler | undefined`\n\n### `variant`\n\n- Type: `ButtonVariant | undefined`\n- Detailed type: `undefined | \"critical\" | \"primary\" | \"secondary\" | \"tertiary\" | \"quaternary\" | \"ghost\" | \"onColor\" | \"classroom\" | \"primaryB2b\" | \"primaryTutor\" | \"inverted\" | \"newFeature\" | \"ai\"`\n- Default value: `primary`\n\n### `size`\n\n- Type: `Responsive<ButtonSize> | undefined`\n- Detailed type: `undefined | \"large\" | \"medium\" | \"small\" | ResponsiveProp<ButtonSize>`\n- Default value: `small`\n\n### `href`\n\n- Type: `string | undefined`\n\n### `download`\n\n- Type: `boolean | undefined`\n\n### `opensInNewTab`\n\n- Type: `boolean | undefined`\n\n### `nofollow`\n\n- Type: `boolean | undefined`\n\n### `submitsForm`\n\n- Type: `boolean | undefined`\n\n### `assistiveText`\n\n- Type: `string`\n\n### `onKeyDown`\n\n- Type: `KeyboardEventHandler | undefined`\n\n### `onKeyUp`\n\n- Type: `KeyboardEventHandler | undefined`\n\n### `onMouseDown`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onMouseUp`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onMouseEnter`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onMouseMove`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onPointerDown`\n\n- Type: `MouseEventHandler | undefined`\n\n### `onPointerEnter`\n\n- Type: `MouseEventHandler | undefined`\n\n### `disabled`\n\n- Type: `boolean | undefined`\n\n### `busy`\n\n- Type: `boolean | undefined`\n\nReplaces the content with a loading indicator.\n\n### `selected`\n\n- Type: `boolean | undefined`\n\nUsed only for classroom and ghost variants\n\n### `as`\n\n- Type: `ReactElement<any, string | JSXElementConstructor<any>> | undefined`\n- Detailed type: `undefined | ReactElement<any, string | JSXElementConstructor<any>>`\n\nCustom element to render the button.\n\nAllows rendering the button using a different React element or component.\nThis is particularly useful for integrating with router libraries like `react-router` or `next/router`.\n\n@example\n\n```\n// Render as a react router link component\nimport { Link } from 'react-router-dom';\n\n<ButtonBase as={<Link to=\"/home\" />} />\n```\n\n### `url`\n\n- Type: `string | undefined`\n\n@deprecated\n\nUse `href` instead\n\n### `a11yLabel`\n\n- Type: `string | undefined`\n\n@deprecated\n\nUse `assistiveText` instead\n\n### `dsInternalSimulation`\n\n- Type: `\"hover\" | \"focus\" | \"active\" | undefined`\n\n@deprecated\n\nThis is meant for internal DS usage only. Do not use it in your code.\n\n@ignore\n\n### `svg`\n\n- Type: `SvgComponentOrElement`\n- Detailed type: `ComponentClass<SVGAttributes<SVGElement>, any> | FunctionComponent<SVGAttributes<SVGElement>> | ReactElement<any, string | JSXElementConstructor<any>>`\n- Required\n\n### `ref`\n\n- Type: `LegacyRef<HTMLAnchorElement | HTMLButtonElement> | undefined`\n- Detailed type: `undefined | null | string | (instance: HTMLAnchorElement | HTMLButtonElement | null) => void | RefObject<HTMLAnchorElement | HTMLButtonElement>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
34836
34844
|
},
|
|
34837
34845
|
LayoutFlex: {
|
|
34838
34846
|
meta: {
|
|
@@ -34872,7 +34880,7 @@ var Ni = de({
|
|
|
34872
34880
|
import: "import { Link } from '@preply/ds-web-lib';",
|
|
34873
34881
|
description: "This is an inline element and will inherit font-size, line-height and\nfont-weight from the parent context. If you need to customise any of these\nstyles, all you have to do is wrap the <Link> in a Text or TextInline\ncomponent."
|
|
34874
34882
|
},
|
|
34875
|
-
docs: "# Link\n\n```\nimport { Link } from '@preply/ds-web-lib';\n```\n\nThis is an inline element and will inherit font-size, line-height and\nfont-weight from the parent context. If you need to customise any of these\nstyles, all you have to do is wrap the <Link> in a Text or TextInline\ncomponent.\n\n## Props\n\n### `onClick`\n\n- Type: `MouseEventHandler<HTMLAnchorElement> | undefined`\n\n### `href`\n\n- Type: `string | undefined`\n\n### `download`\n\n- Type: `any`\n\n### `variant`\n\n- Type: `LinkVariant | undefined`\n- Detailed type: `undefined | \"accentDark\" | \"neutral\" | \"accentDarkInverted\" | \"neutralInverted\" | \"unsetColors\"`\n\n### `opensInNewTab`\n\n- Type: `boolean | undefined`\n\nIf `true`, forces internal link to open in a new tab.\n\n### `nofollow`\n\n- Type: `boolean | undefined`\n\n### `assistiveText`\n\n- Type: `string | undefined`\n\nProvide an `aria-label` to the link.\nThis is useful if the link wraps non-textual elements, eg. an `img`.\n\n### `as`\n\n- Type: `ReactElement<any, string | JSXElementConstructor<any>> | undefined`\n- Detailed type: `undefined | ReactElement<any, string | JSXElementConstructor<any>>`\n\n### `url`\n\n- Type: `string | undefined`\n\n@deprecated\n\nUse `href` instead\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\nSets data attributes on the DOM element.\n\n@example\n\n```\n<Avatar dataset={{ 'qa-id': 'user-avatar' }} /> // will add data-qa-id=\"user-avatar\" to the HTML element\n```\n\n### `inline`\n\n- Type: `boolean | undefined`\n\nIf `true`, allows the link to wrap within text.\n\n### `noUnderline`\n\n- Type: `boolean | undefined`\n\n### `
|
|
34883
|
+
docs: "# Link\n\n```\nimport { Link } from '@preply/ds-web-lib';\n```\n\nThis is an inline element and will inherit font-size, line-height and\nfont-weight from the parent context. If you need to customise any of these\nstyles, all you have to do is wrap the <Link> in a Text or TextInline\ncomponent.\n\n## Props\n\n### `onClick`\n\n- Type: `MouseEventHandler<HTMLAnchorElement> | undefined`\n\n### `href`\n\n- Type: `string | undefined`\n\n### `download`\n\n- Type: `any`\n\n### `variant`\n\n- Type: `LinkVariant | undefined`\n- Detailed type: `undefined | \"accentDark\" | \"neutral\" | \"accentDarkInverted\" | \"neutralInverted\" | \"unsetColors\"`\n\n### `opensInNewTab`\n\n- Type: `boolean | undefined`\n\nIf `true`, forces internal link to open in a new tab.\n\n### `nofollow`\n\n- Type: `boolean | undefined`\n\n### `assistiveText`\n\n- Type: `string | undefined`\n\nProvide an `aria-label` to the link.\nThis is useful if the link wraps non-textual elements, eg. an `img`.\n\n### `as`\n\n- Type: `ReactElement<any, string | JSXElementConstructor<any>> | undefined`\n- Detailed type: `undefined | ReactElement<any, string | JSXElementConstructor<any>>`\n\n### `url`\n\n- Type: `string | undefined`\n\n@deprecated\n\nUse `href` instead\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\nSets data attributes on the DOM element.\n\n@example\n\n```\n<Avatar dataset={{ 'qa-id': 'user-avatar' }} /> // will add data-qa-id=\"user-avatar\" to the HTML element\n```\n\n### `inline`\n\n- Type: `boolean | undefined`\n\nIf `true`, allows the link to wrap within text.\n\n### `noUnderline`\n\n- Type: `boolean | undefined`\n\n### `ref`\n\n- Type: `LegacyRef<HTMLAnchorElement> | undefined`\n- Detailed type: `undefined | null | string | (instance: HTMLAnchorElement | null) => void | RefObject<HTMLAnchorElement>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
34876
34884
|
},
|
|
34877
34885
|
Loader: {
|
|
34878
34886
|
meta: {
|
|
@@ -34920,7 +34928,7 @@ var Ni = de({
|
|
|
34920
34928
|
import: "import { PreplyLogo } from '@preply/ds-web-lib';",
|
|
34921
34929
|
description: ""
|
|
34922
34930
|
},
|
|
34923
|
-
docs: "# PreplyLogo\n\n```\nimport { PreplyLogo } from '@preply/ds-web-lib';\n```\n\n## Props\n\n### `iconOnly`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\n### `business`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\nDisplays the B2B version of the logo.\n\n### `inverted`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\nInverts the background and foreground colors so the logo can be displayed\non dark brackgrounds.\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\nSets data attributes on the DOM element.\n\n@example\n\n```\n<Avatar dataset={{ 'qa-id': 'user-avatar' }} /> // will add data-qa-id=\"user-avatar\" to the HTML element\n```\n\n### `size`\n\n- Type: `\"xs\" | \"s\" | \"m\" | \"l\" | undefined`\n- Default value: `m`\n\n### `ref`\n\n- Type: `LegacyRef<HTMLSpanElement> | undefined`\n- Detailed type: `undefined | null | string | (instance: HTMLSpanElement | null) => void | RefObject<HTMLSpanElement>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
34931
|
+
docs: "# PreplyLogo\n\n```\nimport { PreplyLogo } from '@preply/ds-web-lib';\n```\n\n## Props\n\n### `iconOnly`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\n### `business`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\nDisplays the B2B version of the logo.\n\n### `inverted`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\nInverts the background and foreground colors so the logo can be displayed\non dark brackgrounds.\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\nSets data attributes on the DOM element.\n\n@example\n\n```\n<Avatar dataset={{ 'qa-id': 'user-avatar' }} /> // will add data-qa-id=\"user-avatar\" to the HTML element\n```\n\n### `size`\n\n- Type: `\"xs\" | \"s\" | \"m\" | \"xxs\" | \"l\" | undefined`\n- Default value: `m`\n\n### `ref`\n\n- Type: `LegacyRef<HTMLSpanElement> | undefined`\n- Detailed type: `undefined | null | string | (instance: HTMLSpanElement | null) => void | RefObject<HTMLSpanElement>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
34924
34932
|
},
|
|
34925
34933
|
ProgressBar: {
|
|
34926
34934
|
meta: {
|
|
@@ -34952,7 +34960,7 @@ var Ni = de({
|
|
|
34952
34960
|
import: "import { RatingInput } from '@preply/ds-web-lib';",
|
|
34953
34961
|
description: "A component that allows rating through a series of discrete values.\n\nIf you need to visualize the current rating without the users changing it, look at Rating."
|
|
34954
34962
|
},
|
|
34955
|
-
docs: "# RatingInput\n\n```\nimport { RatingInput } from '@preply/ds-web-lib';\n```\n\nA component that allows rating through a series of discrete values.\n\nIf you need to visualize the current rating without the users changing it, look at Rating.\n\n@see\n\nRating\n\n## Props\n\n### `value`\n\n- Type: `number | undefined`\n\nHalf values can be shown, but the users can only set full values by interacting.\n\nUse FormControl to use the component inside a form.\n\n@see\n\n{@link https://github.com/preply/design-system/blob/main/packages/web-lib/src/components/FormControl/FormControl.stories.tsx FormControl.stories.tsx} for complete examples.\n\nIn case of integrations with forms **without FormControl**, you have to keep in mind that the\nunderlying input element is of type `range`, which means:\n1. `readOnly` is ineffective\n2. `required` is ineffective.\n3. `pattern` is ineffective, validation on input of type range isn't supported. So you need a custom validation if you don't accept 0 as a value (which means the users hasn't rate).\nhttps://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input/range#additional_attributes\nhttps://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input/range#validation\n\n### `id`\n\n- Type: `string | undefined`\n\nThe id of the input element.\n\n### `name`\n\n- Type: `string | undefined`\n\nThe name of the input element.\n\n### `hasError`\n\n- Type: `boolean | undefined`\n\nShows the component's error state, and sets `aria-invalid=\"true\"` on the input element.\n\nThe attribute should be set as the result of a submit process, and you should tell the\nuser there is an error (we suggest to use custom input fields inside FormControl).\n\n@see\n\nhttps://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-invalid#description\n\nPlease note: you don't need to use it if you use the component inside FormControl.\n\n### `aria-invalid`\n\n- Type: `boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\" | undefined`\n- Detailed type: `undefined | false | true | \"true\" | \"false\" | \"grammar\" | \"spelling\"`\n\nFormControl passes aria-invalid to every errored field inside it, don't pass it manually.\n\n@deprecated\n\nIf you are looking at how to show the error state without FormControl, use `hasError` instead.\n\n@ignore\n\n### `required`\n\n- Type: `boolean | undefined`\n\nSets aria-required to true.\n\nIn case of integrations with forms, keep in mind that the underlying input element\nis of type `range`, which means `required` is ineffective.\n\n@see\n\nhttps://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input/range#additional_attributes\n\nThis is automatically handled by FormControl.\n{@link https://github.com/preply/design-system/blob/main/packages/web-lib/src/components/FormControl/FormControl.stories.tsx FormControl.stories.tsx} for complete examples.\n\n### `defaultValue`\n\n- Type: `number | undefined`\n- Default value: `0`\n\n### `onValueChange`\n\n- Type: `((value: number) => void) | undefined`\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\nSets data attributes on the DOM element.\n\n@example\n\n```\n<Rating dataset={{ 'qa-id': 'accept-conditions' }} /> // will add data-qa-id=\"accept-conditions\" to the HTML element\n```\n\n### `
|
|
34963
|
+
docs: "# RatingInput\n\n```\nimport { RatingInput } from '@preply/ds-web-lib';\n```\n\nA component that allows rating through a series of discrete values.\n\nIf you need to visualize the current rating without the users changing it, look at Rating.\n\n@see\n\nRating\n\n## Props\n\n### `value`\n\n- Type: `number | undefined`\n\nHalf values can be shown, but the users can only set full values by interacting.\n\nUse FormControl to use the component inside a form.\n\n@see\n\n{@link https://github.com/preply/design-system/blob/main/packages/web-lib/src/components/FormControl/FormControl.stories.tsx FormControl.stories.tsx} for complete examples.\n\nIn case of integrations with forms **without FormControl**, you have to keep in mind that the\nunderlying input element is of type `range`, which means:\n1. `readOnly` is ineffective\n2. `required` is ineffective.\n3. `pattern` is ineffective, validation on input of type range isn't supported. So you need a custom validation if you don't accept 0 as a value (which means the users hasn't rate).\nhttps://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input/range#additional_attributes\nhttps://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input/range#validation\n\n### `id`\n\n- Type: `string | undefined`\n\nThe id of the input element.\n\n### `name`\n\n- Type: `string | undefined`\n\nThe name of the input element.\n\n### `hasError`\n\n- Type: `boolean | undefined`\n\nShows the component's error state, and sets `aria-invalid=\"true\"` on the input element.\n\nThe attribute should be set as the result of a submit process, and you should tell the\nuser there is an error (we suggest to use custom input fields inside FormControl).\n\n@see\n\nhttps://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-invalid#description\n\nPlease note: you don't need to use it if you use the component inside FormControl.\n\n### `aria-invalid`\n\n- Type: `boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\" | undefined`\n- Detailed type: `undefined | false | true | \"true\" | \"false\" | \"grammar\" | \"spelling\"`\n\nFormControl passes aria-invalid to every errored field inside it, don't pass it manually.\n\n@deprecated\n\nIf you are looking at how to show the error state without FormControl, use `hasError` instead.\n\n@ignore\n\n### `required`\n\n- Type: `boolean | undefined`\n\nSets aria-required to true.\n\nIn case of integrations with forms, keep in mind that the underlying input element\nis of type `range`, which means `required` is ineffective.\n\n@see\n\nhttps://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input/range#additional_attributes\n\nThis is automatically handled by FormControl.\n{@link https://github.com/preply/design-system/blob/main/packages/web-lib/src/components/FormControl/FormControl.stories.tsx FormControl.stories.tsx} for complete examples.\n\n### `defaultValue`\n\n- Type: `number | undefined`\n- Default value: `0`\n\n### `onValueChange`\n\n- Type: `((value: number) => void) | undefined`\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\nSets data attributes on the DOM element.\n\n@example\n\n```\n<Rating dataset={{ 'qa-id': 'accept-conditions' }} /> // will add data-qa-id=\"accept-conditions\" to the HTML element\n```\n\n### `onBlur`\n\n- Type: `FocusEventHandler<HTMLInputElement> | undefined`\n\n### `onFocus`\n\n- Type: `FocusEventHandler<HTMLInputElement> | undefined`\n\n### `onChange`\n\n- Type: `ChangeEventHandler<HTMLInputElement> | undefined`\n\n### `aria-label`\n\n- Type: `string | undefined`\n\n### `aria-labelledby`\n\n- Type: `string | undefined`\n\n### `aria-describedby`\n\n- Type: `string | undefined`\n\n### `ref`\n\n- Type: `LegacyRef<HTMLInputElement> | undefined`\n- Detailed type: `undefined | null | string | (instance: HTMLInputElement | null) => void | RefObject<HTMLInputElement>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
34956
34964
|
},
|
|
34957
34965
|
SelectField: {
|
|
34958
34966
|
meta: {
|
|
@@ -35080,7 +35088,7 @@ var Ni = de({
|
|
|
35080
35088
|
import: "import { Tooltip } from '@preply/ds-web-lib';",
|
|
35081
35089
|
description: "Tooltip component.\n\nThe direct child of the component should be html element, DS component,\nor a component that forwards ref and spreads props to the underlying DOM node."
|
|
35082
35090
|
},
|
|
35083
|
-
docs: "# Tooltip\n\n```\nimport { Tooltip } from '@preply/ds-web-lib';\n```\n\nTooltip component.\n\nThe direct child of the component should be html element, DS component,\nor a component that forwards ref and spreads props to the underlying DOM node.\n\n@example\n\n```\n<Tooltip content=\"Tooltip content\">\n <Button>Hover me</Button>\n</Tooltip>\n```\n\n## Props\n\n### `content`\n\n- Type: `ReactNode`\n- Required\n\n### `trigger`\n\n- Type: `Trigger | undefined`\n- Detailed type: `undefined | \"hover\" | \"hover-and-touch\"`\n- Default value: `hover`\n\nControls how the tooltip can be triggered.\n\n- 'hover' (default): Tooltip appears on hover\n- 'hover-and-touch': Tooltip appears on hover and touch interactions\n\nIn both cases tooltip also appears on focus.\n\n### `disabled`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\nDisables tooltip completely.\n\n### `side`\n\n- Type: `\"top\" | \"bottom\" | \"left\" | \"right\" | undefined`\n- Default value: `top`\n\nPreferred side of the tooltip to appear from. Use if default side might block important content.\n\n### `onOpenChange`\n\n- Type: `((open: boolean) => void) | undefined`\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `
|
|
35091
|
+
docs: "# Tooltip\n\n```\nimport { Tooltip } from '@preply/ds-web-lib';\n```\n\nTooltip component.\n\nThe direct child of the component should be html element, DS component,\nor a component that forwards ref and spreads props to the underlying DOM node.\n\n@example\n\n```\n<Tooltip content=\"Tooltip content\">\n <Button>Hover me</Button>\n</Tooltip>\n```\n\n## Props\n\n### `content`\n\n- Type: `ReactNode`\n- Required\n\n### `trigger`\n\n- Type: `Trigger | undefined`\n- Detailed type: `undefined | \"hover\" | \"hover-and-touch\"`\n- Default value: `hover`\n\nControls how the tooltip can be triggered.\n\n- 'hover' (default): Tooltip appears on hover\n- 'hover-and-touch': Tooltip appears on hover and touch interactions\n\nIn both cases tooltip also appears on focus.\n\n### `disabled`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\nDisables tooltip completely.\n\n### `side`\n\n- Type: `\"top\" | \"bottom\" | \"left\" | \"right\" | undefined`\n- Default value: `top`\n\nPreferred side of the tooltip to appear from. Use if default side might block important content.\n\n### `onOpenChange`\n\n- Type: `((open: boolean) => void) | undefined`\n\n### `dataset`\n\n- Type: `Dataset | undefined`\n\n### `ref`\n\n- Type: `LegacyRef<HTMLElement> | undefined`\n- Detailed type: `undefined | null | string | (instance: HTMLElement | null) => void | RefObject<HTMLElement>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
35084
35092
|
},
|
|
35085
35093
|
usePortalElement: {
|
|
35086
35094
|
meta: {
|
|
@@ -35195,7 +35203,7 @@ var Ni = de({
|
|
|
35195
35203
|
import: "import { Badge } from '@preply/ds-rn-lib';",
|
|
35196
35204
|
description: ""
|
|
35197
35205
|
},
|
|
35198
|
-
docs: "# Badge\n\n```\nimport { Badge } from '@preply/ds-rn-lib';\n```\n\n## Props\n\n### `testID`\n\n- Type: `string | undefined`\n\nUsed to locate this element in end-to-end tests.\n\n### `type`\n\n- Type: `\"neutral\" | \"info\" | \"positive\" | \"warning\" | \"critical\" | \"ai\" | undefined`\n- Default value: `neutral`\n\n### `size`\n\n- Type: `BadgeSize | undefined`\n- Detailed type: `undefined | \"small\" | \"medium\" | \"large\"`\n- Default value: `medium`\n\n### `leadingIcon`\n\n- Type: `IconName | undefined`\n- Detailed type: `undefined | \"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n\nIcon to display at the start of the badge\n\n@example\n\n````\n```tsx\n<Badge leadingIcon=\"ClockConfirm\">Flexible plan</Badge>\n```\n````"
|
|
35206
|
+
docs: "# Badge\n\n```\nimport { Badge } from '@preply/ds-rn-lib';\n```\n\n## Props\n\n### `testID`\n\n- Type: `string | undefined`\n\nUsed to locate this element in end-to-end tests.\n\n### `type`\n\n- Type: `\"neutral\" | \"info\" | \"positive\" | \"warning\" | \"critical\" | \"ai\" | undefined`\n- Default value: `neutral`\n\n### `size`\n\n- Type: `BadgeSize | undefined`\n- Detailed type: `undefined | \"small\" | \"medium\" | \"large\"`\n- Default value: `medium`\n\n### `leadingIcon`\n\n- Type: `IconName | undefined`\n- Detailed type: `undefined | \"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"Stamp\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundWave\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n\nIcon to display at the start of the badge\n\n@example\n\n````\n```tsx\n<Badge leadingIcon=\"ClockConfirm\">Flexible plan</Badge>\n```\n````"
|
|
35199
35207
|
},
|
|
35200
35208
|
Button: {
|
|
35201
35209
|
meta: {
|
|
@@ -35203,7 +35211,7 @@ var Ni = de({
|
|
|
35203
35211
|
import: "import { Button } from '@preply/ds-rn-lib';",
|
|
35204
35212
|
description: ""
|
|
35205
35213
|
},
|
|
35206
|
-
docs: "# Button\n\n```\nimport { Button } from '@preply/ds-rn-lib';\n```\n\n## Props\n\n### `testID`\n\n- Type: `string | undefined`\n\nUsed to locate this element in end-to-end tests.\n\n### `variant`\n\n- Type: `ButtonVariant | undefined`\n- Detailed type: `undefined | \"critical\" | \"ai\" | \"primary\" | \"secondary\" | \"tertiary\" | \"quaternary\" | \"ghost\" | \"onColor\" | \"classroom\" | \"primaryB2b\" | \"primaryTutor\" | \"inverted\" | \"newFeature\"`\n- Default value: `primary`\n\n### `size`\n\n- Type: `\"small\" | \"medium\" | \"large\" | undefined`\n- Default value: `small`\n\n### `fullWidth`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\n### `wrap`\n\n- Type: `boolean | undefined`\n- Default value: `true`\n\n### `assistiveText`\n\n- Type: `string | undefined`\n\n### `disabled`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\n### `busy`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\n### `onPress`\n\n- Type: `((event: GestureResponderEvent) => void) | undefined`\n\n### `leadingIcon`\n\n- Type: `IconName | undefined`\n- Detailed type: `undefined | \"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n\n### `trailingIcon`\n\n- Type: `IconName | undefined`\n- Detailed type: `undefined | \"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n\n### `selected`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\nUsed only for classroom and ghost variants"
|
|
35214
|
+
docs: "# Button\n\n```\nimport { Button } from '@preply/ds-rn-lib';\n```\n\n## Props\n\n### `testID`\n\n- Type: `string | undefined`\n\nUsed to locate this element in end-to-end tests.\n\n### `variant`\n\n- Type: `ButtonVariant | undefined`\n- Detailed type: `undefined | \"critical\" | \"ai\" | \"primary\" | \"secondary\" | \"tertiary\" | \"quaternary\" | \"ghost\" | \"onColor\" | \"classroom\" | \"primaryB2b\" | \"primaryTutor\" | \"inverted\" | \"newFeature\"`\n- Default value: `primary`\n\n### `size`\n\n- Type: `\"small\" | \"medium\" | \"large\" | undefined`\n- Default value: `small`\n\n### `fullWidth`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\n### `wrap`\n\n- Type: `boolean | undefined`\n- Default value: `true`\n\n### `assistiveText`\n\n- Type: `string | undefined`\n\n### `disabled`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\n### `busy`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\n### `onPress`\n\n- Type: `((event: GestureResponderEvent) => void) | undefined`\n\n### `leadingIcon`\n\n- Type: `IconName | undefined`\n- Detailed type: `undefined | \"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"Stamp\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundWave\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n\n### `trailingIcon`\n\n- Type: `IconName | undefined`\n- Detailed type: `undefined | \"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"Stamp\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundWave\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n\n### `selected`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\nUsed only for classroom and ghost variants"
|
|
35207
35215
|
},
|
|
35208
35216
|
Heading: {
|
|
35209
35217
|
meta: {
|
|
@@ -35219,7 +35227,7 @@ var Ni = de({
|
|
|
35219
35227
|
import: "import { FieldButton } from '@preply/ds-rn-lib';",
|
|
35220
35228
|
description: ""
|
|
35221
35229
|
},
|
|
35222
|
-
docs: "# FieldButton\n\n```\nimport { FieldButton } from '@preply/ds-rn-lib';\n```\n\n## Props\n\n### `testID`\n\n- Type: `string | undefined`\n\nUsed to locate this element in end-to-end tests.\n\n### `icon`\n\n- Type: `IconName`\n- Detailed type: `\"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n- Required\n\n### `accessibilityLabel`\n\n- Type: `string`\n- Required\n\n### `onPress`\n\n- Type: `((event: GestureResponderEvent) => void) | undefined`"
|
|
35230
|
+
docs: "# FieldButton\n\n```\nimport { FieldButton } from '@preply/ds-rn-lib';\n```\n\n## Props\n\n### `testID`\n\n- Type: `string | undefined`\n\nUsed to locate this element in end-to-end tests.\n\n### `icon`\n\n- Type: `IconName`\n- Detailed type: `\"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"Stamp\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundWave\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n- Required\n\n### `accessibilityLabel`\n\n- Type: `string`\n- Required\n\n### `onPress`\n\n- Type: `((event: GestureResponderEvent) => void) | undefined`"
|
|
35223
35231
|
},
|
|
35224
35232
|
FormControl: {
|
|
35225
35233
|
meta: {
|
|
@@ -35235,7 +35243,7 @@ var Ni = de({
|
|
|
35235
35243
|
import: "import { Icon } from '@preply/ds-rn-lib';",
|
|
35236
35244
|
description: "Icon component, uses the icon font under the hood.\n\nRequires `@preply/ds-rn-lib/dist/assets/PreplyDSIcons.ttf` font to be included in the project."
|
|
35237
35245
|
},
|
|
35238
|
-
docs: "# Icon\n\n```\nimport { Icon } from '@preply/ds-rn-lib';\n```\n\nIcon component, uses the icon font under the hood.\n\nRequires `@preply/ds-rn-lib/dist/assets/PreplyDSIcons.ttf` font to be included in the project.\n\n@example\n\n````\n```tsx\n<Icon\n name=\"PreplySymbol\"\n size=\"24\"\n accent=\"primary\"\n accessibilityLabel=\"Preply logo\"\n/>\n```\n````\n\n## Props\n\n### `allowFontScaling`\n\n- Type: `boolean | undefined`\n\nSpecifies whether fonts should scale to respect Text Size accessibility settings.\nThe default is `true`.\n\n### `testID`\n\n- Type: `string | undefined`\n\nUsed to locate this element in end-to-end tests.\n\n### `name`\n\n- Type: `IconName`\n- Detailed type: `\"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n- Required\n\n### `size`\n\n- Type: `IconSize | undefined`\n- Detailed type: `undefined | \"24\" | \"32\" | \"48\" | \"16\"`\n- Default value: `24`\n\n### `accent`\n\n- Type: `TextAccent | undefined`\n- Detailed type: `undefined | \"info\" | \"positive\" | \"warning\" | \"critical\" | \"primary\" | \"secondary\" | \"tertiary\" | \"inverted\" | \"accentDark\" | \"placeholder\"`\n\n### `expColor`\n\n- Type: `ExpColorName | undefined`\n- Detailed type: `undefined | \"grey-0\" | \"grey-50\" | \"grey-100\" | \"grey-200\" | \"grey-300\" | \"grey-400\" | \"grey-500\" | \"grey-600\" | \"grey-700\" | \"grey-800\" | \"grey-900\" | \"pink-50\" | \"pink-100\" | \"pink-200\" | \"pink-300\" | \"pink-400\" | \"pink-500\" | \"pink-600\" | \"pink-700\" | \"pink-800\" | \"yellow-50\" | \"yellow-100\" | \"yellow-200\" | \"yellow-300\" | \"yellow-400\" | \"yellow-500\" | \"yellow-600\" | \"yellow-700\" | \"yellow-800\" | \"blue-50\" | \"blue-100\" | \"blue-200\" | \"blue-300\" | \"blue-400\" | \"blue-500\" | \"blue-600\" | \"blue-700\" | \"blue-800\" | \"teal-50\" | \"teal-100\" | \"teal-200\" | \"teal-300\" | \"teal-400\" | \"teal-500\" | \"teal-600\" | \"teal-700\" | \"teal-800\" | \"red-50\" | \"red-100\" | \"red-200\" | \"red-300\" | \"red-400\" | \"red-500\" | \"red-600\" | \"red-700\" | \"red-800\"`\n\nIf passed along with `accent`, `accent` takes precedence.\n\n### `accessibilityLabel`\n\n- Type: `string | undefined`\n\n### `bypassPlatformAdjustment`\n\n- Type: `boolean | undefined`\n\nDisable adapting the icon on the platform. The automatically-adapted icons are:\n- \"Share\" and \"ShareAndroid\": \"ShareAndroid\" for Android, and \"Share\" for everything else.\n\nFor all the other icons, `bypassPlatformAdjustment` is ignored.\n\n### `inheritParentColor`\n\n- Type: `boolean | undefined`\n\nSet `color` to `undefined` to inherit the text color from the parent component."
|
|
35246
|
+
docs: "# Icon\n\n```\nimport { Icon } from '@preply/ds-rn-lib';\n```\n\nIcon component, uses the icon font under the hood.\n\nRequires `@preply/ds-rn-lib/dist/assets/PreplyDSIcons.ttf` font to be included in the project.\n\n@example\n\n````\n```tsx\n<Icon\n name=\"PreplySymbol\"\n size=\"24\"\n accent=\"primary\"\n accessibilityLabel=\"Preply logo\"\n/>\n```\n````\n\n## Props\n\n### `allowFontScaling`\n\n- Type: `boolean | undefined`\n\nSpecifies whether fonts should scale to respect Text Size accessibility settings.\nThe default is `true`.\n\n### `testID`\n\n- Type: `string | undefined`\n\nUsed to locate this element in end-to-end tests.\n\n### `name`\n\n- Type: `IconName`\n- Detailed type: `\"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"Stamp\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundWave\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n- Required\n\n### `size`\n\n- Type: `IconSize | undefined`\n- Detailed type: `undefined | \"24\" | \"32\" | \"48\" | \"16\"`\n- Default value: `24`\n\n### `accent`\n\n- Type: `TextAccent | undefined`\n- Detailed type: `undefined | \"info\" | \"positive\" | \"warning\" | \"critical\" | \"primary\" | \"secondary\" | \"tertiary\" | \"inverted\" | \"accentDark\" | \"placeholder\"`\n\n### `expColor`\n\n- Type: `ExpColorName | undefined`\n- Detailed type: `undefined | \"grey-0\" | \"grey-50\" | \"grey-100\" | \"grey-200\" | \"grey-300\" | \"grey-400\" | \"grey-500\" | \"grey-600\" | \"grey-700\" | \"grey-800\" | \"grey-900\" | \"pink-50\" | \"pink-100\" | \"pink-200\" | \"pink-300\" | \"pink-400\" | \"pink-500\" | \"pink-600\" | \"pink-700\" | \"pink-800\" | \"yellow-50\" | \"yellow-100\" | \"yellow-200\" | \"yellow-300\" | \"yellow-400\" | \"yellow-500\" | \"yellow-600\" | \"yellow-700\" | \"yellow-800\" | \"blue-50\" | \"blue-100\" | \"blue-200\" | \"blue-300\" | \"blue-400\" | \"blue-500\" | \"blue-600\" | \"blue-700\" | \"blue-800\" | \"teal-50\" | \"teal-100\" | \"teal-200\" | \"teal-300\" | \"teal-400\" | \"teal-500\" | \"teal-600\" | \"teal-700\" | \"teal-800\" | \"red-50\" | \"red-100\" | \"red-200\" | \"red-300\" | \"red-400\" | \"red-500\" | \"red-600\" | \"red-700\" | \"red-800\"`\n\nIf passed along with `accent`, `accent` takes precedence.\n\n### `accessibilityLabel`\n\n- Type: `string | undefined`\n\n### `bypassPlatformAdjustment`\n\n- Type: `boolean | undefined`\n\nDisable adapting the icon on the platform. The automatically-adapted icons are:\n- \"Share\" and \"ShareAndroid\": \"ShareAndroid\" for Android, and \"Share\" for everything else.\n\nFor all the other icons, `bypassPlatformAdjustment` is ignored.\n\n### `inheritParentColor`\n\n- Type: `boolean | undefined`\n\nSet `color` to `undefined` to inherit the text color from the parent component."
|
|
35239
35247
|
},
|
|
35240
35248
|
IconTile: {
|
|
35241
35249
|
meta: {
|
|
@@ -35243,7 +35251,7 @@ var Ni = de({
|
|
|
35243
35251
|
import: "import { IconTile } from '@preply/ds-rn-lib';",
|
|
35244
35252
|
description: "Requires `@preply/ds-rn-lib/dist/assets/PreplyDSIcons.ttf` font to be included in the project."
|
|
35245
35253
|
},
|
|
35246
|
-
docs: "# IconTile\n\n```\nimport { IconTile } from '@preply/ds-rn-lib';\n```\n\nRequires `@preply/ds-rn-lib/dist/assets/PreplyDSIcons.ttf` font to be included in the project.\n\n@example\n\n````\n```tsx\n<Icon\n name=\"PreplySymbol\"\n size=\"base\"\n tone=\"neutral\"\n accessibilityLabel=\"Preply logo\"\n/>\n```\n````\n\n## Props\n\n### `testID`\n\n- Type: `string | undefined`\n\nUsed to locate this element in end-to-end tests.\n\n### `allowFontScaling`\n\n- Type: `boolean | undefined`\n\nSpecifies whether fonts should scale to respect Text Size accessibility settings.\nThe default is `true`.\n\n### `name`\n\n- Type: `IconName`\n- Detailed type: `\"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n- Required\n\n### `accessibilityLabel`\n\n- Type: `string | undefined`\n\n### `bypassPlatformAdjustment`\n\n- Type: `boolean | undefined`\n\nDisable adapting the icon on the platform. The automatically-adapted icons are:\n- \"Share\" and \"ShareAndroid\": \"ShareAndroid\" for Android, and \"Share\" for everything else.\n\nFor all the other icons, `bypassPlatformAdjustment` is ignored.\n\n### `size`\n\n- Type: `Size | undefined`\n- Detailed type: `undefined | \"small\" | \"medium\" | \"large\" | \"base\"`\n- Default value: `base`\n\n### `tone`\n\n- Type: `Tone | undefined`\n- Detailed type: `undefined | \"neutral\" | \"info\" | \"positive\" | \"warning\" | \"critical\" | \"ai\"`\n- Default value: `neutral`"
|
|
35254
|
+
docs: "# IconTile\n\n```\nimport { IconTile } from '@preply/ds-rn-lib';\n```\n\nRequires `@preply/ds-rn-lib/dist/assets/PreplyDSIcons.ttf` font to be included in the project.\n\n@example\n\n````\n```tsx\n<Icon\n name=\"PreplySymbol\"\n size=\"base\"\n tone=\"neutral\"\n accessibilityLabel=\"Preply logo\"\n/>\n```\n````\n\n## Props\n\n### `testID`\n\n- Type: `string | undefined`\n\nUsed to locate this element in end-to-end tests.\n\n### `allowFontScaling`\n\n- Type: `boolean | undefined`\n\nSpecifies whether fonts should scale to respect Text Size accessibility settings.\nThe default is `true`.\n\n### `name`\n\n- Type: `IconName`\n- Detailed type: `\"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"Stamp\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundWave\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n- Required\n\n### `accessibilityLabel`\n\n- Type: `string | undefined`\n\n### `bypassPlatformAdjustment`\n\n- Type: `boolean | undefined`\n\nDisable adapting the icon on the platform. The automatically-adapted icons are:\n- \"Share\" and \"ShareAndroid\": \"ShareAndroid\" for Android, and \"Share\" for everything else.\n\nFor all the other icons, `bypassPlatformAdjustment` is ignored.\n\n### `size`\n\n- Type: `Size | undefined`\n- Detailed type: `undefined | \"small\" | \"medium\" | \"large\" | \"base\"`\n- Default value: `base`\n\n### `tone`\n\n- Type: `Tone | undefined`\n- Detailed type: `undefined | \"neutral\" | \"info\" | \"positive\" | \"warning\" | \"critical\" | \"ai\"`\n- Default value: `neutral`"
|
|
35247
35255
|
},
|
|
35248
35256
|
IconButton: {
|
|
35249
35257
|
meta: {
|
|
@@ -35251,7 +35259,7 @@ var Ni = de({
|
|
|
35251
35259
|
import: "import { IconButton } from '@preply/ds-rn-lib';",
|
|
35252
35260
|
description: ""
|
|
35253
35261
|
},
|
|
35254
|
-
docs: "# IconButton\n\n```\nimport { IconButton } from '@preply/ds-rn-lib';\n```\n\n## Props\n\n### `size`\n\n- Type: `\"small\" | \"medium\" | \"large\" | undefined`\n- Default value: `small`\n\n### `testID`\n\n- Type: `string | undefined`\n\nUsed to locate this element in end-to-end tests.\n\n### `variant`\n\n- Type: `ButtonVariant | undefined`\n- Detailed type: `undefined | \"critical\" | \"ai\" | \"primary\" | \"secondary\" | \"tertiary\" | \"quaternary\" | \"ghost\" | \"onColor\" | \"classroom\" | \"primaryB2b\" | \"primaryTutor\" | \"inverted\" | \"newFeature\"`\n- Default value: `primary`\n\n### `assistiveText`\n\n- Type: `string`\n\n### `disabled`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\n### `busy`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\n### `onPress`\n\n- Type: `((event: GestureResponderEvent) => void) | undefined`\n\n### `selected`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\nUsed only for classroom and ghost variants\n\n### `icon`\n\n- Type: `IconName`\n- Detailed type: `\"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n- Required"
|
|
35262
|
+
docs: "# IconButton\n\n```\nimport { IconButton } from '@preply/ds-rn-lib';\n```\n\n## Props\n\n### `size`\n\n- Type: `\"small\" | \"medium\" | \"large\" | undefined`\n- Default value: `small`\n\n### `testID`\n\n- Type: `string | undefined`\n\nUsed to locate this element in end-to-end tests.\n\n### `variant`\n\n- Type: `ButtonVariant | undefined`\n- Detailed type: `undefined | \"critical\" | \"ai\" | \"primary\" | \"secondary\" | \"tertiary\" | \"quaternary\" | \"ghost\" | \"onColor\" | \"classroom\" | \"primaryB2b\" | \"primaryTutor\" | \"inverted\" | \"newFeature\"`\n- Default value: `primary`\n\n### `assistiveText`\n\n- Type: `string`\n\n### `disabled`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\n### `busy`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\n### `onPress`\n\n- Type: `((event: GestureResponderEvent) => void) | undefined`\n\n### `selected`\n\n- Type: `boolean | undefined`\n- Default value: `false`\n\nUsed only for classroom and ghost variants\n\n### `icon`\n\n- Type: `IconName`\n- Detailed type: `\"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"Stamp\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundWave\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n- Required"
|
|
35255
35263
|
},
|
|
35256
35264
|
LayoutFlex: {
|
|
35257
35265
|
meta: {
|
|
@@ -35291,7 +35299,7 @@ var Ni = de({
|
|
|
35291
35299
|
import: "import { PasswordField } from '@preply/ds-rn-lib';",
|
|
35292
35300
|
description: ""
|
|
35293
35301
|
},
|
|
35294
|
-
docs: "# PasswordField\n\n```\nimport { PasswordField } from '@preply/ds-rn-lib';\n```\n\n## Props\n\n### `testID`\n\n- Type: `string | undefined`\n\nUsed to locate this element in end-to-end tests.\nWhen provided, will be forwarded to the wrapper View. You can also reference\ninput and error elements using `-input` and `-error` suffixes respectively.\nUsed to locate this view in end-to-end tests\n\n@example\n\n```\n<FormControl label=\"Email\" error=\"Email is invalid\" testID=\"form-control\">\n <TextInput />\n</FormControl>\n\nelement(by.id('form-control')) // Reference to the root View\nelement(by.id('form-control-input')) // Reference to the input\nelement(by.id('form-control-error')) // Reference to the error text\n```\n\n### `label`\n\n- Type: `string`\n- Required\n\nThe field label. This is needed for accessibility purposes, but can be\nhidden using the `hideLabel` prop.\n\n### `hideLabel`\n\n- Type: `boolean | undefined`\n\nUse this to hide the `label` visually, but keep it in the accessibility\ntree.\n\n### `description`\n\n- Type: `string | undefined`\n\nAdditional descriptive text that appears below the input field\nto provide more context or instructions to the user.\n\n### `error`\n\n- Type: `string | undefined`\n\nError message to display when the field has an invalid value.\n\n### `required`\n\n- Type: `boolean | undefined`\n\nIndicates if the field is required. When false, adds a \"Optional\"\nindicator next to the label.\n\n### `disabled`\n\n- Type: `boolean | undefined`\n\nWhether the input is disabled\n\n### `accessibilityLabel`\n\n- Type: `string | undefined`\n\nOverrides the text that's read by the screen reader when the user interacts with the element. By default, the\nlabel is constructed by traversing all the children and accumulating all the Text nodes separated by space.\n\n### `placeholder`\n\n- Type: `string | undefined`\n\nThe string that will be rendered before text input has been entered\n\n### `icon`\n\n- Type: `IconName | undefined`\n- Detailed type: `undefined | \"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n\nIcon to display at the start of the input\n\n@example\n\n````\n```tsx\n<TextInput icon=\"Search\" />\n```\n````\n\n### `onFocus`\n\n- Type: `((e: NativeSyntheticEvent<TextInputFocusEventData>) => void) | undefined`\n\nCallback that is called when the text input is focused\n\n### `onBlur`\n\n- Type: `((e: NativeSyntheticEvent<TextInputFocusEventData>) => void) | undefined`\n\nCallback that is called when the text input is blurred\n\n### `onChangeText`\n\n- Type: `((text: string) => void) | undefined`\n\nCallback that is called when the text input's text changes.\nChanged text is passed as an argument to the callback handler.\n\n### `onChange`\n\n- Type: `((e: NativeSyntheticEvent<TextInputChangeEventData>) => void) | undefined`\n\nCallback that is called when the text input's text changes.\n\n### `onKeyPress`\n\n- Type: `((e: NativeSyntheticEvent<TextInputKeyPressEventData>) => void) | undefined`\n\nCallback that is called when a key is pressed.\nThis will be called with\n `{ nativeEvent: { key: keyValue } }`\nwhere keyValue is 'Enter' or 'Backspace' for respective keys and the typed-in character otherwise including ' ' for space.\n\nFires before onChange callbacks.\nNote: on Android only the inputs from soft keyboard are handled, not the hardware keyboard inputs.\n\n### `onSubmitEditing`\n\n- Type: `((e: NativeSyntheticEvent<TextInputSubmitEditingEventData>) => void) | undefined`\n\nCallback that is called when the text input's submit button is pressed.\n\n### `clearButtonMode`\n\n- Type: `\"never\" | \"while-editing\" | \"unless-editing\" | \"always\" | undefined`\n\nenum('never', 'while-editing', 'unless-editing', 'always')\nWhen the clear button should appear on the right side of the text view\n\n### `autoComplete`\n\n- Type: `\"name\" | \"additional-name\" | \"address-line1\" | \"address-line2\" | \"birthdate-day\" | \"birthdate-full\" | \"birthdate-month\" | \"birthdate-year\" | \"cc-csc\" | \"cc-exp\" | \"cc-exp-day\" | ... 46 more ... | undefined`\n- Detailed type: `undefined | \"name\" | \"additional-name\" | \"address-line1\" | \"address-line2\" | \"birthdate-day\" | \"birthdate-full\" | \"birthdate-month\" | \"birthdate-year\" | \"cc-csc\" | \"cc-exp\" | \"cc-exp-day\" | \"cc-exp-month\" | \"cc-exp-year\" | \"cc-number\" | \"cc-name\" | \"cc-given-name\" | \"cc-middle-name\" | \"cc-family-name\" | \"cc-type\" | \"country\" | \"current-password\" | \"email\" | \"family-name\" | \"gender\" | \"given-name\" | \"honorific-prefix\" | \"honorific-suffix\" | \"name-family\" | \"name-given\" | \"name-middle\" | \"name-middle-initial\" | \"name-prefix\" | \"name-suffix\" | \"new-password\" | \"nickname\" | \"one-time-code\" | \"organization\" | \"organization-title\" | \"password\" | \"password-new\" | \"postal-address\" | \"postal-address-country\" | \"postal-address-extended\" | \"postal-address-extended-postal-code\" | \"postal-address-locality\" | \"postal-address-region\" | \"postal-code\" | \"street-address\" | \"sms-otp\" | \"tel\" | \"tel-country-code\" | \"tel-national\" | \"tel-device\" | \"url\" | \"username\" | \"username-new\" | \"off\"`\n\nSpecifies autocomplete hints for the system, so it can provide autofill.\nOn Android, the system will always attempt to offer autofill by using heuristics to identify the type of content.\nTo disable autocomplete, set autoComplete to off.\n\nThe following values work across platforms:\n\n- `additional-name`\n- `address-line1`\n- `address-line2`\n- `cc-number`\n- `country`\n- `current-password`\n- `email`\n- `family-name`\n- `given-name`\n- `honorific-prefix`\n- `honorific-suffix`\n- `name`\n- `new-password`\n- `off`\n- `one-time-code`\n- `postal-code`\n- `street-address`\n- `tel`\n- `username`\n\nThe following values work on iOS only:\n\n- `nickname`\n- `organization`\n- `organization-title`\n- `url`\n\nThe following values work on Android only:\n\n- `birthdate-day`\n- `birthdate-full`\n- `birthdate-month`\n- `birthdate-year`\n- `cc-csc`\n- `cc-exp`\n- `cc-exp-day`\n- `cc-exp-month`\n- `cc-exp-year`\n- `gender`\n- `name-family`\n- `name-given`\n- `name-middle`\n- `name-middle-initial`\n- `name-prefix`\n- `name-suffix`\n- `password`\n- `password-new`\n- `postal-address`\n- `postal-address-country`\n- `postal-address-extended`\n- `postal-address-extended-postal-code`\n- `postal-address-locality`\n- `postal-address-region`\n- `sms-otp`\n- `tel-country-code`\n- `tel-national`\n- `tel-device`\n- `username-new`\n\n### `autoFocus`\n\n- Type: `boolean | undefined`\n\nIf true, focuses the input on componentDidMount.\nThe default value is false.\n\n### `autoCorrect`\n\n- Type: `boolean | undefined`\n\nIf false, disables auto-correct.\nThe default value is true.\n\n### `autoCapitalize`\n\n- Type: `\"none\" | \"sentences\" | \"words\" | \"characters\" | undefined`\n\nCan tell TextInput to automatically capitalize certain characters.\n characters: all characters,\n words: first letter of each word\n sentences: first letter of each sentence (default)\n none: don't auto capitalize anything\n\nhttps://reactnative.dev/docs/textinput#autocapitalize\n\n### `defaultValue`\n\n- Type: `string | undefined`\n\nProvides an initial value that will change when the user starts typing.\nUseful for simple use-cases where you don't want to deal with listening to events\nand updating the value prop to keep the controlled state in sync.\n\n### `value`\n\n- Type: `string | undefined`\n\nThe value to show for the text input. TextInput is a controlled component,\nwhich means the native value will be forced to match this value prop if provided.\nFor most uses this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same.\nIn addition to simply setting the same value, either set editable={false},\nor set/update maxLength to prevent unwanted edits without flicker.\n\n### `inputMode`\n\n- Type: `InputModeOptions | undefined`\n- Detailed type: `undefined | \"none\" | \"email\" | \"tel\" | \"url\" | \"text\" | \"decimal\" | \"numeric\" | \"search\"`\n\nWorks like the inputmode attribute in HTML, it determines which keyboard to open, e.g. numeric and has precedence over keyboardType.\n\n### `maxLength`\n\n- Type: `number | undefined`\n\nLimits the maximum number of characters that can be entered.\nUse this instead of implementing the logic in JS to avoid flicker.\n\n### `returnKeyType`\n\n- Type: `ReturnKeyTypeOptions | undefined`\n- Detailed type: `undefined | \"none\" | \"join\" | \"search\" | \"done\" | \"go\" | \"next\" | \"send\" | \"previous\" | \"default\" | \"google\" | \"route\" | \"yahoo\" | \"emergency-call\"`\n\nenum('default', 'go', 'google', 'join', 'next', 'route', 'search', 'send', 'yahoo', 'done', 'emergency-call')\nDetermines how the return key should look.\n\n### `secureTextEntry`\n\n- Type: `boolean | undefined`\n\nIf true, the text input obscures the text entered so that sensitive text like passwords stay secure.\nThe default value is false.\n\n### `ref`\n\n- Type: `LegacyRef<TextInput> | undefined`\n- Detailed type: `undefined | null | string | (instance: TextInput | null) => void | RefObject<TextInput>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
35302
|
+
docs: "# PasswordField\n\n```\nimport { PasswordField } from '@preply/ds-rn-lib';\n```\n\n## Props\n\n### `testID`\n\n- Type: `string | undefined`\n\nUsed to locate this element in end-to-end tests.\nWhen provided, will be forwarded to the wrapper View. You can also reference\ninput and error elements using `-input` and `-error` suffixes respectively.\nUsed to locate this view in end-to-end tests\n\n@example\n\n```\n<FormControl label=\"Email\" error=\"Email is invalid\" testID=\"form-control\">\n <TextInput />\n</FormControl>\n\nelement(by.id('form-control')) // Reference to the root View\nelement(by.id('form-control-input')) // Reference to the input\nelement(by.id('form-control-error')) // Reference to the error text\n```\n\n### `label`\n\n- Type: `string`\n- Required\n\nThe field label. This is needed for accessibility purposes, but can be\nhidden using the `hideLabel` prop.\n\n### `hideLabel`\n\n- Type: `boolean | undefined`\n\nUse this to hide the `label` visually, but keep it in the accessibility\ntree.\n\n### `description`\n\n- Type: `string | undefined`\n\nAdditional descriptive text that appears below the input field\nto provide more context or instructions to the user.\n\n### `error`\n\n- Type: `string | undefined`\n\nError message to display when the field has an invalid value.\n\n### `required`\n\n- Type: `boolean | undefined`\n\nIndicates if the field is required. When false, adds a \"Optional\"\nindicator next to the label.\n\n### `disabled`\n\n- Type: `boolean | undefined`\n\nWhether the input is disabled\n\n### `accessibilityLabel`\n\n- Type: `string | undefined`\n\nOverrides the text that's read by the screen reader when the user interacts with the element. By default, the\nlabel is constructed by traversing all the children and accumulating all the Text nodes separated by space.\n\n### `placeholder`\n\n- Type: `string | undefined`\n\nThe string that will be rendered before text input has been entered\n\n### `icon`\n\n- Type: `IconName | undefined`\n- Detailed type: `undefined | \"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"Stamp\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundWave\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n\nIcon to display at the start of the input\n\n@example\n\n````\n```tsx\n<TextInput icon=\"Search\" />\n```\n````\n\n### `onFocus`\n\n- Type: `((e: NativeSyntheticEvent<TextInputFocusEventData>) => void) | undefined`\n\nCallback that is called when the text input is focused\n\n### `onBlur`\n\n- Type: `((e: NativeSyntheticEvent<TextInputFocusEventData>) => void) | undefined`\n\nCallback that is called when the text input is blurred\n\n### `onChangeText`\n\n- Type: `((text: string) => void) | undefined`\n\nCallback that is called when the text input's text changes.\nChanged text is passed as an argument to the callback handler.\n\n### `onChange`\n\n- Type: `((e: NativeSyntheticEvent<TextInputChangeEventData>) => void) | undefined`\n\nCallback that is called when the text input's text changes.\n\n### `onKeyPress`\n\n- Type: `((e: NativeSyntheticEvent<TextInputKeyPressEventData>) => void) | undefined`\n\nCallback that is called when a key is pressed.\nThis will be called with\n `{ nativeEvent: { key: keyValue } }`\nwhere keyValue is 'Enter' or 'Backspace' for respective keys and the typed-in character otherwise including ' ' for space.\n\nFires before onChange callbacks.\nNote: on Android only the inputs from soft keyboard are handled, not the hardware keyboard inputs.\n\n### `onSubmitEditing`\n\n- Type: `((e: NativeSyntheticEvent<TextInputSubmitEditingEventData>) => void) | undefined`\n\nCallback that is called when the text input's submit button is pressed.\n\n### `clearButtonMode`\n\n- Type: `\"never\" | \"while-editing\" | \"unless-editing\" | \"always\" | undefined`\n\nenum('never', 'while-editing', 'unless-editing', 'always')\nWhen the clear button should appear on the right side of the text view\n\n### `autoComplete`\n\n- Type: `\"name\" | \"additional-name\" | \"address-line1\" | \"address-line2\" | \"birthdate-day\" | \"birthdate-full\" | \"birthdate-month\" | \"birthdate-year\" | \"cc-csc\" | \"cc-exp\" | \"cc-exp-day\" | ... 46 more ... | undefined`\n- Detailed type: `undefined | \"name\" | \"additional-name\" | \"address-line1\" | \"address-line2\" | \"birthdate-day\" | \"birthdate-full\" | \"birthdate-month\" | \"birthdate-year\" | \"cc-csc\" | \"cc-exp\" | \"cc-exp-day\" | \"cc-exp-month\" | \"cc-exp-year\" | \"cc-number\" | \"cc-name\" | \"cc-given-name\" | \"cc-middle-name\" | \"cc-family-name\" | \"cc-type\" | \"country\" | \"current-password\" | \"email\" | \"family-name\" | \"gender\" | \"given-name\" | \"honorific-prefix\" | \"honorific-suffix\" | \"name-family\" | \"name-given\" | \"name-middle\" | \"name-middle-initial\" | \"name-prefix\" | \"name-suffix\" | \"new-password\" | \"nickname\" | \"one-time-code\" | \"organization\" | \"organization-title\" | \"password\" | \"password-new\" | \"postal-address\" | \"postal-address-country\" | \"postal-address-extended\" | \"postal-address-extended-postal-code\" | \"postal-address-locality\" | \"postal-address-region\" | \"postal-code\" | \"street-address\" | \"sms-otp\" | \"tel\" | \"tel-country-code\" | \"tel-national\" | \"tel-device\" | \"url\" | \"username\" | \"username-new\" | \"off\"`\n\nSpecifies autocomplete hints for the system, so it can provide autofill.\nOn Android, the system will always attempt to offer autofill by using heuristics to identify the type of content.\nTo disable autocomplete, set autoComplete to off.\n\nThe following values work across platforms:\n\n- `additional-name`\n- `address-line1`\n- `address-line2`\n- `cc-number`\n- `country`\n- `current-password`\n- `email`\n- `family-name`\n- `given-name`\n- `honorific-prefix`\n- `honorific-suffix`\n- `name`\n- `new-password`\n- `off`\n- `one-time-code`\n- `postal-code`\n- `street-address`\n- `tel`\n- `username`\n\nThe following values work on iOS only:\n\n- `nickname`\n- `organization`\n- `organization-title`\n- `url`\n\nThe following values work on Android only:\n\n- `birthdate-day`\n- `birthdate-full`\n- `birthdate-month`\n- `birthdate-year`\n- `cc-csc`\n- `cc-exp`\n- `cc-exp-day`\n- `cc-exp-month`\n- `cc-exp-year`\n- `gender`\n- `name-family`\n- `name-given`\n- `name-middle`\n- `name-middle-initial`\n- `name-prefix`\n- `name-suffix`\n- `password`\n- `password-new`\n- `postal-address`\n- `postal-address-country`\n- `postal-address-extended`\n- `postal-address-extended-postal-code`\n- `postal-address-locality`\n- `postal-address-region`\n- `sms-otp`\n- `tel-country-code`\n- `tel-national`\n- `tel-device`\n- `username-new`\n\n### `autoFocus`\n\n- Type: `boolean | undefined`\n\nIf true, focuses the input on componentDidMount.\nThe default value is false.\n\n### `autoCorrect`\n\n- Type: `boolean | undefined`\n\nIf false, disables auto-correct.\nThe default value is true.\n\n### `autoCapitalize`\n\n- Type: `\"none\" | \"sentences\" | \"words\" | \"characters\" | undefined`\n\nCan tell TextInput to automatically capitalize certain characters.\n characters: all characters,\n words: first letter of each word\n sentences: first letter of each sentence (default)\n none: don't auto capitalize anything\n\nhttps://reactnative.dev/docs/textinput#autocapitalize\n\n### `defaultValue`\n\n- Type: `string | undefined`\n\nProvides an initial value that will change when the user starts typing.\nUseful for simple use-cases where you don't want to deal with listening to events\nand updating the value prop to keep the controlled state in sync.\n\n### `value`\n\n- Type: `string | undefined`\n\nThe value to show for the text input. TextInput is a controlled component,\nwhich means the native value will be forced to match this value prop if provided.\nFor most uses this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same.\nIn addition to simply setting the same value, either set editable={false},\nor set/update maxLength to prevent unwanted edits without flicker.\n\n### `inputMode`\n\n- Type: `InputModeOptions | undefined`\n- Detailed type: `undefined | \"none\" | \"email\" | \"tel\" | \"url\" | \"text\" | \"decimal\" | \"numeric\" | \"search\"`\n\nWorks like the inputmode attribute in HTML, it determines which keyboard to open, e.g. numeric and has precedence over keyboardType.\n\n### `maxLength`\n\n- Type: `number | undefined`\n\nLimits the maximum number of characters that can be entered.\nUse this instead of implementing the logic in JS to avoid flicker.\n\n### `returnKeyType`\n\n- Type: `ReturnKeyTypeOptions | undefined`\n- Detailed type: `undefined | \"none\" | \"join\" | \"search\" | \"done\" | \"go\" | \"next\" | \"send\" | \"previous\" | \"default\" | \"google\" | \"route\" | \"yahoo\" | \"emergency-call\"`\n\nenum('default', 'go', 'google', 'join', 'next', 'route', 'search', 'send', 'yahoo', 'done', 'emergency-call')\nDetermines how the return key should look.\n\n### `secureTextEntry`\n\n- Type: `boolean | undefined`\n\nIf true, the text input obscures the text entered so that sensitive text like passwords stay secure.\nThe default value is false.\n\n### `ref`\n\n- Type: `LegacyRef<TextInput> | undefined`\n- Detailed type: `undefined | null | string | (instance: TextInput | null) => void | RefObject<TextInput>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
35295
35303
|
},
|
|
35296
35304
|
Text: {
|
|
35297
35305
|
meta: {
|
|
@@ -35315,7 +35323,7 @@ var Ni = de({
|
|
|
35315
35323
|
import: "import { TextField } from '@preply/ds-rn-lib';",
|
|
35316
35324
|
description: ""
|
|
35317
35325
|
},
|
|
35318
|
-
docs: "# TextField\n\n```\nimport { TextField } from '@preply/ds-rn-lib';\n```\n\n## Props\n\n### `testID`\n\n- Type: `string | undefined`\n\nUsed to locate this element in end-to-end tests.\nWhen provided, will be forwarded to the wrapper View. You can also reference\ninput and error elements using `-input` and `-error` suffixes respectively.\nUsed to locate this view in end-to-end tests\n\n@example\n\n```\n<FormControl label=\"Email\" error=\"Email is invalid\" testID=\"form-control\">\n <TextInput />\n</FormControl>\n\nelement(by.id('form-control')) // Reference to the root View\nelement(by.id('form-control-input')) // Reference to the input\nelement(by.id('form-control-error')) // Reference to the error text\n```\n\n### `label`\n\n- Type: `string`\n- Required\n\nThe field label. This is needed for accessibility purposes, but can be\nhidden using the `hideLabel` prop.\n\n### `hideLabel`\n\n- Type: `boolean | undefined`\n\nUse this to hide the `label` visually, but keep it in the accessibility\ntree.\n\n### `description`\n\n- Type: `string | undefined`\n\nAdditional descriptive text that appears below the input field\nto provide more context or instructions to the user.\n\n### `error`\n\n- Type: `string | undefined`\n\nError message to display when the field has an invalid value.\n\n### `required`\n\n- Type: `boolean | undefined`\n\nIndicates if the field is required. When false, adds a \"Optional\"\nindicator next to the label.\n\n### `disabled`\n\n- Type: `boolean | undefined`\n\nWhether the input is disabled\n\n### `accessibilityLabel`\n\n- Type: `string | undefined`\n\nOverrides the text that's read by the screen reader when the user interacts with the element. By default, the\nlabel is constructed by traversing all the children and accumulating all the Text nodes separated by space.\n\n### `button`\n\n- Type: `ReactElement<any, string | JSXElementConstructor<any>> | undefined`\n- Detailed type: `undefined | ReactElement<any, string | JSXElementConstructor<any>>`\n\nButton to display at the end of the input\nMust be used with FieldButton component\n\n@example\n\n````\n```tsx\n<TextInput button={<FieldButton icon=\"Eye\" />} />\n```\n````\n\n### `placeholder`\n\n- Type: `string | undefined`\n\nThe string that will be rendered before text input has been entered\n\n### `icon`\n\n- Type: `IconName | undefined`\n- Detailed type: `undefined | \"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n\nIcon to display at the start of the input\n\n@example\n\n````\n```tsx\n<TextInput icon=\"Search\" />\n```\n````\n\n### `onFocus`\n\n- Type: `((e: NativeSyntheticEvent<TextInputFocusEventData>) => void) | undefined`\n\nCallback that is called when the text input is focused\n\n### `onBlur`\n\n- Type: `((e: NativeSyntheticEvent<TextInputFocusEventData>) => void) | undefined`\n\nCallback that is called when the text input is blurred\n\n### `onChangeText`\n\n- Type: `((text: string) => void) | undefined`\n\nCallback that is called when the text input's text changes.\nChanged text is passed as an argument to the callback handler.\n\n### `onChange`\n\n- Type: `((e: NativeSyntheticEvent<TextInputChangeEventData>) => void) | undefined`\n\nCallback that is called when the text input's text changes.\n\n### `onKeyPress`\n\n- Type: `((e: NativeSyntheticEvent<TextInputKeyPressEventData>) => void) | undefined`\n\nCallback that is called when a key is pressed.\nThis will be called with\n `{ nativeEvent: { key: keyValue } }`\nwhere keyValue is 'Enter' or 'Backspace' for respective keys and the typed-in character otherwise including ' ' for space.\n\nFires before onChange callbacks.\nNote: on Android only the inputs from soft keyboard are handled, not the hardware keyboard inputs.\n\n### `onSubmitEditing`\n\n- Type: `((e: NativeSyntheticEvent<TextInputSubmitEditingEventData>) => void) | undefined`\n\nCallback that is called when the text input's submit button is pressed.\n\n### `clearButtonMode`\n\n- Type: `\"never\" | \"while-editing\" | \"unless-editing\" | \"always\" | undefined`\n\nenum('never', 'while-editing', 'unless-editing', 'always')\nWhen the clear button should appear on the right side of the text view\n\n### `autoComplete`\n\n- Type: `\"name\" | \"additional-name\" | \"address-line1\" | \"address-line2\" | \"birthdate-day\" | \"birthdate-full\" | \"birthdate-month\" | \"birthdate-year\" | \"cc-csc\" | \"cc-exp\" | \"cc-exp-day\" | ... 46 more ... | undefined`\n- Detailed type: `undefined | \"name\" | \"additional-name\" | \"address-line1\" | \"address-line2\" | \"birthdate-day\" | \"birthdate-full\" | \"birthdate-month\" | \"birthdate-year\" | \"cc-csc\" | \"cc-exp\" | \"cc-exp-day\" | \"cc-exp-month\" | \"cc-exp-year\" | \"cc-number\" | \"cc-name\" | \"cc-given-name\" | \"cc-middle-name\" | \"cc-family-name\" | \"cc-type\" | \"country\" | \"current-password\" | \"email\" | \"family-name\" | \"gender\" | \"given-name\" | \"honorific-prefix\" | \"honorific-suffix\" | \"name-family\" | \"name-given\" | \"name-middle\" | \"name-middle-initial\" | \"name-prefix\" | \"name-suffix\" | \"new-password\" | \"nickname\" | \"one-time-code\" | \"organization\" | \"organization-title\" | \"password\" | \"password-new\" | \"postal-address\" | \"postal-address-country\" | \"postal-address-extended\" | \"postal-address-extended-postal-code\" | \"postal-address-locality\" | \"postal-address-region\" | \"postal-code\" | \"street-address\" | \"sms-otp\" | \"tel\" | \"tel-country-code\" | \"tel-national\" | \"tel-device\" | \"url\" | \"username\" | \"username-new\" | \"off\"`\n\nSpecifies autocomplete hints for the system, so it can provide autofill.\nOn Android, the system will always attempt to offer autofill by using heuristics to identify the type of content.\nTo disable autocomplete, set autoComplete to off.\n\nThe following values work across platforms:\n\n- `additional-name`\n- `address-line1`\n- `address-line2`\n- `cc-number`\n- `country`\n- `current-password`\n- `email`\n- `family-name`\n- `given-name`\n- `honorific-prefix`\n- `honorific-suffix`\n- `name`\n- `new-password`\n- `off`\n- `one-time-code`\n- `postal-code`\n- `street-address`\n- `tel`\n- `username`\n\nThe following values work on iOS only:\n\n- `nickname`\n- `organization`\n- `organization-title`\n- `url`\n\nThe following values work on Android only:\n\n- `birthdate-day`\n- `birthdate-full`\n- `birthdate-month`\n- `birthdate-year`\n- `cc-csc`\n- `cc-exp`\n- `cc-exp-day`\n- `cc-exp-month`\n- `cc-exp-year`\n- `gender`\n- `name-family`\n- `name-given`\n- `name-middle`\n- `name-middle-initial`\n- `name-prefix`\n- `name-suffix`\n- `password`\n- `password-new`\n- `postal-address`\n- `postal-address-country`\n- `postal-address-extended`\n- `postal-address-extended-postal-code`\n- `postal-address-locality`\n- `postal-address-region`\n- `sms-otp`\n- `tel-country-code`\n- `tel-national`\n- `tel-device`\n- `username-new`\n\n### `autoFocus`\n\n- Type: `boolean | undefined`\n\nIf true, focuses the input on componentDidMount.\nThe default value is false.\n\n### `autoCorrect`\n\n- Type: `boolean | undefined`\n\nIf false, disables auto-correct.\nThe default value is true.\n\n### `autoCapitalize`\n\n- Type: `\"none\" | \"sentences\" | \"words\" | \"characters\" | undefined`\n\nCan tell TextInput to automatically capitalize certain characters.\n characters: all characters,\n words: first letter of each word\n sentences: first letter of each sentence (default)\n none: don't auto capitalize anything\n\nhttps://reactnative.dev/docs/textinput#autocapitalize\n\n### `defaultValue`\n\n- Type: `string | undefined`\n\nProvides an initial value that will change when the user starts typing.\nUseful for simple use-cases where you don't want to deal with listening to events\nand updating the value prop to keep the controlled state in sync.\n\n### `value`\n\n- Type: `string | undefined`\n\nThe value to show for the text input. TextInput is a controlled component,\nwhich means the native value will be forced to match this value prop if provided.\nFor most uses this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same.\nIn addition to simply setting the same value, either set editable={false},\nor set/update maxLength to prevent unwanted edits without flicker.\n\n### `inputMode`\n\n- Type: `InputModeOptions | undefined`\n- Detailed type: `undefined | \"none\" | \"email\" | \"tel\" | \"url\" | \"text\" | \"decimal\" | \"numeric\" | \"search\"`\n\nWorks like the inputmode attribute in HTML, it determines which keyboard to open, e.g. numeric and has precedence over keyboardType.\n\n### `maxLength`\n\n- Type: `number | undefined`\n\nLimits the maximum number of characters that can be entered.\nUse this instead of implementing the logic in JS to avoid flicker.\n\n### `returnKeyType`\n\n- Type: `ReturnKeyTypeOptions | undefined`\n- Detailed type: `undefined | \"none\" | \"join\" | \"search\" | \"done\" | \"go\" | \"next\" | \"send\" | \"previous\" | \"default\" | \"google\" | \"route\" | \"yahoo\" | \"emergency-call\"`\n\nenum('default', 'go', 'google', 'join', 'next', 'route', 'search', 'send', 'yahoo', 'done', 'emergency-call')\nDetermines how the return key should look.\n\n### `keyboardType`\n\n- Type: `KeyboardTypeOptions | undefined`\n- Detailed type: `undefined | \"url\" | \"numeric\" | \"default\" | \"number-pad\" | \"decimal-pad\" | \"email-address\" | \"phone-pad\" | \"visible-password\" | \"ascii-capable\" | \"numbers-and-punctuation\" | \"name-phone-pad\" | \"twitter\" | \"web-search\"`\n\nenum(\"default\", 'numeric', 'email-address', \"ascii-capable\", 'numbers-and-punctuation', 'url', 'number-pad', 'phone-pad', 'name-phone-pad',\n'decimal-pad', 'twitter', 'web-search', 'visible-password')\nDetermines which keyboard to open, e.g.numeric.\nThe following values work across platforms: - default - numeric - email-address - phone-pad\nThe following values work on iOS: - ascii-capable - numbers-and-punctuation - url - number-pad - name-phone-pad - decimal-pad - twitter - web-search\nThe following values work on Android: - visible-password\n\n### `ref`\n\n- Type: `LegacyRef<TextInput> | undefined`\n- Detailed type: `undefined | null | string | (instance: TextInput | null) => void | RefObject<TextInput>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
35326
|
+
docs: "# TextField\n\n```\nimport { TextField } from '@preply/ds-rn-lib';\n```\n\n## Props\n\n### `testID`\n\n- Type: `string | undefined`\n\nUsed to locate this element in end-to-end tests.\nWhen provided, will be forwarded to the wrapper View. You can also reference\ninput and error elements using `-input` and `-error` suffixes respectively.\nUsed to locate this view in end-to-end tests\n\n@example\n\n```\n<FormControl label=\"Email\" error=\"Email is invalid\" testID=\"form-control\">\n <TextInput />\n</FormControl>\n\nelement(by.id('form-control')) // Reference to the root View\nelement(by.id('form-control-input')) // Reference to the input\nelement(by.id('form-control-error')) // Reference to the error text\n```\n\n### `label`\n\n- Type: `string`\n- Required\n\nThe field label. This is needed for accessibility purposes, but can be\nhidden using the `hideLabel` prop.\n\n### `hideLabel`\n\n- Type: `boolean | undefined`\n\nUse this to hide the `label` visually, but keep it in the accessibility\ntree.\n\n### `description`\n\n- Type: `string | undefined`\n\nAdditional descriptive text that appears below the input field\nto provide more context or instructions to the user.\n\n### `error`\n\n- Type: `string | undefined`\n\nError message to display when the field has an invalid value.\n\n### `required`\n\n- Type: `boolean | undefined`\n\nIndicates if the field is required. When false, adds a \"Optional\"\nindicator next to the label.\n\n### `disabled`\n\n- Type: `boolean | undefined`\n\nWhether the input is disabled\n\n### `accessibilityLabel`\n\n- Type: `string | undefined`\n\nOverrides the text that's read by the screen reader when the user interacts with the element. By default, the\nlabel is constructed by traversing all the children and accumulating all the Text nodes separated by space.\n\n### `button`\n\n- Type: `ReactElement<any, string | JSXElementConstructor<any>> | undefined`\n- Detailed type: `undefined | ReactElement<any, string | JSXElementConstructor<any>>`\n\nButton to display at the end of the input\nMust be used with FieldButton component\n\n@example\n\n````\n```tsx\n<TextInput button={<FieldButton icon=\"Eye\" />} />\n```\n````\n\n### `placeholder`\n\n- Type: `string | undefined`\n\nThe string that will be rendered before text input has been entered\n\n### `icon`\n\n- Type: `IconName | undefined`\n- Detailed type: `undefined | \"Youtube\" | \"X\" | \"Write\" | \"WorkingProfessional\" | \"WifiOff\" | \"Wifi\" | \"Whiteboard\" | \"WhatsApp\" | \"WalletFilled\" | \"Wallet\" | \"VocabLetter\" | \"VocabFilled\" | \"Vocab\" | \"ViewList\" | \"ViewCard\" | \"VideoStop\" | \"VideoStart\" | \"UserGroup\" | \"UserAbsent\" | \"User\" | \"Upload\" | \"Unlock\" | \"Undo\" | \"Trial\" | \"TranslateVocab\" | \"TransferHours\" | \"TranscriptOff\" | \"Transcript\" | \"ToggleSidebar\" | \"Todo\" | \"Timeoff\" | \"Tiles\" | \"TikTok\" | \"ThumbsUpFilled\" | \"ThumbsUp\" | \"ThumbsDownFilled\" | \"ThumbsDown\" | \"TextUnderline\" | \"TextStrikethrough\" | \"TextShort\" | \"TextLong\" | \"TextItalic\" | \"TextColor\" | \"TextBold\" | \"TechnicalIssue\" | \"Tag\" | \"Table\" | \"SuperTutor\" | \"SubscriptionRenewal\" | \"Study\" | \"Streak\" | \"StarFilled\" | \"Star\" | \"Stamp\" | \"SpeaksFace\" | \"Speaks\" | \"SparkleVocab\" | \"SparkleReset\" | \"SparkleNote\" | \"SparkleMessage\" | \"SparkleCalendar\" | \"Sparkle\" | \"SoundWave\" | \"SoundOff\" | \"Sound\" | \"SortDescending\" | \"SortAscending\" | \"Sort\" | \"Slow\" | \"SignUp\" | \"ShieldFilled\" | \"Shield\" | \"ShareAndroid\" | \"ShareAlt\" | \"Share\" | \"SettingsFilled\" | \"Settings\" | \"Send\" | \"SearchNavbar\" | \"SearchFilled\" | \"Search\" | \"ScreenshareStart\" | \"ScreenshareEnd\" | \"ScheduleWarning\" | \"Schedule\" | \"SavedVocab\" | \"SaveFilled\" | \"Save\" | \"RotateRight\" | \"RotateLeft\" | \"RotateImageRight\" | \"RotateImageLeft\" | \"RolePlay\" | \"Resume\" | \"Restore\" | \"Reset\" | \"RescheduleAlt\" | \"Reschedule\" | \"Reply\" | \"Replay10s\" | \"Remove\" | \"Refresh\" | \"Redo\" | \"Reddit\" | \"Reactions\" | \"Quote\" | \"Quora\" | \"Queue\" | \"QuestionMark\" | \"ProgressAlt\" | \"Progress\" | \"ProfessionalTutor\" | \"PreplySymbol\" | \"PracticeLightningFilled\" | \"PracticeLightning\" | \"Practice\" | \"Pocket\" | \"Plus\" | \"Play\" | \"PlacementProgressTest\" | \"PhotoUpload\" | \"PhotoCamera\" | \"Phone\" | \"Perplexity\" | \"Payed\" | \"Pause\" | \"Pages\" | \"NotesWithPad\" | \"Notes\" | \"Notebook\" | \"NextUp\" | \"MusicNote\" | \"More\" | \"Minus\" | \"MicrophoneOff\" | \"Microphone\" | \"MetaAI\" | \"Messenger\" | \"MessagesFilled\" | \"Messages\" | \"Menu\" | \"Mathematics\" | \"Mark\" | \"Mail\" | \"MagicWand\" | \"LogOut\" | \"LogIn\" | \"Lock\" | \"LocationFilled\" | \"Location\" | \"ListNumber\" | \"ListBullet\" | \"LinkedIn\" | \"LinkAlt\" | \"Link\" | \"Lightning\" | \"LibraryExplore\" | \"LibraryExplain\" | \"LibraryAdd\" | \"Library\" | \"LevelHeavy\" | \"Level\" | \"Lessons\" | \"Leave\" | \"Language\" | \"Keyboard\" | \"Key\" | \"Instagram\" | \"Insights\" | \"InfoLightBulb\" | \"Info\" | \"ImageAdd\" | \"Hourglass\" | \"HomeFilled\" | \"Home\" | \"History\" | \"HighlightColor\" | \"HelpCenter\" | \"Help\" | \"GoogleMonochrome\" | \"Gift\" | \"GeminiGoogleAI\" | \"Gallery\" | \"FullscreenExpand\" | \"FullscreenCollapse\" | \"Forward10s\" | \"FloatingStart\" | \"FloatingOff\" | \"Flag\" | \"FinishFlag\" | \"FilterApplied\" | \"Filter\" | \"File\" | \"FavFilled\" | \"Fav\" | \"Facebook\" | \"EyeHide\" | \"Eye\" | \"Exit\" | \"ExerciseVocabOpenGap\" | \"ExerciseVocabClosedGap\" | \"ExerciseVideoMultiChoice\" | \"ExerciseTextWarning\" | \"ExerciseTextQuestion\" | \"ExerciseTextError\" | \"ExerciseTextClosedGaps\" | \"ExerciseRephrase\" | \"ExerciseOpenWriting\" | \"ExerciseOpenGaps\" | \"ExerciseMultiChoice\" | \"ExerciseImageText\" | \"ExerciseDialogTextClosedGap\" | \"ExerciseDialogText\" | \"ExerciseDialogSpeach\" | \"ExerciseDialogHidden\" | \"ExerciseConversationStarer\" | \"ExerciseClosedGapsJumble\" | \"ErrorWarning\" | \"Error\" | \"EmojiWinking\" | \"EmojiStarryEyes\" | \"EmojiSmiling\" | \"EmojiSmile\" | \"EmojiNeutral\" | \"EmojiGrinning\" | \"EmojiFrowning\" | \"EmojiDisappointed\" | \"EmojiConfused\" | \"EmojiAngry\" | \"EmojiAdd\" | \"Email\" | \"Edit\" | \"DragAndDrop\" | \"Download\" | \"DoubleThumbsUpFilled\" | \"DoubleThumbsUp\" | \"DeviceIssue\" | \"DetailedFeedback\" | \"Delete\" | \"Dashboard\" | \"Crosswords\" | \"CreditCard\" | \"Copy\" | \"ConnectionOff\" | \"Confirmed\" | \"Compass\" | \"Close\" | \"ClockFilled\" | \"ClockFavorite\" | \"ClockConfirm\" | \"Clock\" | \"Claude\" | \"ChevronUpHeavy\" | \"ChevronUp\" | \"ChevronRight\" | \"ChevronLeft\" | \"ChevronDownHeavy\" | \"ChevronDown\" | \"Checkmark\" | \"CheckCircleFilled\" | \"CheckCircle\" | \"CheckBox\" | \"CheckBadge\" | \"Check\" | \"ChatGPT\" | \"Certificate\" | \"Celebrate\" | \"Canvas\" | \"Cancel\" | \"CalendarToday\" | \"CalendarFilled\" | \"Calendar\" | \"Bug\" | \"BirthdayCake\" | \"Bing\" | \"BellOff\" | \"BellFilled\" | \"Bell\" | \"Backspace\" | \"B2bLearnersBadge\" | \"Availability8Night\" | \"Availability7LateNight\" | \"Availability6LateEvening\" | \"Availability5Evening\" | \"Availability4Midday\" | \"Availability3Day\" | \"Availability2Morning\" | \"Availability1EarlyMorning\" | \"Attachments\" | \"Attach\" | \"ArrowTop\" | \"ArrowRight\" | \"ArrowLeft\" | \"ArrowDown\" | \"ArrowDouble\" | \"Archive\" | \"Apple\" | \"Annotate\"`\n\nIcon to display at the start of the input\n\n@example\n\n````\n```tsx\n<TextInput icon=\"Search\" />\n```\n````\n\n### `onFocus`\n\n- Type: `((e: NativeSyntheticEvent<TextInputFocusEventData>) => void) | undefined`\n\nCallback that is called when the text input is focused\n\n### `onBlur`\n\n- Type: `((e: NativeSyntheticEvent<TextInputFocusEventData>) => void) | undefined`\n\nCallback that is called when the text input is blurred\n\n### `onChangeText`\n\n- Type: `((text: string) => void) | undefined`\n\nCallback that is called when the text input's text changes.\nChanged text is passed as an argument to the callback handler.\n\n### `onChange`\n\n- Type: `((e: NativeSyntheticEvent<TextInputChangeEventData>) => void) | undefined`\n\nCallback that is called when the text input's text changes.\n\n### `onKeyPress`\n\n- Type: `((e: NativeSyntheticEvent<TextInputKeyPressEventData>) => void) | undefined`\n\nCallback that is called when a key is pressed.\nThis will be called with\n `{ nativeEvent: { key: keyValue } }`\nwhere keyValue is 'Enter' or 'Backspace' for respective keys and the typed-in character otherwise including ' ' for space.\n\nFires before onChange callbacks.\nNote: on Android only the inputs from soft keyboard are handled, not the hardware keyboard inputs.\n\n### `onSubmitEditing`\n\n- Type: `((e: NativeSyntheticEvent<TextInputSubmitEditingEventData>) => void) | undefined`\n\nCallback that is called when the text input's submit button is pressed.\n\n### `clearButtonMode`\n\n- Type: `\"never\" | \"while-editing\" | \"unless-editing\" | \"always\" | undefined`\n\nenum('never', 'while-editing', 'unless-editing', 'always')\nWhen the clear button should appear on the right side of the text view\n\n### `autoComplete`\n\n- Type: `\"name\" | \"additional-name\" | \"address-line1\" | \"address-line2\" | \"birthdate-day\" | \"birthdate-full\" | \"birthdate-month\" | \"birthdate-year\" | \"cc-csc\" | \"cc-exp\" | \"cc-exp-day\" | ... 46 more ... | undefined`\n- Detailed type: `undefined | \"name\" | \"additional-name\" | \"address-line1\" | \"address-line2\" | \"birthdate-day\" | \"birthdate-full\" | \"birthdate-month\" | \"birthdate-year\" | \"cc-csc\" | \"cc-exp\" | \"cc-exp-day\" | \"cc-exp-month\" | \"cc-exp-year\" | \"cc-number\" | \"cc-name\" | \"cc-given-name\" | \"cc-middle-name\" | \"cc-family-name\" | \"cc-type\" | \"country\" | \"current-password\" | \"email\" | \"family-name\" | \"gender\" | \"given-name\" | \"honorific-prefix\" | \"honorific-suffix\" | \"name-family\" | \"name-given\" | \"name-middle\" | \"name-middle-initial\" | \"name-prefix\" | \"name-suffix\" | \"new-password\" | \"nickname\" | \"one-time-code\" | \"organization\" | \"organization-title\" | \"password\" | \"password-new\" | \"postal-address\" | \"postal-address-country\" | \"postal-address-extended\" | \"postal-address-extended-postal-code\" | \"postal-address-locality\" | \"postal-address-region\" | \"postal-code\" | \"street-address\" | \"sms-otp\" | \"tel\" | \"tel-country-code\" | \"tel-national\" | \"tel-device\" | \"url\" | \"username\" | \"username-new\" | \"off\"`\n\nSpecifies autocomplete hints for the system, so it can provide autofill.\nOn Android, the system will always attempt to offer autofill by using heuristics to identify the type of content.\nTo disable autocomplete, set autoComplete to off.\n\nThe following values work across platforms:\n\n- `additional-name`\n- `address-line1`\n- `address-line2`\n- `cc-number`\n- `country`\n- `current-password`\n- `email`\n- `family-name`\n- `given-name`\n- `honorific-prefix`\n- `honorific-suffix`\n- `name`\n- `new-password`\n- `off`\n- `one-time-code`\n- `postal-code`\n- `street-address`\n- `tel`\n- `username`\n\nThe following values work on iOS only:\n\n- `nickname`\n- `organization`\n- `organization-title`\n- `url`\n\nThe following values work on Android only:\n\n- `birthdate-day`\n- `birthdate-full`\n- `birthdate-month`\n- `birthdate-year`\n- `cc-csc`\n- `cc-exp`\n- `cc-exp-day`\n- `cc-exp-month`\n- `cc-exp-year`\n- `gender`\n- `name-family`\n- `name-given`\n- `name-middle`\n- `name-middle-initial`\n- `name-prefix`\n- `name-suffix`\n- `password`\n- `password-new`\n- `postal-address`\n- `postal-address-country`\n- `postal-address-extended`\n- `postal-address-extended-postal-code`\n- `postal-address-locality`\n- `postal-address-region`\n- `sms-otp`\n- `tel-country-code`\n- `tel-national`\n- `tel-device`\n- `username-new`\n\n### `autoFocus`\n\n- Type: `boolean | undefined`\n\nIf true, focuses the input on componentDidMount.\nThe default value is false.\n\n### `autoCorrect`\n\n- Type: `boolean | undefined`\n\nIf false, disables auto-correct.\nThe default value is true.\n\n### `autoCapitalize`\n\n- Type: `\"none\" | \"sentences\" | \"words\" | \"characters\" | undefined`\n\nCan tell TextInput to automatically capitalize certain characters.\n characters: all characters,\n words: first letter of each word\n sentences: first letter of each sentence (default)\n none: don't auto capitalize anything\n\nhttps://reactnative.dev/docs/textinput#autocapitalize\n\n### `defaultValue`\n\n- Type: `string | undefined`\n\nProvides an initial value that will change when the user starts typing.\nUseful for simple use-cases where you don't want to deal with listening to events\nand updating the value prop to keep the controlled state in sync.\n\n### `value`\n\n- Type: `string | undefined`\n\nThe value to show for the text input. TextInput is a controlled component,\nwhich means the native value will be forced to match this value prop if provided.\nFor most uses this works great, but in some cases this may cause flickering - one common cause is preventing edits by keeping value the same.\nIn addition to simply setting the same value, either set editable={false},\nor set/update maxLength to prevent unwanted edits without flicker.\n\n### `inputMode`\n\n- Type: `InputModeOptions | undefined`\n- Detailed type: `undefined | \"none\" | \"email\" | \"tel\" | \"url\" | \"text\" | \"decimal\" | \"numeric\" | \"search\"`\n\nWorks like the inputmode attribute in HTML, it determines which keyboard to open, e.g. numeric and has precedence over keyboardType.\n\n### `maxLength`\n\n- Type: `number | undefined`\n\nLimits the maximum number of characters that can be entered.\nUse this instead of implementing the logic in JS to avoid flicker.\n\n### `returnKeyType`\n\n- Type: `ReturnKeyTypeOptions | undefined`\n- Detailed type: `undefined | \"none\" | \"join\" | \"search\" | \"done\" | \"go\" | \"next\" | \"send\" | \"previous\" | \"default\" | \"google\" | \"route\" | \"yahoo\" | \"emergency-call\"`\n\nenum('default', 'go', 'google', 'join', 'next', 'route', 'search', 'send', 'yahoo', 'done', 'emergency-call')\nDetermines how the return key should look.\n\n### `keyboardType`\n\n- Type: `KeyboardTypeOptions | undefined`\n- Detailed type: `undefined | \"url\" | \"numeric\" | \"default\" | \"number-pad\" | \"decimal-pad\" | \"email-address\" | \"phone-pad\" | \"visible-password\" | \"ascii-capable\" | \"numbers-and-punctuation\" | \"name-phone-pad\" | \"twitter\" | \"web-search\"`\n\nenum(\"default\", 'numeric', 'email-address', \"ascii-capable\", 'numbers-and-punctuation', 'url', 'number-pad', 'phone-pad', 'name-phone-pad',\n'decimal-pad', 'twitter', 'web-search', 'visible-password')\nDetermines which keyboard to open, e.g.numeric.\nThe following values work across platforms: - default - numeric - email-address - phone-pad\nThe following values work on iOS: - ascii-capable - numbers-and-punctuation - url - number-pad - name-phone-pad - decimal-pad - twitter - web-search\nThe following values work on Android: - visible-password\n\n### `ref`\n\n- Type: `LegacyRef<TextInput> | undefined`\n- Detailed type: `undefined | null | string | (instance: TextInput | null) => void | RefObject<TextInput>`\n\nAllows getting a ref to the component instance.\nOnce the component unmounts, React will set `ref.current` to `null`\n(or call the ref with `null` if you passed a callback ref).\n\n@see\n\n{@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs}\n\n### `key`\n\n- Type: `Key | null | undefined`\n- Detailed type: `undefined | null | string | number | bigint`"
|
|
35319
35327
|
},
|
|
35320
35328
|
TextareaField: {
|
|
35321
35329
|
meta: {
|
|
@@ -37979,7 +37987,7 @@ var As = class extends Ts {
|
|
|
37979
37987
|
}, js = {
|
|
37980
37988
|
name: "@preply/ds-ai-core",
|
|
37981
37989
|
description: "Shared AI tools for the Preply Design System",
|
|
37982
|
-
version: "11.
|
|
37990
|
+
version: "11.4.0",
|
|
37983
37991
|
publishConfig: { access: "public" },
|
|
37984
37992
|
type: "module",
|
|
37985
37993
|
exports: { ".": {
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@preply/ds-ai-cli",
|
|
3
3
|
"description": "CLI for querying the Preply Design System",
|
|
4
|
-
"version": "11.
|
|
4
|
+
"version": "11.4.0",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
7
7
|
},
|
|
@@ -22,11 +22,11 @@
|
|
|
22
22
|
"vite-plugin-dts": "^4.5.4"
|
|
23
23
|
},
|
|
24
24
|
"dependencies": {
|
|
25
|
-
"@preply/ds-ai-core": "11.
|
|
25
|
+
"@preply/ds-ai-core": "11.4.0",
|
|
26
26
|
"commander": "^14.0.0",
|
|
27
27
|
"zod": "^4.3.6",
|
|
28
28
|
"zod-commander": "^0.1.0",
|
|
29
29
|
"zod-opts": "^1.0.0"
|
|
30
30
|
},
|
|
31
|
-
"gitHead": "
|
|
31
|
+
"gitHead": "52791629120eb960b6567cbf261ee0ec6a254286"
|
|
32
32
|
}
|