@preply/ds-ai-core 11.1.0 → 11.3.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/index.js +32 -28
- package/package.json +4 -4
package/dist/index.js
CHANGED
|
@@ -6666,6 +6666,10 @@ var gi = re([
|
|
|
6666
6666
|
web: "TokyoUISpeaksFace",
|
|
6667
6667
|
"react-native": "SpeaksFace"
|
|
6668
6668
|
},
|
|
6669
|
+
{
|
|
6670
|
+
web: "TokyoUIStamp",
|
|
6671
|
+
"react-native": "Stamp"
|
|
6672
|
+
},
|
|
6669
6673
|
{
|
|
6670
6674
|
web: "TokyoUIStar",
|
|
6671
6675
|
"react-native": "Star"
|
|
@@ -34361,7 +34365,7 @@ var Ni = de({
|
|
|
34361
34365
|
import: "import { AccordionItem } from '@preply/ds-web-lib';",
|
|
34362
34366
|
description: "A single `Accordion` item, the wrapper of AccordionHeader and AccordionContent."
|
|
34363
34367
|
},
|
|
34364
|
-
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### `
|
|
34368
|
+
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`"
|
|
34365
34369
|
},
|
|
34366
34370
|
AccordionHeader: {
|
|
34367
34371
|
meta: {
|
|
@@ -34409,7 +34413,7 @@ var Ni = de({
|
|
|
34409
34413
|
import: "import { AlertBannerAction } from '@preply/ds-web-lib';",
|
|
34410
34414
|
description: "The AlertBannerAction is a container that sets defaults when Button or IconButton are passed."
|
|
34411
34415
|
},
|
|
34412
|
-
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### `
|
|
34416
|
+
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}"
|
|
34413
34417
|
},
|
|
34414
34418
|
AlertBannerIcon: {
|
|
34415
34419
|
meta: {
|
|
@@ -34505,7 +34509,7 @@ var Ni = de({
|
|
|
34505
34509
|
import: "import { Button } from '@preply/ds-web-lib';",
|
|
34506
34510
|
description: ""
|
|
34507
34511
|
},
|
|
34508
|
-
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### `
|
|
34512
|
+
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`"
|
|
34509
34513
|
},
|
|
34510
34514
|
CalloutBanner: {
|
|
34511
34515
|
meta: {
|
|
@@ -34585,7 +34589,7 @@ var Ni = de({
|
|
|
34585
34589
|
import: "import { Checkbox } from '@preply/ds-web-lib';",
|
|
34586
34590
|
description: "To make this accessible, you must label it using a `<label>` or `aria-label`:"
|
|
34587
34591
|
},
|
|
34588
|
-
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### `
|
|
34592
|
+
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`"
|
|
34589
34593
|
},
|
|
34590
34594
|
SingleSelectChips: {
|
|
34591
34595
|
meta: {
|
|
@@ -34593,7 +34597,7 @@ var Ni = de({
|
|
|
34593
34597
|
import: "import { SingleSelectChips } from '@preply/ds-web-lib';",
|
|
34594
34598
|
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."
|
|
34595
34599
|
},
|
|
34596
|
-
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, \"
|
|
34600
|
+
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>`"
|
|
34597
34601
|
},
|
|
34598
34602
|
SingleSelectChipsItem: {
|
|
34599
34603
|
meta: {
|
|
@@ -34601,7 +34605,7 @@ var Ni = de({
|
|
|
34601
34605
|
import: "import { SingleSelectChipsItem } from '@preply/ds-web-lib';",
|
|
34602
34606
|
description: "Individual chip item for use within SingleSelectChips."
|
|
34603
34607
|
},
|
|
34604
|
-
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### `
|
|
34608
|
+
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`"
|
|
34605
34609
|
},
|
|
34606
34610
|
MultiSelectChips: {
|
|
34607
34611
|
meta: {
|
|
@@ -34609,7 +34613,7 @@ var Ni = de({
|
|
|
34609
34613
|
import: "import { MultiSelectChips } from '@preply/ds-web-lib';",
|
|
34610
34614
|
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."
|
|
34611
34615
|
},
|
|
34612
|
-
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, \"
|
|
34616
|
+
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>`"
|
|
34613
34617
|
},
|
|
34614
34618
|
MultiSelectChipsItem: {
|
|
34615
34619
|
meta: {
|
|
@@ -34617,7 +34621,7 @@ var Ni = de({
|
|
|
34617
34621
|
import: "import { MultiSelectChipsItem } from '@preply/ds-web-lib';",
|
|
34618
34622
|
description: "Individual chip item for use within MultiSelectChips."
|
|
34619
34623
|
},
|
|
34620
|
-
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### `
|
|
34624
|
+
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`"
|
|
34621
34625
|
},
|
|
34622
34626
|
DismissibleChips: {
|
|
34623
34627
|
meta: {
|
|
@@ -34625,7 +34629,7 @@ var Ni = de({
|
|
|
34625
34629
|
import: "import { DismissibleChips } from '@preply/ds-web-lib';",
|
|
34626
34630
|
description: "A chips component for displaying dismissible/removable items."
|
|
34627
34631
|
},
|
|
34628
|
-
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, \"
|
|
34632
|
+
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>`"
|
|
34629
34633
|
},
|
|
34630
34634
|
DismissibleChipsItem: {
|
|
34631
34635
|
meta: {
|
|
@@ -34633,7 +34637,7 @@ var Ni = de({
|
|
|
34633
34637
|
import: "import { DismissibleChipsItem } from '@preply/ds-web-lib';",
|
|
34634
34638
|
description: "Individual dismissible chip item for use within DismissibleChips."
|
|
34635
34639
|
},
|
|
34636
|
-
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### `
|
|
34640
|
+
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`"
|
|
34637
34641
|
},
|
|
34638
34642
|
createOnboardingTour: {
|
|
34639
34643
|
meta: {
|
|
@@ -34738,7 +34742,7 @@ var Ni = de({
|
|
|
34738
34742
|
import: "import { DialogStepsNext } from '@preply/ds-web-lib';",
|
|
34739
34743
|
description: ""
|
|
34740
34744
|
},
|
|
34741
|
-
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### `
|
|
34745
|
+
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`"
|
|
34742
34746
|
},
|
|
34743
34747
|
DialogStepsPrevious: {
|
|
34744
34748
|
meta: {
|
|
@@ -34746,7 +34750,7 @@ var Ni = de({
|
|
|
34746
34750
|
import: "import { DialogStepsPrevious } from '@preply/ds-web-lib';",
|
|
34747
34751
|
description: ""
|
|
34748
34752
|
},
|
|
34749
|
-
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### `
|
|
34753
|
+
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`"
|
|
34750
34754
|
},
|
|
34751
34755
|
Divider: {
|
|
34752
34756
|
meta: {
|
|
@@ -34882,7 +34886,7 @@ var Ni = de({
|
|
|
34882
34886
|
import: "import { IconButton } from '@preply/ds-web-lib';",
|
|
34883
34887
|
description: ""
|
|
34884
34888
|
},
|
|
34885
|
-
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### `
|
|
34889
|
+
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`"
|
|
34886
34890
|
},
|
|
34887
34891
|
LayoutFlex: {
|
|
34888
34892
|
meta: {
|
|
@@ -34922,7 +34926,7 @@ var Ni = de({
|
|
|
34922
34926
|
import: "import { Link } from '@preply/ds-web-lib';",
|
|
34923
34927
|
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."
|
|
34924
34928
|
},
|
|
34925
|
-
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### `
|
|
34929
|
+
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`"
|
|
34926
34930
|
},
|
|
34927
34931
|
Loader: {
|
|
34928
34932
|
meta: {
|
|
@@ -34970,7 +34974,7 @@ var Ni = de({
|
|
|
34970
34974
|
import: "import { PreplyLogo } from '@preply/ds-web-lib';",
|
|
34971
34975
|
description: ""
|
|
34972
34976
|
},
|
|
34973
|
-
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`"
|
|
34977
|
+
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`"
|
|
34974
34978
|
},
|
|
34975
34979
|
ProgressBar: {
|
|
34976
34980
|
meta: {
|
|
@@ -35002,7 +35006,7 @@ var Ni = de({
|
|
|
35002
35006
|
import: "import { RatingInput } from '@preply/ds-web-lib';",
|
|
35003
35007
|
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."
|
|
35004
35008
|
},
|
|
35005
|
-
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### `
|
|
35009
|
+
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`"
|
|
35006
35010
|
},
|
|
35007
35011
|
SelectField: {
|
|
35008
35012
|
meta: {
|
|
@@ -35042,7 +35046,7 @@ var Ni = de({
|
|
|
35042
35046
|
import: "import { Slider } from '@preply/ds-web-lib';",
|
|
35043
35047
|
description: "A slider input that allows users to select a single value from a range."
|
|
35044
35048
|
},
|
|
35045
|
-
docs: "# Slider\n\n```\nimport { Slider } from '@preply/ds-web-lib';\n```\n\nA slider input that allows users to select a single value from a range.\n\n@example\n\n```\nUncontrolled\n<Slider />\n<Slider defaultValue={50} />\nControlled\nconst [value, setValue] = useState(50)\n<Slider value={value} onValueChange={setValue} />\n```\n\n## Props\n\n### `id`\n\n- Type: `string | undefined`\n\nThe unique identifier for the range slider element.\n\n### `aria-label`\n\n- Type: `string | undefined`\n\nAccessible label for the range slider.\n\n### `aria-labelledby`\n\n- Type: `string | undefined`\n\nID of the element that labels the range slider.\n\n### `aria-describedby`\n\n- Type: `string | undefined`\n\nID of the element that describes the range slider.\n\n### `aria-invalid`\n\n- Type: `boolean | undefined`\n\nIndicates whether the range slider value is invalid.\n\n### `aria-errormessage`\n\n- Type: `string | undefined`\n\nID of the element that describes the error, if any.\n\n### `value`\n\n- Type: `number | undefined`\n\nThe controlled value of the slider.\nMust be used in conjunction with `onValueChange`.\n\n### `defaultValue`\n\n- Type: `number | undefined`\n- Default value: `0`\n\nThe value of the slider when initially rendered.\nUse when you do not need to control the state of the slider.\n\n### `onValueChange`\n\n- Type: `((value: number) => void) | undefined`\n\nEvent handler called when the value changes.\n\n### `name`\n\n- Type: `string | undefined`\n\nThe name of the slider. Submitted with its owning form as part of a name/value pair.\n\n### `min`\n\n- Type: `number | undefined`\n- Default value: `0`\n\nThe minimum value for the slider.\n\n### `max`\n\n- Type: `number | undefined`\n- Default value: `100`\n\nThe maximum value for the slider.\n\n### `step`\n\n- Type: `number | undefined`\n- Default value: `1`\n\nThe slider stepping interval.\n\n### `dataset`\n\n- Type: `Dataset | undefined`\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`"
|
|
35049
|
+
docs: "# Slider\n\n```\nimport { Slider } from '@preply/ds-web-lib';\n```\n\nA slider input that allows users to select a single value from a range.\n\n@example\n\n```\nUncontrolled\n<Slider />\n<Slider defaultValue={50} />\nControlled\nconst [value, setValue] = useState(50)\n<Slider value={value} onValueChange={setValue} />\n```\n\n## Props\n\n### `id`\n\n- Type: `string | undefined`\n\nThe unique identifier for the range slider element.\n\n### `aria-label`\n\n- Type: `string | undefined`\n\nAccessible label for the range slider.\n\n### `aria-labelledby`\n\n- Type: `string | undefined`\n\nID of the element that labels the range slider.\n\n### `aria-describedby`\n\n- Type: `string | undefined`\n\nID of the element that describes the range slider.\n\n### `aria-invalid`\n\n- Type: `boolean | undefined`\n\nIndicates whether the range slider value is invalid.\n\n### `aria-errormessage`\n\n- Type: `string | undefined`\n\nID of the element that describes the error, if any.\n\n### `value`\n\n- Type: `number | undefined`\n\nThe controlled value of the slider.\nMust be used in conjunction with `onValueChange`.\n\n### `defaultValue`\n\n- Type: `number | undefined`\n- Default value: `0`\n\nThe value of the slider when initially rendered.\nUse when you do not need to control the state of the slider.\n\n### `onValueChange`\n\n- Type: `((value: number) => void) | undefined`\n\nEvent handler called when the value changes.\n\n### `onValueCommit`\n\n- Type: `((value: number) => void) | undefined`\n\nEvent handler called when the value is committed (e.g. on pointer up or Enter key).\n\n### `name`\n\n- Type: `string | undefined`\n\nThe name of the slider. Submitted with its owning form as part of a name/value pair.\n\n### `min`\n\n- Type: `number | undefined`\n- Default value: `0`\n\nThe minimum value for the slider.\n\n### `max`\n\n- Type: `number | undefined`\n- Default value: `100`\n\nThe maximum value for the slider.\n\n### `step`\n\n- Type: `number | undefined`\n- Default value: `1`\n\nThe slider stepping interval.\n\n### `dataset`\n\n- Type: `Dataset | undefined`\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`"
|
|
35046
35050
|
},
|
|
35047
35051
|
RangeSlider: {
|
|
35048
35052
|
meta: {
|
|
@@ -35050,7 +35054,7 @@ var Ni = de({
|
|
|
35050
35054
|
import: "import { RangeSlider } from '@preply/ds-web-lib';",
|
|
35051
35055
|
description: "A slider input that allows users to select a range between two values."
|
|
35052
35056
|
},
|
|
35053
|
-
docs: "# RangeSlider\n\n```\nimport { RangeSlider } from '@preply/ds-web-lib';\n```\n\nA slider input that allows users to select a range between two values.\n\n@example\n\n```\nUncontrolled\n<RangeSlider defaultValue={[25, 75]} />\nControlled\nconst [value, setValue] = useState([25, 75])\n<RangeSlider value={value} onValueChange={setValue} />\nWith minimum steps between thumbs\n<RangeSlider defaultValue={[20, 80]} minStepsBetweenThumbs={10} />\n```\n\n## Props\n\n### `id`\n\n- Type: `string | undefined`\n\nThe unique identifier for the range slider element.\n\n### `aria-label`\n\n- Type: `string | undefined`\n\nAccessible label for the range slider.\n\n### `aria-labelledby`\n\n- Type: `string | undefined`\n\nID of the element that labels the range slider.\n\n### `aria-describedby`\n\n- Type: `string | undefined`\n\nID of the element that describes the range slider.\n\n### `aria-invalid`\n\n- Type: `boolean | undefined`\n\nIndicates whether the range slider value is invalid.\n\n### `aria-errormessage`\n\n- Type: `string | undefined`\n\nID of the element that describes the error, if any.\n\n### `value`\n\n- Type: `RangeSliderValue | undefined`\n\nThe controlled value of the range slider.\nMust be used in conjunction with `onValueChange`.\n\n### `defaultValue`\n\n- Type: `RangeSliderValue | undefined`\n- Default value: `[0, 100]`\n\nThe value of the range slider when initially rendered.\nUse when you do not need to control the state of the range slider.\n\n### `onValueChange`\n\n- Type: `((value: RangeSliderValue) => void) | undefined`\n\nEvent handler called when the value changes.\n\n### `name`\n\n- Type: `string | undefined`\n\nThe name of the range slider. Submitted with its owning form as part of a name/value pair.\n\n### `min`\n\n- Type: `number | undefined`\n- Default value: `0`\n\nThe minimum value for the range slider.\n\n### `max`\n\n- Type: `number | undefined`\n- Default value: `100`\n\nThe maximum value for the range slider.\n\n### `step`\n\n- Type: `number | undefined`\n- Default value: `1`\n\nThe slider stepping interval.\n\n### `minStepsBetweenThumbs`\n\n- Type: `number | undefined`\n- Default value: `0`\n\nThe minimum permitted steps between thumbs.\n\n### `dataset`\n\n- Type: `Dataset | undefined`\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`"
|
|
35057
|
+
docs: "# RangeSlider\n\n```\nimport { RangeSlider } from '@preply/ds-web-lib';\n```\n\nA slider input that allows users to select a range between two values.\n\n@example\n\n```\nUncontrolled\n<RangeSlider defaultValue={[25, 75]} />\nControlled\nconst [value, setValue] = useState([25, 75])\n<RangeSlider value={value} onValueChange={setValue} />\nWith minimum steps between thumbs\n<RangeSlider defaultValue={[20, 80]} minStepsBetweenThumbs={10} />\n```\n\n## Props\n\n### `id`\n\n- Type: `string | undefined`\n\nThe unique identifier for the range slider element.\n\n### `aria-label`\n\n- Type: `string | undefined`\n\nAccessible label for the range slider.\n\n### `aria-labelledby`\n\n- Type: `string | undefined`\n\nID of the element that labels the range slider.\n\n### `aria-describedby`\n\n- Type: `string | undefined`\n\nID of the element that describes the range slider.\n\n### `aria-invalid`\n\n- Type: `boolean | undefined`\n\nIndicates whether the range slider value is invalid.\n\n### `aria-errormessage`\n\n- Type: `string | undefined`\n\nID of the element that describes the error, if any.\n\n### `value`\n\n- Type: `RangeSliderValue | undefined`\n\nThe controlled value of the range slider.\nMust be used in conjunction with `onValueChange`.\n\n### `defaultValue`\n\n- Type: `RangeSliderValue | undefined`\n- Default value: `[0, 100]`\n\nThe value of the range slider when initially rendered.\nUse when you do not need to control the state of the range slider.\n\n### `onValueChange`\n\n- Type: `((value: RangeSliderValue) => void) | undefined`\n\nEvent handler called when the value changes.\n\n### `onValueCommit`\n\n- Type: `((value: RangeSliderValue) => void) | undefined`\n\nEvent handler called when the value is committed (e.g. on pointer up or Enter key).\n\n### `name`\n\n- Type: `string | undefined`\n\nThe name of the range slider. Submitted with its owning form as part of a name/value pair.\n\n### `min`\n\n- Type: `number | undefined`\n- Default value: `0`\n\nThe minimum value for the range slider.\n\n### `max`\n\n- Type: `number | undefined`\n- Default value: `100`\n\nThe maximum value for the range slider.\n\n### `step`\n\n- Type: `number | undefined`\n- Default value: `1`\n\nThe slider stepping interval.\n\n### `minStepsBetweenThumbs`\n\n- Type: `number | undefined`\n- Default value: `0`\n\nThe minimum permitted steps between thumbs.\n\n### `dataset`\n\n- Type: `Dataset | undefined`\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`"
|
|
35054
35058
|
},
|
|
35055
35059
|
Steps: {
|
|
35056
35060
|
meta: {
|
|
@@ -35130,7 +35134,7 @@ var Ni = de({
|
|
|
35130
35134
|
import: "import { Tooltip } from '@preply/ds-web-lib';",
|
|
35131
35135
|
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."
|
|
35132
35136
|
},
|
|
35133
|
-
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### `
|
|
35137
|
+
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`"
|
|
35134
35138
|
},
|
|
35135
35139
|
usePortalElement: {
|
|
35136
35140
|
meta: {
|
|
@@ -35245,7 +35249,7 @@ var Ni = de({
|
|
|
35245
35249
|
import: "import { Badge } from '@preply/ds-rn-lib';",
|
|
35246
35250
|
description: ""
|
|
35247
35251
|
},
|
|
35248
|
-
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````"
|
|
35252
|
+
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\" | \"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````"
|
|
35249
35253
|
},
|
|
35250
35254
|
Button: {
|
|
35251
35255
|
meta: {
|
|
@@ -35253,7 +35257,7 @@ var Ni = de({
|
|
|
35253
35257
|
import: "import { Button } from '@preply/ds-rn-lib';",
|
|
35254
35258
|
description: ""
|
|
35255
35259
|
},
|
|
35256
|
-
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"
|
|
35260
|
+
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\" | \"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\" | \"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"
|
|
35257
35261
|
},
|
|
35258
35262
|
Heading: {
|
|
35259
35263
|
meta: {
|
|
@@ -35269,7 +35273,7 @@ var Ni = de({
|
|
|
35269
35273
|
import: "import { FieldButton } from '@preply/ds-rn-lib';",
|
|
35270
35274
|
description: ""
|
|
35271
35275
|
},
|
|
35272
|
-
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`"
|
|
35276
|
+
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\" | \"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`"
|
|
35273
35277
|
},
|
|
35274
35278
|
FormControl: {
|
|
35275
35279
|
meta: {
|
|
@@ -35285,7 +35289,7 @@ var Ni = de({
|
|
|
35285
35289
|
import: "import { Icon } from '@preply/ds-rn-lib';",
|
|
35286
35290
|
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."
|
|
35287
35291
|
},
|
|
35288
|
-
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."
|
|
35292
|
+
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\" | \"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."
|
|
35289
35293
|
},
|
|
35290
35294
|
IconTile: {
|
|
35291
35295
|
meta: {
|
|
@@ -35293,7 +35297,7 @@ var Ni = de({
|
|
|
35293
35297
|
import: "import { IconTile } from '@preply/ds-rn-lib';",
|
|
35294
35298
|
description: "Requires `@preply/ds-rn-lib/dist/assets/PreplyDSIcons.ttf` font to be included in the project."
|
|
35295
35299
|
},
|
|
35296
|
-
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`"
|
|
35300
|
+
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\" | \"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`"
|
|
35297
35301
|
},
|
|
35298
35302
|
IconButton: {
|
|
35299
35303
|
meta: {
|
|
@@ -35301,7 +35305,7 @@ var Ni = de({
|
|
|
35301
35305
|
import: "import { IconButton } from '@preply/ds-rn-lib';",
|
|
35302
35306
|
description: ""
|
|
35303
35307
|
},
|
|
35304
|
-
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"
|
|
35308
|
+
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\" | \"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"
|
|
35305
35309
|
},
|
|
35306
35310
|
LayoutFlex: {
|
|
35307
35311
|
meta: {
|
|
@@ -35341,7 +35345,7 @@ var Ni = de({
|
|
|
35341
35345
|
import: "import { PasswordField } from '@preply/ds-rn-lib';",
|
|
35342
35346
|
description: ""
|
|
35343
35347
|
},
|
|
35344
|
-
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`"
|
|
35348
|
+
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\" | \"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`"
|
|
35345
35349
|
},
|
|
35346
35350
|
Text: {
|
|
35347
35351
|
meta: {
|
|
@@ -35365,7 +35369,7 @@ var Ni = de({
|
|
|
35365
35369
|
import: "import { TextField } from '@preply/ds-rn-lib';",
|
|
35366
35370
|
description: ""
|
|
35367
35371
|
},
|
|
35368
|
-
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`"
|
|
35372
|
+
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\" | \"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`"
|
|
35369
35373
|
},
|
|
35370
35374
|
TextareaField: {
|
|
35371
35375
|
meta: {
|
|
@@ -38071,7 +38075,7 @@ var As = class extends Ts {
|
|
|
38071
38075
|
}, js = {
|
|
38072
38076
|
name: "@preply/ds-ai-core",
|
|
38073
38077
|
description: "Shared AI tools for the Preply Design System",
|
|
38074
|
-
version: "11.
|
|
38078
|
+
version: "11.3.0",
|
|
38075
38079
|
publishConfig: { access: "public" },
|
|
38076
38080
|
type: "module",
|
|
38077
38081
|
exports: { ".": {
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@preply/ds-ai-core",
|
|
3
3
|
"description": "Shared AI tools for the Preply Design System",
|
|
4
|
-
"version": "11.
|
|
4
|
+
"version": "11.3.0",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
7
7
|
},
|
|
@@ -22,8 +22,8 @@
|
|
|
22
22
|
"dev": "vite build --watch"
|
|
23
23
|
},
|
|
24
24
|
"devDependencies": {
|
|
25
|
-
"@preply/ds-core": "11.
|
|
26
|
-
"@preply/ds-theme-tokyo-ui": "11.
|
|
25
|
+
"@preply/ds-core": "11.3.0",
|
|
26
|
+
"@preply/ds-theme-tokyo-ui": "11.3.0",
|
|
27
27
|
"@types/lunr": "^2.3.7",
|
|
28
28
|
"@types/node": "^24.12.0",
|
|
29
29
|
"front-matter": "^4.0.2",
|
|
@@ -44,5 +44,5 @@
|
|
|
44
44
|
"zod": "^3.23.8",
|
|
45
45
|
"zod-opts": "^1.0.0"
|
|
46
46
|
},
|
|
47
|
-
"gitHead": "
|
|
47
|
+
"gitHead": "7715829c87adcf2b4a52d234deb3bf6e0f0d2527"
|
|
48
48
|
}
|