diff --git a/www/apps/book/next.config.mjs b/www/apps/book/next.config.mjs index c8bb062421..92ad17f5ab 100644 --- a/www/apps/book/next.config.mjs +++ b/www/apps/book/next.config.mjs @@ -167,12 +167,12 @@ const nextConfig = { } }, redirects, - experimental: { - outputFileTracingExcludes: { - "*": ["node_modules/@medusajs/icons"], - }, + outputFileTracingExcludes: { + "*": ["node_modules/@medusajs/icons"], + }, + experimental: { + optimizePackageImports: ["@medusajs/icons", "@medusajs/ui"], }, - optimizePackageImports: ["@medusajs/icons", "@medusajs/ui"], } export default withMDX(nextConfig) diff --git a/www/apps/ui/src/components/component-reference.tsx b/www/apps/ui/src/components/component-reference.tsx index 12a77827ee..ec48af4b0a 100644 --- a/www/apps/ui/src/components/component-reference.tsx +++ b/www/apps/ui/src/components/component-reference.tsx @@ -66,7 +66,10 @@ const ComponentReference = ({ - + )} diff --git a/www/apps/ui/src/components/props-table.tsx b/www/apps/ui/src/components/props-table.tsx index b1b183ffc6..005c5942fd 100644 --- a/www/apps/ui/src/components/props-table.tsx +++ b/www/apps/ui/src/components/props-table.tsx @@ -45,7 +45,10 @@ const Row = ({ propData: { tsType: tsType, defaultValue, description }, }: RowProps) => { const normalizeRaw = (str: string): string => { - return str.replace("\\|", "|") + return str + .replace("\\|", "|") + .replaceAll("<", "<") + .replaceAll(">", ">") } const getTypeRaw = useCallback((type: PropSpecType): string => { let raw = "raw" in type ? type.raw || type.name : type.name @@ -74,9 +77,11 @@ const Row = ({ }, []) const getTypeTooltipContent = useCallback( (type: PropSpecType): string | undefined => { - if (type?.name === "signature" && "type" in type) { - return getTypeRaw(type) - } else if (type?.name === "Array" && type.raw) { + if ( + (type?.name === "signature" && "type" in type) || + (type?.name === "Array" && type.raw) || + ("raw" in type && type.raw) + ) { return getTypeRaw(type) } @@ -107,6 +112,11 @@ const Row = ({ text: element.value, canBeCopied: true, }) + } else if ("raw" in element) { + typeNodes.push({ + text: getTypeText(element), + tooltipContent: getTypeTooltipContent(element), + }) } else { typeNodes.push({ text: element.name, diff --git a/www/apps/ui/src/config/site.ts b/www/apps/ui/src/config/site.ts index da9c1cc4c0..cf938bf971 100644 --- a/www/apps/ui/src/config/site.ts +++ b/www/apps/ui/src/config/site.ts @@ -29,4 +29,8 @@ export const siteConfig: SiteConfig = { showCategories: true, }, logo: `${process.env.NEXT_PUBLIC_BASE_PATH}/images/logo.png`, + version: { + ...globalConfig.version, + hide: true, + }, } diff --git a/www/apps/ui/src/content/docs/components/drawer.mdx b/www/apps/ui/src/content/docs/components/drawer.mdx index 5172715793..a1ea942cec 100644 --- a/www/apps/ui/src/content/docs/components/drawer.mdx +++ b/www/apps/ui/src/content/docs/components/drawer.mdx @@ -31,4 +31,12 @@ import { Drawer } from "@medusajs/ui" --- - \ No newline at end of file + \ No newline at end of file diff --git a/www/apps/ui/src/content/docs/components/focus-modal.mdx b/www/apps/ui/src/content/docs/components/focus-modal.mdx index 43364b69f1..7e12611b07 100644 --- a/www/apps/ui/src/content/docs/components/focus-modal.mdx +++ b/www/apps/ui/src/content/docs/components/focus-modal.mdx @@ -30,8 +30,11 @@ import { FocusModal } from "@medusajs/ui" ## Example: Control Open State diff --git a/www/apps/ui/src/content/docs/components/select.mdx b/www/apps/ui/src/content/docs/components/select.mdx index 0d2012a9a9..3d8893f1e8 100644 --- a/www/apps/ui/src/content/docs/components/select.mdx +++ b/www/apps/ui/src/content/docs/components/select.mdx @@ -39,7 +39,8 @@ import { Select } from "@medusajs/ui" "Select.Value", "Select.Group", "Select.Label", - "Select.Item" + "Select.Item", + "Select.Content" ]} /> ## Examples @@ -50,6 +51,10 @@ import { Select } from "@medusajs/ui" +### Item-Aligned Position + + + ### Disabled diff --git a/www/apps/ui/src/examples/select-item-aligned.tsx b/www/apps/ui/src/examples/select-item-aligned.tsx new file mode 100644 index 0000000000..9620860110 --- /dev/null +++ b/www/apps/ui/src/examples/select-item-aligned.tsx @@ -0,0 +1,35 @@ +import { Select } from "@medusajs/ui" + +export default function SelectItemAligned() { + return ( +
+ +
+ ) +} + +const currencies = [ + { + value: "eur", + label: "EUR", + }, + { + value: "usd", + label: "USD", + }, + { + value: "dkk", + label: "DKK", + }, +] diff --git a/www/apps/ui/src/registries/example-registry.tsx b/www/apps/ui/src/registries/example-registry.tsx index e01e9e117b..bb571019f4 100644 --- a/www/apps/ui/src/registries/example-registry.tsx +++ b/www/apps/ui/src/registries/example-registry.tsx @@ -545,6 +545,11 @@ export const ExampleRegistry: Record = { component: React.lazy(async () => import("@/examples/button-loading")), file: "src/examples/button-loading.tsx", }, + "select-item-aligned": { + name: "select-item-aligned", + component: React.lazy(async () => import("@/examples/select-item-aligned")), + file: "src/examples/select-item-aligned.tsx", + }, "select-small": { name: "select-small", component: React.lazy(async () => import("@/examples/select-small")), diff --git a/www/apps/ui/src/specs/Avatar/Avatar.json b/www/apps/ui/src/specs/Avatar/Avatar.json index 7c4aeb1495..02580207f6 100644 --- a/www/apps/ui/src/specs/Avatar/Avatar.json +++ b/www/apps/ui/src/specs/Avatar/Avatar.json @@ -23,6 +23,20 @@ "computed": false }, "description": "The style of the avatar.", + "tsType": { + "name": "union", + "raw": "\"squared\" \\| \"rounded\"", + "elements": [ + { + "name": "literal", + "value": "\"squared\"" + }, + { + "name": "literal", + "value": "\"rounded\"" + } + ] + }, "required": false }, "size": { @@ -31,6 +45,36 @@ "computed": false }, "description": "The size of the avatar's border radius.", + "tsType": { + "name": "union", + "raw": "\"2xsmall\" \\| \"xsmall\" \\| \"small\" \\| \"base\" \\| \"large\" \\| \"xlarge\"", + "elements": [ + { + "name": "literal", + "value": "\"2xsmall\"" + }, + { + "name": "literal", + "value": "\"xsmall\"" + }, + { + "name": "literal", + "value": "\"small\"" + }, + { + "name": "literal", + "value": "\"base\"" + }, + { + "name": "literal", + "value": "\"large\"" + }, + { + "name": "literal", + "value": "\"xlarge\"" + } + ] + }, "required": false } }, diff --git a/www/apps/ui/src/specs/Badge/Badge.json b/www/apps/ui/src/specs/Badge/Badge.json index 7bab26d789..704563da4e 100644 --- a/www/apps/ui/src/specs/Badge/Badge.json +++ b/www/apps/ui/src/specs/Badge/Badge.json @@ -20,6 +20,32 @@ "computed": false }, "description": "The badge's size.", + "tsType": { + "name": "union", + "raw": "\"2xsmall\" \\| \"xsmall\" \\| \"small\" \\| \"base\" \\| \"large\"", + "elements": [ + { + "name": "literal", + "value": "\"2xsmall\"" + }, + { + "name": "literal", + "value": "\"xsmall\"" + }, + { + "name": "literal", + "value": "\"small\"" + }, + { + "name": "literal", + "value": "\"base\"" + }, + { + "name": "literal", + "value": "\"large\"" + } + ] + }, "required": false }, "rounded": { @@ -28,6 +54,20 @@ "computed": false }, "description": "The style of the badge's border radius.", + "tsType": { + "name": "union", + "raw": "\"base\" \\| \"full\"", + "elements": [ + { + "name": "literal", + "value": "\"base\"" + }, + { + "name": "literal", + "value": "\"full\"" + } + ] + }, "required": false }, "color": { @@ -36,6 +76,36 @@ "computed": false }, "description": "The badge's color.", + "tsType": { + "name": "union", + "raw": "\"green\" \\| \"red\" \\| \"blue\" \\| \"orange\" \\| \"grey\" \\| \"purple\"", + "elements": [ + { + "name": "literal", + "value": "\"green\"" + }, + { + "name": "literal", + "value": "\"red\"" + }, + { + "name": "literal", + "value": "\"blue\"" + }, + { + "name": "literal", + "value": "\"orange\"" + }, + { + "name": "literal", + "value": "\"grey\"" + }, + { + "name": "literal", + "value": "\"purple\"" + } + ] + }, "required": false } }, diff --git a/www/apps/ui/src/specs/Button/Button.json b/www/apps/ui/src/specs/Button/Button.json index 5df64cf8dc..711731f585 100644 --- a/www/apps/ui/src/specs/Button/Button.json +++ b/www/apps/ui/src/specs/Button/Button.json @@ -31,6 +31,28 @@ "computed": false }, "description": "The button's style.", + "tsType": { + "name": "union", + "raw": "\"primary\" \\| \"transparent\" \\| \"secondary\" \\| \"danger\"", + "elements": [ + { + "name": "literal", + "value": "\"primary\"" + }, + { + "name": "literal", + "value": "\"transparent\"" + }, + { + "name": "literal", + "value": "\"secondary\"" + }, + { + "name": "literal", + "value": "\"danger\"" + } + ] + }, "required": false }, "size": { @@ -39,6 +61,28 @@ "computed": false }, "description": "The button's size.", + "tsType": { + "name": "union", + "raw": "\"small\" \\| \"base\" \\| \"large\" \\| \"xlarge\"", + "elements": [ + { + "name": "literal", + "value": "\"small\"" + }, + { + "name": "literal", + "value": "\"base\"" + }, + { + "name": "literal", + "value": "\"large\"" + }, + { + "name": "literal", + "value": "\"xlarge\"" + } + ] + }, "required": false } }, diff --git a/www/apps/ui/src/specs/Calendar/Calendar.json b/www/apps/ui/src/specs/Calendar/Calendar.json index 7a6948450e..810be4e479 100644 --- a/www/apps/ui/src/specs/Calendar/Calendar.json +++ b/www/apps/ui/src/specs/Calendar/Calendar.json @@ -1,106 +1,105 @@ { - "description": "", + "description": "Calendar component used to select a date.\nIts props are based on [React Aria Calendar](https://react-spectrum.adobe.com/react-aria/Calendar.html#calendar-1).", "methods": [], "displayName": "Calendar", "props": { - "value": { + "autoFocus": { + "description": "Whether to automatically focus the calendar when it mounts.", "required": false, "tsType": { - "name": "union", - "raw": "Date | null", - "elements": [ - { - "name": "Date" - }, - { - "name": "null" - } - ] - }, - "description": "" + "name": "boolean" + } }, - "defaultValue": { + "defaultFocusedValue": { + "description": "The date that is focused when the calendar first mounts (uncountrolled).", "required": false, "tsType": { - "name": "union", - "raw": "Date | null", - "elements": [ - { - "name": "Date" - }, - { - "name": "null" - } - ] - }, - "description": "" + "name": "DateValue", + "elements": [], + "raw": "DateValue" + } }, - "onChange": { + "errorMessage": { + "description": "An error message to display when the selected value is invalid.", + "required": false, + "tsType": { + "name": "ReactNode", + "elements": [], + "raw": "ReactNode" + } + }, + "focusedValue": { + "description": "Controls the currently focused date within the calendar.", + "required": false, + "tsType": { + "name": "DateValue", + "elements": [], + "raw": "DateValue" + } + }, + "isDisabled": { + "description": "Whether the calendar is disabled.", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "isInvalid": { + "description": "Whether the current selection is invalid according to application logic.", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "isReadOnly": { + "description": "Whether the calendar value is immutable.", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "onFocusChange": { + "description": "Handler that is called when the focused date changes.", "required": false, "tsType": { "name": "signature", "type": "function", - "raw": "(value: Date | null) => void", + "raw": "(date: CalendarDate) => void", "signature": { "arguments": [ { + "name": "date", "type": { - "name": "union", - "raw": "Date | null", - "elements": [ - { - "name": "Date" - }, - { - "name": "null" - } - ] + "name": "CalendarDate", + "elements": [], + "raw": "CalendarDate" }, - "name": "value" + "rest": false } ], "return": { "name": "void" } } - }, - "description": "" + } }, - "isDateUnavailable": { + "pageBehavior": { + "description": "Controls the behavior of paging. Pagination either works by advancing the visible page by visibleDuration (default) or one unit of visibleDuration.", "required": false, "tsType": { - "name": "signature", - "type": "function", - "raw": "(date: Date) => boolean", - "signature": { - "arguments": [ - { - "type": { - "name": "Date" - }, - "name": "date" - } - ], - "return": { - "name": "boolean" - } - } - }, - "description": "" + "name": "PageBehavior", + "elements": [], + "raw": "PageBehavior" + } }, - "minValue": { + "validationState": { + "description": "Whether the current selection is valid or invalid according to application logic.", "required": false, "tsType": { - "name": "Date" - }, - "description": "" - }, - "maxValue": { - "required": false, - "tsType": { - "name": "Date" - }, - "description": "" + "name": "ValidationState", + "elements": [], + "raw": "ValidationState" + } } }, "composes": [ diff --git a/www/apps/ui/src/specs/CurrencyInput/CurrencyInput.json b/www/apps/ui/src/specs/CurrencyInput/CurrencyInput.json index 41e71edb4e..9e8acd91a9 100644 --- a/www/apps/ui/src/specs/CurrencyInput/CurrencyInput.json +++ b/www/apps/ui/src/specs/CurrencyInput/CurrencyInput.json @@ -23,7 +23,238 @@ "computed": false }, "description": "The input's size.", + "tsType": { + "name": "union", + "raw": "\"small\" \\| \"base\"", + "elements": [ + { + "name": "literal", + "value": "\"small\"" + }, + { + "name": "literal", + "value": "\"base\"" + } + ] + }, "required": false + }, + "allowDecimals": { + "description": "Allow decimals\n\nDefault = true", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "allowNegativeValue": { + "description": "Allow user to enter negative value\n\nDefault = true", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "className": { + "description": "Class names", + "required": false, + "tsType": { + "name": "string" + } + }, + "customInput": { + "description": "Custom component\n\nDefault = ", + "required": false, + "tsType": { + "name": "ElementType", + "elements": [], + "raw": "ElementType" + } + }, + "decimalScale": { + "description": "Specify decimal scale for padding/trimming\n\nExample:\n 1.5 -> 1.50\n 1.234 -> 1.23", + "required": false, + "tsType": { + "name": "number" + } + }, + "decimalSeparator": { + "description": "Separator between integer part and fractional part of value.\n\nThis cannot be a number", + "required": false, + "tsType": { + "name": "string" + } + }, + "decimalsLimit": { + "description": "Limit length of decimals allowed\n\nDefault = 2", + "required": false, + "tsType": { + "name": "number" + } + }, + "defaultValue": { + "description": "Default value if not passing in value via props", + "required": false, + "tsType": { + "name": "union", + "raw": "string \\| number", + "elements": [ + { + "name": "string" + }, + { + "name": "number" + } + ] + } + }, + "disableAbbreviations": { + "description": "Disable abbreviations (m, k, b)\n\nDefault = false", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "disabled": { + "description": "Disabled\n\nDefault = false", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "disableGroupSeparators": { + "description": "Disable auto adding separator between values eg. 1000 -> 1,000\n\nDefault = false", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "fixedDecimalLength": { + "description": "Value will always have the specified length of decimals\n\nExample:\n 123 -> 1.23\n\nNote: This formatting only happens onBlur", + "required": false, + "tsType": { + "name": "number" + } + }, + "formatValueOnBlur": { + "description": "When set to false, the formatValueOnBlur flag disables the application of the __onValueChange__ function\nspecifically on blur events. If disabled or set to false, the onValueChange will not trigger on blur.\nDefault = true", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "groupSeparator": { + "description": "Separator between thousand, million and billion\n\nThis cannot be a number", + "required": false, + "tsType": { + "name": "string" + } + }, + "id": { + "description": "Component id", + "required": false, + "tsType": { + "name": "string" + } + }, + "intlConfig": { + "description": "International locale config, examples:\n { locale: 'ja-JP', currency: 'JPY' }\n { locale: 'en-IN', currency: 'INR' }\n\nAny prefix, groupSeparator or decimalSeparator options passed in\nwill override Intl Locale config", + "required": false, + "tsType": { + "name": "IntlConfig", + "elements": [], + "raw": "IntlConfig" + } + }, + "maxLength": { + "description": "Maximum characters the user can enter", + "required": false, + "tsType": { + "name": "number" + } + }, + "onValueChange": { + "description": "Handle change in value", + "required": false, + "tsType": { + "name": "signature", + "type": "function", + "raw": "(value: undefined \\| string, name?: string, values?: CurrencyInputOnChangeValues) => void", + "signature": { + "arguments": [ + { + "name": "value", + "type": { + "name": "union", + "raw": "undefined \\| string", + "elements": [ + { + "name": "undefined" + }, + { + "name": "string" + } + ] + }, + "rest": false + }, + { + "name": "name", + "type": { + "name": "string" + }, + "rest": false + }, + { + "name": "values", + "type": { + "name": "CurrencyInputOnChangeValues", + "elements": [], + "raw": "CurrencyInputOnChangeValues" + }, + "rest": false + } + ], + "return": { + "name": "void" + } + } + } + }, + "placeholder": { + "description": "Placeholder if there is no value", + "required": false, + "tsType": { + "name": "string" + } + }, + "step": { + "description": "Incremental value change on arrow down and arrow up key press", + "required": false, + "tsType": { + "name": "number" + } + }, + "transformRawValue": { + "description": "Transform the raw value form the input before parsing", + "required": false, + "tsType": { + "name": "signature", + "type": "function", + "raw": "(rawValue: string) => string", + "signature": { + "arguments": [ + { + "name": "rawValue", + "type": { + "name": "string" + }, + "rest": false + } + ], + "return": { + "name": "string" + } + } + } } }, "composes": [ diff --git a/www/apps/ui/src/specs/DatePicker/DatePicker.json b/www/apps/ui/src/specs/DatePicker/DatePicker.json index 2b243c483b..98518af738 100644 --- a/www/apps/ui/src/specs/DatePicker/DatePicker.json +++ b/www/apps/ui/src/specs/DatePicker/DatePicker.json @@ -3,29 +3,420 @@ "methods": [], "displayName": "DatePicker", "props": { - "size": { - "defaultValue": { - "value": "\"base\"", - "computed": false - }, - "description": "", - "required": false + "aria-describedby": { + "description": "Identifies the element (or elements) that describes the object.", + "required": false, + "tsType": { + "name": "string" + } }, - "shouldCloseOnSelect": { - "defaultValue": { - "value": "true", - "computed": false - }, - "description": "", - "required": false + "aria-details": { + "description": "Identifies the element (or elements) that provide a detailed, extended description for the object.", + "required": false, + "tsType": { + "name": "string" + } }, - "modal": { - "defaultValue": { - "value": "false", - "computed": false - }, - "description": "", - "required": false + "aria-label": { + "description": "Defines a string value that labels the current element.", + "required": false, + "tsType": { + "name": "string" + } + }, + "aria-labelledby": { + "description": "Identifies the element (or elements) that labels the current element.", + "required": false, + "tsType": { + "name": "string" + } + }, + "autoFocus": { + "description": "Whether the element should receive focus on render.", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "defaultOpen": { + "description": "Whether the overlay is open by default (uncontrolled).", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "description": { + "description": "A description for the field. Provides a hint such as specific requirements for what to choose.", + "required": false, + "tsType": { + "name": "ReactNode", + "elements": [], + "raw": "ReactNode" + } + }, + "errorMessage": { + "description": "An error message for the field.", + "required": false, + "tsType": { + "name": "union", + "raw": "ReactNode \\| (v: ValidationResult) => ReactNode", + "elements": [ + { + "name": "ReactNode", + "elements": [], + "raw": "ReactNode" + }, + { + "name": "signature", + "type": "function", + "raw": "(v: ValidationResult) => ReactNode", + "signature": { + "arguments": [ + { + "name": "v", + "type": { + "name": "ValidationResult" + }, + "rest": false + } + ], + "return": { + "name": "ReactNode" + } + } + } + ] + } + }, + "hideTimeZone": { + "description": "Whether to hide the time zone abbreviation.", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "hourCycle": { + "description": "Whether to display the time in 12 or 24 hour format. By default, this is determined by the user's locale.", + "required": false, + "tsType": { + "name": "union", + "raw": "12 \\| 24", + "elements": [ + { + "name": "literal", + "value": "12" + }, + { + "name": "literal", + "value": "24" + } + ] + } + }, + "id": { + "description": "The element's unique identifier. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id).", + "required": false, + "tsType": { + "name": "string" + } + }, + "isDisabled": { + "description": "Whether the input is disabled.", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "isInvalid": { + "description": "Whether the input value is invalid.", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "isOpen": { + "description": "Whether the overlay is open by default (controlled).", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "isReadOnly": { + "description": "Whether the input can be selected but not changed by the user.", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "isRequired": { + "description": "Whether user input is required on the input before form submission.", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "label": { + "description": "The content to display as the label.", + "required": false, + "tsType": { + "name": "ReactNode", + "elements": [], + "raw": "ReactNode" + } + }, + "name": { + "description": "The name of the input element, used when submitting an HTML form. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefname).", + "required": false, + "tsType": { + "name": "string" + } + }, + "onBlur": { + "description": "Handler that is called when the element loses focus.", + "required": false, + "tsType": { + "name": "signature", + "type": "function", + "raw": "(e: FocusEvent<Element, Element>) => void", + "signature": { + "arguments": [ + { + "name": "e", + "type": { + "name": "FocusEvent", + "elements": [], + "raw": "FocusEvent<Element, Element>" + }, + "rest": false + } + ], + "return": { + "name": "void" + } + } + } + }, + "onFocus": { + "description": "Handler that is called when the element receives focus.", + "required": false, + "tsType": { + "name": "signature", + "type": "function", + "raw": "(e: FocusEvent<Element, Element>) => void", + "signature": { + "arguments": [ + { + "name": "e", + "type": { + "name": "FocusEvent", + "elements": [], + "raw": "FocusEvent<Element, Element>" + }, + "rest": false + } + ], + "return": { + "name": "void" + } + } + } + }, + "onFocusChange": { + "description": "Handler that is called when the element's focus status changes.", + "required": false, + "tsType": { + "name": "signature", + "type": "function", + "raw": "(isFocused: boolean) => void", + "signature": { + "arguments": [ + { + "name": "isFocused", + "type": { + "name": "boolean" + }, + "rest": false + } + ], + "return": { + "name": "void" + } + } + } + }, + "onKeyDown": { + "description": "Handler that is called when a key is pressed.", + "required": false, + "tsType": { + "name": "signature", + "type": "function", + "raw": "(e: KeyboardEvent) => void", + "signature": { + "arguments": [ + { + "name": "e", + "type": { + "name": "KeyboardEvent", + "elements": [], + "raw": "KeyboardEvent" + }, + "rest": false + } + ], + "return": { + "name": "void" + } + } + } + }, + "onKeyUp": { + "description": "Handler that is called when a key is released.", + "required": false, + "tsType": { + "name": "signature", + "type": "function", + "raw": "(e: KeyboardEvent) => void", + "signature": { + "arguments": [ + { + "name": "e", + "type": { + "name": "KeyboardEvent", + "elements": [], + "raw": "KeyboardEvent" + }, + "rest": false + } + ], + "return": { + "name": "void" + } + } + } + }, + "onOpenChange": { + "description": "Handler that is called when the overlay's open state changes.", + "required": false, + "tsType": { + "name": "signature", + "type": "function", + "raw": "(isOpen: boolean) => void", + "signature": { + "arguments": [ + { + "name": "isOpen", + "type": { + "name": "boolean" + }, + "rest": false + } + ], + "return": { + "name": "void" + } + } + } + }, + "pageBehavior": { + "description": "Controls the behavior of paging. Pagination either works by advancing the visible page by visibleDuration (default) or one unit of visibleDuration.", + "required": false, + "tsType": { + "name": "PageBehavior", + "elements": [], + "raw": "PageBehavior" + } + }, + "placeholderValue": { + "description": "A placeholder date that influences the format of the placeholder shown when no value is selected. Defaults to today's date at midnight.", + "required": false, + "tsType": { + "name": "union", + "raw": "CalendarDate \\| CalendarDateTime", + "elements": [ + { + "name": "CalendarDate", + "elements": [], + "raw": "CalendarDate" + }, + { + "name": "CalendarDateTime", + "elements": [], + "raw": "CalendarDateTime" + } + ] + } + }, + "shouldForceLeadingZeros": { + "description": "Whether to always show leading zeros in the month, day, and hour fields.\nBy default, this is determined by the user's locale.", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "validate": { + "description": "A function that returns an error message if a given value is invalid.\nValidation errors are displayed to the user when the form is submitted\nif `validationBehavior=\"native\"`. For realtime validation, use the `isInvalid`\nprop instead.", + "required": false, + "tsType": { + "name": "signature", + "type": "function", + "raw": "(value: CalendarDate \\| CalendarDateTime) => undefined \\| null \\| true \\| ValidationError", + "signature": { + "arguments": [ + { + "name": "value", + "type": { + "name": "union", + "raw": "CalendarDate \\| CalendarDateTime", + "elements": [ + { + "name": "CalendarDate" + }, + { + "name": "CalendarDateTime" + } + ] + }, + "rest": false + } + ], + "return": { + "name": "union", + "raw": "undefined \\| null \\| true \\| ValidationError", + "elements": [ + { + "name": "undefined" + }, + { + "name": "null" + }, + { + "name": "true" + }, + { + "name": "ValidationError" + } + ] + } + } + } + }, + "validationBehavior": { + "description": "Whether to use native HTML form validation to prevent form submission\nwhen the value is missing or invalid, or mark the field as required\nor invalid via ARIA.", + "required": false, + "tsType": { + "name": "union", + "raw": "\"aria\" \\| \"native\"", + "elements": [ + { + "name": "literal", + "value": "\"aria\"" + }, + { + "name": "literal", + "value": "\"native\"" + } + ] + } } } } \ No newline at end of file diff --git a/www/apps/ui/src/specs/Drawer/Drawer.Body.json b/www/apps/ui/src/specs/Drawer/Drawer.Body.json index 5c705c8e2e..7982efedfc 100644 --- a/www/apps/ui/src/specs/Drawer/Drawer.Body.json +++ b/www/apps/ui/src/specs/Drawer/Drawer.Body.json @@ -1,5 +1,5 @@ { - "description": "", + "description": "This component is used to wrap the body content of the drawer.\nThis component is based on the `div` element and supports all of its props", "methods": [], "displayName": "Drawer.Body", "props": {} diff --git a/www/apps/ui/src/specs/Drawer/Drawer.Close.json b/www/apps/ui/src/specs/Drawer/Drawer.Close.json index 465f795600..412c55a932 100644 --- a/www/apps/ui/src/specs/Drawer/Drawer.Close.json +++ b/www/apps/ui/src/specs/Drawer/Drawer.Close.json @@ -1,5 +1,5 @@ { - "description": "", + "description": "This component is used to create the close button for the drawer.\nIt accepts props from the [Radix UI Dialog Close](https://www.radix-ui.com/primitives/docs/components/dialog#close) component.", "methods": [], "displayName": "Drawer.Close", "props": {} diff --git a/www/apps/ui/src/specs/Drawer/Drawer.Content.json b/www/apps/ui/src/specs/Drawer/Drawer.Content.json index 9443ddef6b..afc957044d 100644 --- a/www/apps/ui/src/specs/Drawer/Drawer.Content.json +++ b/www/apps/ui/src/specs/Drawer/Drawer.Content.json @@ -1,6 +1,33 @@ { - "description": "", + "description": "This component wraps the content of the drawer.\nIt accepts props from the [Radix UI Dialog Content](https://www.radix-ui.com/primitives/docs/components/dialog#content) component.", "methods": [], "displayName": "Drawer.Content", - "props": {} + "props": { + "overlayProps": { + "required": false, + "tsType": { + "name": "ReactComponentPropsWithoutRef", + "raw": "React.ComponentPropsWithoutRef", + "elements": [ + { + "name": "DrawerOverlay" + } + ] + }, + "description": "Props for the overlay component.\nIt accepts props from the [Radix UI Dialog Overlay](https://www.radix-ui.com/primitives/docs/components/dialog#overlay) component." + }, + "portalProps": { + "required": false, + "tsType": { + "name": "ReactComponentPropsWithoutRef", + "raw": "React.ComponentPropsWithoutRef", + "elements": [ + { + "name": "DrawerPortal" + } + ] + }, + "description": "Props for the portal component that wraps the drawer content.\nIt accepts props from the [Radix UI Dialog Portal](https://www.radix-ui.com/primitives/docs/components/dialog#portal) component." + } + } } \ No newline at end of file diff --git a/www/apps/ui/src/specs/Drawer/Drawer.Description.json b/www/apps/ui/src/specs/Drawer/Drawer.Description.json index 2870e7a4ae..e3413f1b95 100644 --- a/www/apps/ui/src/specs/Drawer/Drawer.Description.json +++ b/www/apps/ui/src/specs/Drawer/Drawer.Description.json @@ -1,5 +1,5 @@ { - "description": "", + "description": "This component adds accessible description to the drawer.\nIt accepts props from the [Radix UI Dialog Description](https://www.radix-ui.com/primitives/docs/components/dialog#description) component.", "methods": [], "displayName": "Drawer.Description", "props": {} diff --git a/www/apps/ui/src/specs/Drawer/Drawer.Footer.json b/www/apps/ui/src/specs/Drawer/Drawer.Footer.json index be1d9bf90e..e7ed128e61 100644 --- a/www/apps/ui/src/specs/Drawer/Drawer.Footer.json +++ b/www/apps/ui/src/specs/Drawer/Drawer.Footer.json @@ -1,5 +1,5 @@ { - "description": "", + "description": "This component is used to wrap the footer content of the drawer.\nThis component is based on the `div` element and supports all of its props.", "methods": [], "displayName": "Drawer.Footer", "props": {} diff --git a/www/apps/ui/src/specs/Drawer/Drawer.Header.json b/www/apps/ui/src/specs/Drawer/Drawer.Header.json index 3334d880d8..e440e141e6 100644 --- a/www/apps/ui/src/specs/Drawer/Drawer.Header.json +++ b/www/apps/ui/src/specs/Drawer/Drawer.Header.json @@ -1,5 +1,5 @@ { - "description": "", + "description": "This component is used to wrap the header content of the drawer.\nThis component is based on the `div` element and supports all of its props.", "methods": [], "displayName": "Drawer.Header", "props": {} diff --git a/www/apps/ui/src/specs/Drawer/Drawer.Overlay.json b/www/apps/ui/src/specs/Drawer/Drawer.Overlay.json index b11e89700f..487eb075f5 100644 --- a/www/apps/ui/src/specs/Drawer/Drawer.Overlay.json +++ b/www/apps/ui/src/specs/Drawer/Drawer.Overlay.json @@ -1,5 +1,5 @@ { - "description": "", + "description": "This component is used to create the overlay for the drawer.\nIt accepts props from the [Radix UI Dialog Overlay](https://www.radix-ui.com/primitives/docs/components/dialog#overlay) component.", "methods": [], "displayName": "Drawer.Overlay", "props": {} diff --git a/www/apps/ui/src/specs/Drawer/Drawer.Portal.json b/www/apps/ui/src/specs/Drawer/Drawer.Portal.json index beb83060e7..2b328ee837 100644 --- a/www/apps/ui/src/specs/Drawer/Drawer.Portal.json +++ b/www/apps/ui/src/specs/Drawer/Drawer.Portal.json @@ -1,5 +1,6 @@ { - "description": "", + "description": "The `Drawer.Content` component uses this component to wrap the drawer content.\nIt accepts props from the [Radix UI Dialog Portal](https://www.radix-ui.com/primitives/docs/components/dialog#portal) component.", "methods": [], - "displayName": "Drawer.Portal" + "displayName": "Drawer.Portal", + "props": {} } \ No newline at end of file diff --git a/www/apps/ui/src/specs/Drawer/Drawer.Title.json b/www/apps/ui/src/specs/Drawer/Drawer.Title.json new file mode 100644 index 0000000000..43be43112a --- /dev/null +++ b/www/apps/ui/src/specs/Drawer/Drawer.Title.json @@ -0,0 +1,6 @@ +{ + "description": "This component adds an accessible title to the drawer.\nIt accepts props from the [Radix UI Dialog Title](https://www.radix-ui.com/primitives/docs/components/dialog#title) component.", + "methods": [], + "displayName": "Drawer.Title", + "props": {} +} \ No newline at end of file diff --git a/www/apps/ui/src/specs/Drawer/Drawer.Trigger.json b/www/apps/ui/src/specs/Drawer/Drawer.Trigger.json index e43b73b67d..bf119203ed 100644 --- a/www/apps/ui/src/specs/Drawer/Drawer.Trigger.json +++ b/www/apps/ui/src/specs/Drawer/Drawer.Trigger.json @@ -1,5 +1,5 @@ { - "description": "", + "description": "This component is used to create the trigger button that opens the drawer.\nIt accepts props from the [Radix UI Dialog Trigger](https://www.radix-ui.com/primitives/docs/components/dialog#trigger) component.", "methods": [], "displayName": "Drawer.Trigger", "props": {} diff --git a/www/apps/ui/src/specs/Drawer/Drawer.json b/www/apps/ui/src/specs/Drawer/Drawer.json index 7075deeb86..6ab6b2a2e9 100644 --- a/www/apps/ui/src/specs/Drawer/Drawer.json +++ b/www/apps/ui/src/specs/Drawer/Drawer.json @@ -1,5 +1,6 @@ { "description": "This component is based on the [Radix UI Dialog](https://www.radix-ui.com/primitives/docs/components/dialog) primitives.", "methods": [], - "displayName": "Drawer" + "displayName": "Drawer", + "props": {} } \ No newline at end of file diff --git a/www/apps/ui/src/specs/DropdownMenu/DropdownMenu.Group.json b/www/apps/ui/src/specs/DropdownMenu/DropdownMenu.Group.json new file mode 100644 index 0000000000..9f2dd91a65 --- /dev/null +++ b/www/apps/ui/src/specs/DropdownMenu/DropdownMenu.Group.json @@ -0,0 +1,6 @@ +{ + "description": "This component is based on the [Radix UI Dropdown Menu Group](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#group) primitive.", + "methods": [], + "displayName": "DropdownMenu.Group", + "props": {} +} \ No newline at end of file diff --git a/www/apps/ui/src/specs/DropdownMenu/DropdownMenu.RadioGroup.json b/www/apps/ui/src/specs/DropdownMenu/DropdownMenu.RadioGroup.json new file mode 100644 index 0000000000..c637fe1caa --- /dev/null +++ b/www/apps/ui/src/specs/DropdownMenu/DropdownMenu.RadioGroup.json @@ -0,0 +1,6 @@ +{ + "description": "This component is based on the [Radix UI Dropdown Menu RadioGroup](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#radiogroup) primitive.", + "methods": [], + "displayName": "DropdownMenu.RadioGroup", + "props": {} +} \ No newline at end of file diff --git a/www/apps/ui/src/specs/DropdownMenu/DropdownMenu.SubMenu.json b/www/apps/ui/src/specs/DropdownMenu/DropdownMenu.SubMenu.json new file mode 100644 index 0000000000..5080e8c007 --- /dev/null +++ b/www/apps/ui/src/specs/DropdownMenu/DropdownMenu.SubMenu.json @@ -0,0 +1,6 @@ +{ + "description": "This component is based on the [Radix UI Dropdown Menu Sub](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#sub) primitive.", + "methods": [], + "displayName": "DropdownMenu.SubMenu", + "props": {} +} \ No newline at end of file diff --git a/www/apps/ui/src/specs/DropdownMenu/DropdownMenu.Trigger.json b/www/apps/ui/src/specs/DropdownMenu/DropdownMenu.Trigger.json new file mode 100644 index 0000000000..efc5eea2ca --- /dev/null +++ b/www/apps/ui/src/specs/DropdownMenu/DropdownMenu.Trigger.json @@ -0,0 +1,6 @@ +{ + "description": "This component is based on the [Radix UI Dropdown Menu Trigger](https://www.radix-ui.com/primitives/docs/components/dropdown-menu#trigger) primitive.", + "methods": [], + "displayName": "DropdownMenu.Trigger", + "props": {} +} \ No newline at end of file diff --git a/www/apps/ui/src/specs/DropdownMenu/DropdownMenu.json b/www/apps/ui/src/specs/DropdownMenu/DropdownMenu.json new file mode 100644 index 0000000000..d44b7327df --- /dev/null +++ b/www/apps/ui/src/specs/DropdownMenu/DropdownMenu.json @@ -0,0 +1,6 @@ +{ + "description": "This component is based on the [Radix UI Dropdown Menu](https://www.radix-ui.com/primitives/docs/components/dropdown-menu) primitive.", + "methods": [], + "displayName": "DropdownMenu", + "props": {} +} \ No newline at end of file diff --git a/www/apps/ui/src/specs/FocusModal/FocusModal.Body.json b/www/apps/ui/src/specs/FocusModal/FocusModal.Body.json index 34109cdeb3..9da7c6047b 100644 --- a/www/apps/ui/src/specs/FocusModal/FocusModal.Body.json +++ b/www/apps/ui/src/specs/FocusModal/FocusModal.Body.json @@ -1,5 +1,5 @@ { - "description": "This component is based on the `div` element and supports all of its props", + "description": "This component is used to wrap the body content of the modal.\nThis component is based on the `div` element and supports all of its props", "methods": [], "displayName": "FocusModal.Body", "props": {} diff --git a/www/apps/ui/src/specs/FocusModal/FocusModal.Close.json b/www/apps/ui/src/specs/FocusModal/FocusModal.Close.json new file mode 100644 index 0000000000..9123923b83 --- /dev/null +++ b/www/apps/ui/src/specs/FocusModal/FocusModal.Close.json @@ -0,0 +1,6 @@ +{ + "description": "This component is used to create the close button for the modal.\nIt accepts props from the [Radix UI Dialog Close](https://www.radix-ui.com/primitives/docs/components/dialog#close) component.", + "methods": [], + "displayName": "FocusModal.Close", + "props": {} +} \ No newline at end of file diff --git a/www/apps/ui/src/specs/FocusModal/FocusModal.Content.json b/www/apps/ui/src/specs/FocusModal/FocusModal.Content.json index 7f82e78455..4e20777396 100644 --- a/www/apps/ui/src/specs/FocusModal/FocusModal.Content.json +++ b/www/apps/ui/src/specs/FocusModal/FocusModal.Content.json @@ -1,5 +1,5 @@ { - "description": "", + "description": "This component wraps the content of the modal.\nIt accepts props from the [Radix UI Dialog Content](https://www.radix-ui.com/primitives/docs/components/dialog#content) component.", "methods": [], "displayName": "FocusModal.Content", "props": {} diff --git a/www/apps/ui/src/specs/FocusModal/FocusModal.Description.json b/www/apps/ui/src/specs/FocusModal/FocusModal.Description.json new file mode 100644 index 0000000000..552c1f89a0 --- /dev/null +++ b/www/apps/ui/src/specs/FocusModal/FocusModal.Description.json @@ -0,0 +1,6 @@ +{ + "description": "This component adds accessible description to the modal.\nIt accepts props from the [Radix UI Dialog Description](https://www.radix-ui.com/primitives/docs/components/dialog#description) component.", + "methods": [], + "displayName": "FocusModal.Description", + "props": {} +} \ No newline at end of file diff --git a/www/apps/ui/src/specs/FocusModal/FocusModal.Footer.json b/www/apps/ui/src/specs/FocusModal/FocusModal.Footer.json index 446ff0278a..99fc484b05 100644 --- a/www/apps/ui/src/specs/FocusModal/FocusModal.Footer.json +++ b/www/apps/ui/src/specs/FocusModal/FocusModal.Footer.json @@ -1,5 +1,5 @@ { - "description": "", + "description": "This component is used to wrap the footer content of the modal.\nThis component is based on the `div` element and supports all of its props", "methods": [], "displayName": "FocusModal.Footer", "props": {} diff --git a/www/apps/ui/src/specs/FocusModal/FocusModal.Header.json b/www/apps/ui/src/specs/FocusModal/FocusModal.Header.json index d64b4b7595..e0c3a272d5 100644 --- a/www/apps/ui/src/specs/FocusModal/FocusModal.Header.json +++ b/www/apps/ui/src/specs/FocusModal/FocusModal.Header.json @@ -1,5 +1,5 @@ { - "description": "This component is based on the `div` element and supports all of its props", + "description": "This component is used to wrap the header content of the modal.\nThis component is based on the `div` element and supports all of its props", "methods": [], "displayName": "FocusModal.Header", "props": {} diff --git a/www/apps/ui/src/specs/FocusModal/FocusModal.Overlay.json b/www/apps/ui/src/specs/FocusModal/FocusModal.Overlay.json index 98c21a3245..87734399a4 100644 --- a/www/apps/ui/src/specs/FocusModal/FocusModal.Overlay.json +++ b/www/apps/ui/src/specs/FocusModal/FocusModal.Overlay.json @@ -1,5 +1,5 @@ { - "description": "", + "description": "This component is used to create the overlay for the modal.\nIt accepts props from the [Radix UI Dialog Overlay](https://www.radix-ui.com/primitives/docs/components/dialog#overlay) component.", "methods": [], "displayName": "FocusModal.Overlay", "props": {} diff --git a/www/apps/ui/src/specs/FocusModal/FocusModal.Portal.json b/www/apps/ui/src/specs/FocusModal/FocusModal.Portal.json index 0cda9f3995..bf17cc017a 100644 --- a/www/apps/ui/src/specs/FocusModal/FocusModal.Portal.json +++ b/www/apps/ui/src/specs/FocusModal/FocusModal.Portal.json @@ -1,5 +1,6 @@ { - "description": "", + "description": "The `FocusModal.Content` component uses this component to wrap the modal content.\nIt accepts props from the [Radix UI Dialog Portal](https://www.radix-ui.com/primitives/docs/components/dialog#portal) component.", "methods": [], - "displayName": "FocusModal.Portal" + "displayName": "FocusModal.Portal", + "props": {} } \ No newline at end of file diff --git a/www/apps/ui/src/specs/FocusModal/FocusModal.Title.json b/www/apps/ui/src/specs/FocusModal/FocusModal.Title.json index e5463afafd..318b41fc30 100644 --- a/www/apps/ui/src/specs/FocusModal/FocusModal.Title.json +++ b/www/apps/ui/src/specs/FocusModal/FocusModal.Title.json @@ -1,5 +1,5 @@ { - "description": "", + "description": "This component adds an accessible title to the modal.\nIt accepts props from the [Radix UI Dialog Title](https://www.radix-ui.com/primitives/docs/components/dialog#title) component.", "methods": [], "displayName": "FocusModal.Title", "props": {} diff --git a/www/apps/ui/src/specs/FocusModal/FocusModal.Trigger.json b/www/apps/ui/src/specs/FocusModal/FocusModal.Trigger.json index 13e8f38884..40b3cc2ca3 100644 --- a/www/apps/ui/src/specs/FocusModal/FocusModal.Trigger.json +++ b/www/apps/ui/src/specs/FocusModal/FocusModal.Trigger.json @@ -1,5 +1,6 @@ { - "description": "", + "description": "This component is used to create the trigger button that opens the modal.\nIt accepts props from the [Radix UI Dialog Trigger](https://www.radix-ui.com/primitives/docs/components/dialog#trigger) component.", "methods": [], - "displayName": "FocusModal.Trigger" + "displayName": "FocusModal.Trigger", + "props": {} } \ No newline at end of file diff --git a/www/apps/ui/src/specs/FocusModal/FocusModal.json b/www/apps/ui/src/specs/FocusModal/FocusModal.json index 2d62eba459..2cfe26139a 100644 --- a/www/apps/ui/src/specs/FocusModal/FocusModal.json +++ b/www/apps/ui/src/specs/FocusModal/FocusModal.json @@ -1,5 +1,44 @@ { "description": "This component is based on the [Radix UI Dialog](https://www.radix-ui.com/primitives/docs/components/dialog) primitives.", "methods": [], - "displayName": "FocusModal" + "displayName": "FocusModal", + "props": { + "defaultOpen": { + "description": "Whether the modal is opened by default.", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "open": { + "description": "Whether the modal is opened.", + "required": false, + "tsType": { + "name": "boolean" + } + }, + "onOpenChange": { + "description": "A function to handle when the modal is opened or closed.", + "required": false, + "tsType": { + "name": "signature", + "type": "function", + "raw": "(open: boolean) => void", + "signature": { + "arguments": [ + { + "name": "open", + "type": { + "name": "boolean" + }, + "rest": false + } + ], + "return": { + "name": "void" + } + } + } + } + } } \ No newline at end of file diff --git a/www/apps/ui/src/specs/Heading/Heading.json b/www/apps/ui/src/specs/Heading/Heading.json index 7cae733c78..0526017155 100644 --- a/www/apps/ui/src/specs/Heading/Heading.json +++ b/www/apps/ui/src/specs/Heading/Heading.json @@ -9,6 +9,24 @@ "computed": false }, "description": "The heading level which specifies which heading element is used.", + "tsType": { + "name": "union", + "raw": "\"h1\" \\| \"h2\" \\| \"h3\"", + "elements": [ + { + "name": "literal", + "value": "\"h1\"" + }, + { + "name": "literal", + "value": "\"h2\"" + }, + { + "name": "literal", + "value": "\"h3\"" + } + ] + }, "required": false } }, diff --git a/www/apps/ui/src/specs/Hint/Hint.json b/www/apps/ui/src/specs/Hint/Hint.json index 6f6fd9b664..43277d7509 100644 --- a/www/apps/ui/src/specs/Hint/Hint.json +++ b/www/apps/ui/src/specs/Hint/Hint.json @@ -9,6 +9,20 @@ "computed": false }, "description": "The hint's style.", + "tsType": { + "name": "union", + "raw": "\"error\" \\| \"info\"", + "elements": [ + { + "name": "literal", + "value": "\"error\"" + }, + { + "name": "literal", + "value": "\"info\"" + } + ] + }, "required": false } }, diff --git a/www/apps/ui/src/specs/I18nProvider/I18nProvider.json b/www/apps/ui/src/specs/I18nProvider/I18nProvider.json index c93156fdb7..93c56c3acf 100644 --- a/www/apps/ui/src/specs/I18nProvider/I18nProvider.json +++ b/www/apps/ui/src/specs/I18nProvider/I18nProvider.json @@ -4,5 +4,23 @@ "displayName": "I18nProvider", "composes": [ "Props" - ] + ], + "props": { + "children": { + "description": "Contents that should have the locale applied.", + "required": true, + "tsType": { + "name": "ReactNode", + "elements": [], + "raw": "ReactNode" + } + }, + "locale": { + "description": "The locale to apply to the children.", + "required": false, + "tsType": { + "name": "string" + } + } + } } \ No newline at end of file diff --git a/www/apps/ui/src/specs/IconBadge/IconBadge.json b/www/apps/ui/src/specs/IconBadge/IconBadge.json index 20967e6cc9..89cb32c8de 100644 --- a/www/apps/ui/src/specs/IconBadge/IconBadge.json +++ b/www/apps/ui/src/specs/IconBadge/IconBadge.json @@ -20,6 +20,36 @@ "computed": false }, "description": "The badge's color.", + "tsType": { + "name": "union", + "raw": "\"green\" \\| \"red\" \\| \"blue\" \\| \"orange\" \\| \"grey\" \\| \"purple\"", + "elements": [ + { + "name": "literal", + "value": "\"green\"" + }, + { + "name": "literal", + "value": "\"red\"" + }, + { + "name": "literal", + "value": "\"blue\"" + }, + { + "name": "literal", + "value": "\"orange\"" + }, + { + "name": "literal", + "value": "\"grey\"" + }, + { + "name": "literal", + "value": "\"purple\"" + } + ] + }, "required": false }, "size": { @@ -28,6 +58,20 @@ "computed": false }, "description": "The badge's size.", + "tsType": { + "name": "union", + "raw": "\"base\" \\| \"large\"", + "elements": [ + { + "name": "literal", + "value": "\"base\"" + }, + { + "name": "literal", + "value": "\"large\"" + } + ] + }, "required": false } }, diff --git a/www/apps/ui/src/specs/IconButton/IconButton.json b/www/apps/ui/src/specs/IconButton/IconButton.json index 68c43940d5..9bf7a669ad 100644 --- a/www/apps/ui/src/specs/IconButton/IconButton.json +++ b/www/apps/ui/src/specs/IconButton/IconButton.json @@ -31,6 +31,20 @@ "computed": false }, "description": "The button's style.", + "tsType": { + "name": "union", + "raw": "\"primary\" \\| \"transparent\"", + "elements": [ + { + "name": "literal", + "value": "\"primary\"" + }, + { + "name": "literal", + "value": "\"transparent\"" + } + ] + }, "required": false }, "size": { @@ -39,6 +53,36 @@ "computed": false }, "description": "The button's size.", + "tsType": { + "name": "union", + "raw": "\"2xsmall\" \\| \"xsmall\" \\| \"small\" \\| \"base\" \\| \"large\" \\| \"xlarge\"", + "elements": [ + { + "name": "literal", + "value": "\"2xsmall\"" + }, + { + "name": "literal", + "value": "\"xsmall\"" + }, + { + "name": "literal", + "value": "\"small\"" + }, + { + "name": "literal", + "value": "\"base\"" + }, + { + "name": "literal", + "value": "\"large\"" + }, + { + "name": "literal", + "value": "\"xlarge\"" + } + ] + }, "required": false } }, diff --git a/www/apps/ui/src/specs/Input/Input.json b/www/apps/ui/src/specs/Input/Input.json index 600bda9cfa..9a4a3c8bb8 100644 --- a/www/apps/ui/src/specs/Input/Input.json +++ b/www/apps/ui/src/specs/Input/Input.json @@ -9,6 +9,20 @@ "computed": false }, "description": "The input's size.", + "tsType": { + "name": "union", + "raw": "\"small\" \\| \"base\"", + "elements": [ + { + "name": "literal", + "value": "\"small\"" + }, + { + "name": "literal", + "value": "\"base\"" + } + ] + }, "required": false } }, diff --git a/www/apps/ui/src/specs/InternalCalendar/InternalCalendar.json b/www/apps/ui/src/specs/InternalCalendar/InternalCalendar.json index 3c6bf7a62c..085a12c278 100644 --- a/www/apps/ui/src/specs/InternalCalendar/InternalCalendar.json +++ b/www/apps/ui/src/specs/InternalCalendar/InternalCalendar.json @@ -1,5 +1,6 @@ { "description": "InternalCalendar is the internal implementation of the Calendar component.\nIt's not for public use, but only used for other components like DatePicker.", "methods": [], - "displayName": "InternalCalendar" + "displayName": "InternalCalendar", + "props": {} } \ No newline at end of file diff --git a/www/apps/ui/src/specs/Label/Label.json b/www/apps/ui/src/specs/Label/Label.json index 537d936055..523c6cb271 100644 --- a/www/apps/ui/src/specs/Label/Label.json +++ b/www/apps/ui/src/specs/Label/Label.json @@ -9,6 +9,28 @@ "computed": false }, "description": "The label's size.", + "tsType": { + "name": "union", + "raw": "\"xsmall\" \\| \"small\" \\| \"base\" \\| \"large\"", + "elements": [ + { + "name": "literal", + "value": "\"xsmall\"" + }, + { + "name": "literal", + "value": "\"small\"" + }, + { + "name": "literal", + "value": "\"base\"" + }, + { + "name": "literal", + "value": "\"large\"" + } + ] + }, "required": false }, "weight": { @@ -17,6 +39,20 @@ "computed": false }, "description": "The label's font weight.", + "tsType": { + "name": "union", + "raw": "\"regular\" \\| \"plus\"", + "elements": [ + { + "name": "literal", + "value": "\"regular\"" + }, + { + "name": "literal", + "value": "\"plus\"" + } + ] + }, "required": false } }, diff --git a/www/apps/ui/src/specs/Popover/Popover.Anchor.json b/www/apps/ui/src/specs/Popover/Popover.Anchor.json index ab3b33bb70..8ad9920dc1 100644 --- a/www/apps/ui/src/specs/Popover/Popover.Anchor.json +++ b/www/apps/ui/src/specs/Popover/Popover.Anchor.json @@ -1,5 +1,6 @@ { "description": "", "methods": [], - "displayName": "Popover.Anchor" + "displayName": "Popover.Anchor", + "props": {} } \ No newline at end of file diff --git a/www/apps/ui/src/specs/Popover/Popover.Close.json b/www/apps/ui/src/specs/Popover/Popover.Close.json index b73878b0f3..10c13494b0 100644 --- a/www/apps/ui/src/specs/Popover/Popover.Close.json +++ b/www/apps/ui/src/specs/Popover/Popover.Close.json @@ -1,5 +1,6 @@ { "description": "", "methods": [], - "displayName": "Popover.Close" + "displayName": "Popover.Close", + "props": {} } \ No newline at end of file diff --git a/www/apps/ui/src/specs/Popover/Popover.Content.json b/www/apps/ui/src/specs/Popover/Popover.Content.json index 66739cef15..4cfaeedf5b 100644 --- a/www/apps/ui/src/specs/Popover/Popover.Content.json +++ b/www/apps/ui/src/specs/Popover/Popover.Content.json @@ -9,6 +9,9 @@ "computed": false }, "description": "The distance in pixels from the anchor.", + "tsType": { + "name": "number" + }, "required": false }, "side": { @@ -17,6 +20,28 @@ "computed": false }, "description": "The preferred side of the anchor to render against when open.\nWill be reversed when collisions occur and `avoidCollisions` is enabled.", + "tsType": { + "name": "union", + "raw": "\"top\" \\| \"right\" \\| \"bottom\" \\| \"left\"", + "elements": [ + { + "name": "literal", + "value": "\"top\"" + }, + { + "name": "literal", + "value": "\"right\"" + }, + { + "name": "literal", + "value": "\"bottom\"" + }, + { + "name": "literal", + "value": "\"left\"" + } + ] + }, "required": false }, "align": { @@ -25,6 +50,24 @@ "computed": false }, "description": "The preferred alignment against the anchor. May change when collisions occur.", + "tsType": { + "name": "union", + "raw": "\"center\" \\| \"end\" \\| \"start\"", + "elements": [ + { + "name": "literal", + "value": "\"center\"" + }, + { + "name": "literal", + "value": "\"end\"" + }, + { + "name": "literal", + "value": "\"start\"" + } + ] + }, "required": false } } diff --git a/www/apps/ui/src/specs/Popover/Popover.Trigger.json b/www/apps/ui/src/specs/Popover/Popover.Trigger.json index 19002e00e0..9171dbe585 100644 --- a/www/apps/ui/src/specs/Popover/Popover.Trigger.json +++ b/www/apps/ui/src/specs/Popover/Popover.Trigger.json @@ -1,5 +1,6 @@ { "description": "", "methods": [], - "displayName": "Popover.Trigger" + "displayName": "Popover.Trigger", + "props": {} } \ No newline at end of file diff --git a/www/apps/ui/src/specs/Popover/Popover.json b/www/apps/ui/src/specs/Popover/Popover.json index 40d3d66cf5..f5027f1ada 100644 --- a/www/apps/ui/src/specs/Popover/Popover.json +++ b/www/apps/ui/src/specs/Popover/Popover.json @@ -1,5 +1,6 @@ { "description": "This component is based on the [Radix UI Popover](https://www.radix-ui.com/primitives/docs/components/popover) primitves.", "methods": [], - "displayName": "Popover" + "displayName": "Popover", + "props": {} } \ No newline at end of file diff --git a/www/apps/ui/src/specs/ProgressAccordion/ProgressAccordion.Header.json b/www/apps/ui/src/specs/ProgressAccordion/ProgressAccordion.Header.json index fec7c9d264..6aea17492f 100644 --- a/www/apps/ui/src/specs/ProgressAccordion/ProgressAccordion.Header.json +++ b/www/apps/ui/src/specs/ProgressAccordion/ProgressAccordion.Header.json @@ -6,7 +6,22 @@ "status": { "required": false, "tsType": { - "name": "ProgressStatus" + "name": "union", + "raw": "\"not-started\" \\| \"in-progress\" \\| \"completed\"", + "elements": [ + { + "name": "literal", + "value": "\"not-started\"" + }, + { + "name": "literal", + "value": "\"in-progress\"" + }, + { + "name": "literal", + "value": "\"completed\"" + } + ] }, "description": "The current status.", "defaultValue": { diff --git a/www/apps/ui/src/specs/ProgressAccordion/ProgressAccordion.ProgressIndicator.json b/www/apps/ui/src/specs/ProgressAccordion/ProgressAccordion.ProgressIndicator.json index e18e0b59f5..04f06f4103 100644 --- a/www/apps/ui/src/specs/ProgressAccordion/ProgressAccordion.ProgressIndicator.json +++ b/www/apps/ui/src/specs/ProgressAccordion/ProgressAccordion.ProgressIndicator.json @@ -6,7 +6,22 @@ "status": { "required": true, "tsType": { - "name": "ProgressStatus" + "name": "union", + "raw": "\"not-started\" \\| \"in-progress\" \\| \"completed\"", + "elements": [ + { + "name": "literal", + "value": "\"not-started\"" + }, + { + "name": "literal", + "value": "\"in-progress\"" + }, + { + "name": "literal", + "value": "\"completed\"" + } + ] }, "description": "The current status." } diff --git a/www/apps/ui/src/specs/ProgressAccordion/ProgressAccordion.json b/www/apps/ui/src/specs/ProgressAccordion/ProgressAccordion.json index 60349bdf52..6f4933f152 100644 --- a/www/apps/ui/src/specs/ProgressAccordion/ProgressAccordion.json +++ b/www/apps/ui/src/specs/ProgressAccordion/ProgressAccordion.json @@ -1,5 +1,6 @@ { "description": "This component is based on the [Radix UI Accordion](https://radix-ui.com/primitives/docs/components/accordion) primitves.", "methods": [], - "displayName": "ProgressAccordion" + "displayName": "ProgressAccordion", + "props": {} } \ No newline at end of file diff --git a/www/apps/ui/src/specs/ProgressTabs/ProgressTabs.ProgressIndicator.json b/www/apps/ui/src/specs/ProgressTabs/ProgressTabs.ProgressIndicator.json index b8733606e7..c2b2a1a7d7 100644 --- a/www/apps/ui/src/specs/ProgressTabs/ProgressTabs.ProgressIndicator.json +++ b/www/apps/ui/src/specs/ProgressTabs/ProgressTabs.ProgressIndicator.json @@ -6,7 +6,22 @@ "status": { "required": false, "tsType": { - "name": "ProgressStatus" + "name": "union", + "raw": "\"not-started\" \\| \"in-progress\" \\| \"completed\"", + "elements": [ + { + "name": "literal", + "value": "\"not-started\"" + }, + { + "name": "literal", + "value": "\"in-progress\"" + }, + { + "name": "literal", + "value": "\"completed\"" + } + ] }, "description": "The current status." } diff --git a/www/apps/ui/src/specs/ProgressTabs/ProgressTabs.Trigger.json b/www/apps/ui/src/specs/ProgressTabs/ProgressTabs.Trigger.json index 791c10a3db..34cafa843d 100644 --- a/www/apps/ui/src/specs/ProgressTabs/ProgressTabs.Trigger.json +++ b/www/apps/ui/src/specs/ProgressTabs/ProgressTabs.Trigger.json @@ -6,7 +6,22 @@ "status": { "required": false, "tsType": { - "name": "ProgressStatus" + "name": "union", + "raw": "\"not-started\" \\| \"in-progress\" \\| \"completed\"", + "elements": [ + { + "name": "literal", + "value": "\"not-started\"" + }, + { + "name": "literal", + "value": "\"in-progress\"" + }, + { + "name": "literal", + "value": "\"completed\"" + } + ] }, "description": "", "defaultValue": { diff --git a/www/apps/ui/src/specs/ProgressTabs/ProgressTabs.json b/www/apps/ui/src/specs/ProgressTabs/ProgressTabs.json index 047411be9d..4205d93e58 100644 --- a/www/apps/ui/src/specs/ProgressTabs/ProgressTabs.json +++ b/www/apps/ui/src/specs/ProgressTabs/ProgressTabs.json @@ -1,5 +1,89 @@ { "description": "This component is based on the [Radix UI Tabs](https://radix-ui.com/primitives/docs/components/tabs) primitves.", "methods": [], - "displayName": "ProgressTabs" + "displayName": "ProgressTabs", + "props": { + "activationMode": { + "description": "Whether a tab is activated automatically or manually.", + "required": false, + "tsType": { + "name": "union", + "raw": "\"manual\" \\| \"automatic\"", + "elements": [ + { + "name": "literal", + "value": "\"manual\"" + }, + { + "name": "literal", + "value": "\"automatic\"" + } + ] + } + }, + "defaultValue": { + "description": "The value of the tab to select by default, if uncontrolled", + "required": false, + "tsType": { + "name": "string" + } + }, + "dir": { + "description": "The direction of navigation between toolbar items.", + "required": false, + "tsType": { + "name": "Direction", + "elements": [], + "raw": "Direction" + } + }, + "onValueChange": { + "description": "A function called when a new tab is selected", + "required": false, + "tsType": { + "name": "signature", + "type": "function", + "raw": "(value: string) => void", + "signature": { + "arguments": [ + { + "name": "value", + "type": { + "name": "string" + }, + "rest": false + } + ], + "return": { + "name": "void" + } + } + } + }, + "orientation": { + "description": "The orientation the tabs are layed out.\nMainly so arrow navigation is done accordingly (left & right vs. up & down)", + "required": false, + "tsType": { + "name": "union", + "raw": "\"horizontal\" \\| \"vertical\"", + "elements": [ + { + "name": "literal", + "value": "\"horizontal\"" + }, + { + "name": "literal", + "value": "\"vertical\"" + } + ] + } + }, + "value": { + "description": "The value for the selected tab, if controlled", + "required": false, + "tsType": { + "name": "string" + } + } + } } \ No newline at end of file diff --git a/www/apps/ui/src/specs/Prompt/Prompt.Portal.json b/www/apps/ui/src/specs/Prompt/Prompt.Portal.json index 16a125e950..d07cb7ddcd 100644 --- a/www/apps/ui/src/specs/Prompt/Prompt.Portal.json +++ b/www/apps/ui/src/specs/Prompt/Prompt.Portal.json @@ -1,5 +1,6 @@ { "description": "", "methods": [], - "displayName": "Prompt.Portal" + "displayName": "Prompt.Portal", + "props": {} } \ No newline at end of file diff --git a/www/apps/ui/src/specs/Prompt/Prompt.Trigger.json b/www/apps/ui/src/specs/Prompt/Prompt.Trigger.json new file mode 100644 index 0000000000..ed530341cc --- /dev/null +++ b/www/apps/ui/src/specs/Prompt/Prompt.Trigger.json @@ -0,0 +1,6 @@ +{ + "description": "", + "methods": [], + "displayName": "Prompt.Trigger", + "props": {} +} \ No newline at end of file diff --git a/www/apps/ui/src/specs/Select/Select.Content.json b/www/apps/ui/src/specs/Select/Select.Content.json index b74873d9a5..2ce4b7d44d 100644 --- a/www/apps/ui/src/specs/Select/Select.Content.json +++ b/www/apps/ui/src/specs/Select/Select.Content.json @@ -1,5 +1,5 @@ { - "description": "", + "description": "The content that appears when the select is open.\nIt's based on [Radix UI Select Content](https://www.radix-ui.com/primitives/docs/components/select#content).", "methods": [], "displayName": "Select.Content", "props": { @@ -8,7 +8,21 @@ "value": "\"popper\"", "computed": false }, - "description": "", + "description": "Whether to show the select items below (`popper`) or over (`item-aligned`) the select input.", + "tsType": { + "name": "union", + "raw": "\"item-aligned\" \\| \"popper\"", + "elements": [ + { + "name": "literal", + "value": "\"item-aligned\"" + }, + { + "name": "literal", + "value": "\"popper\"" + } + ] + }, "required": false }, "sideOffset": { @@ -16,7 +30,10 @@ "value": "8", "computed": false }, - "description": "", + "description": "The distance of the content pop-up in pixels from the select input. Only available when position is set to popper.", + "tsType": { + "name": "number" + }, "required": false }, "collisionPadding": { @@ -24,7 +41,21 @@ "value": "24", "computed": false }, - "description": "", + "description": "The distance in pixels from the boundary edges where collision detection should occur. Only available when position is set to popper.", + "tsType": { + "name": "union", + "raw": "number \\| Partial<Record<\"top\" \\| \"right\" \\| \"bottom\" \\| \"left\", number>>", + "elements": [ + { + "name": "number" + }, + { + "name": "Partial", + "elements": [], + "raw": "Partial<Record<\"top\" \\| \"right\" \\| \"bottom\" \\| \"left\", number>>" + } + ] + }, "required": false } } diff --git a/www/apps/ui/src/specs/Select/Select.Group.json b/www/apps/ui/src/specs/Select/Select.Group.json new file mode 100644 index 0000000000..c280dac4f9 --- /dev/null +++ b/www/apps/ui/src/specs/Select/Select.Group.json @@ -0,0 +1,6 @@ +{ + "description": "Groups multiple items together.", + "methods": [], + "displayName": "Select.Group", + "props": {} +} \ No newline at end of file diff --git a/www/apps/ui/src/specs/Select/Select.Label.json b/www/apps/ui/src/specs/Select/Select.Label.json index 68a076d8d2..28ff740a32 100644 --- a/www/apps/ui/src/specs/Select/Select.Label.json +++ b/www/apps/ui/src/specs/Select/Select.Label.json @@ -1,5 +1,5 @@ { - "description": "Used to label a group of items.", + "description": "Used to label a group of items.\nIt's based on [Radix UI Select Label](https://www.radix-ui.com/primitives/docs/components/select#label).", "methods": [], "displayName": "Select.Label", "props": {} diff --git a/www/apps/ui/src/specs/Select/Select.Trigger.json b/www/apps/ui/src/specs/Select/Select.Trigger.json index bdf187817b..767d597f66 100644 --- a/www/apps/ui/src/specs/Select/Select.Trigger.json +++ b/www/apps/ui/src/specs/Select/Select.Trigger.json @@ -1,5 +1,5 @@ { - "description": "The trigger that toggles the select.", + "description": "The trigger that toggles the select.\nIt's based on [Radix UI Select Trigger](https://www.radix-ui.com/primitives/docs/components/select#trigger).", "methods": [], "displayName": "Select.Trigger", "props": {} diff --git a/www/apps/ui/src/specs/Select/Select.Value.json b/www/apps/ui/src/specs/Select/Select.Value.json new file mode 100644 index 0000000000..33740e6f29 --- /dev/null +++ b/www/apps/ui/src/specs/Select/Select.Value.json @@ -0,0 +1,6 @@ +{ + "description": "Displays the selected value, or a placeholder if no value is selected.\nIt's based on [Radix UI Select Value](https://www.radix-ui.com/primitives/docs/components/select#value).", + "methods": [], + "displayName": "Select.Value", + "props": {} +} \ No newline at end of file diff --git a/www/apps/ui/src/specs/StatusBadge/StatusBadge.json b/www/apps/ui/src/specs/StatusBadge/StatusBadge.json index 447558d306..b5ea5f1498 100644 --- a/www/apps/ui/src/specs/StatusBadge/StatusBadge.json +++ b/www/apps/ui/src/specs/StatusBadge/StatusBadge.json @@ -9,6 +9,36 @@ "computed": false }, "description": "The status's color.", + "tsType": { + "name": "union", + "raw": "\"green\" \\| \"red\" \\| \"blue\" \\| \"orange\" \\| \"grey\" \\| \"purple\"", + "elements": [ + { + "name": "literal", + "value": "\"green\"" + }, + { + "name": "literal", + "value": "\"red\"" + }, + { + "name": "literal", + "value": "\"blue\"" + }, + { + "name": "literal", + "value": "\"orange\"" + }, + { + "name": "literal", + "value": "\"grey\"" + }, + { + "name": "literal", + "value": "\"purple\"" + } + ] + }, "required": false } }, diff --git a/www/apps/ui/src/specs/Switch/Switch.json b/www/apps/ui/src/specs/Switch/Switch.json index 9e92412f09..e1f3eda603 100644 --- a/www/apps/ui/src/specs/Switch/Switch.json +++ b/www/apps/ui/src/specs/Switch/Switch.json @@ -9,6 +9,20 @@ "computed": false }, "description": "The switch's size.", + "tsType": { + "name": "union", + "raw": "\"small\" \\| \"base\"", + "elements": [ + { + "name": "literal", + "value": "\"small\"" + }, + { + "name": "literal", + "value": "\"base\"" + } + ] + }, "required": false } }, diff --git a/www/apps/ui/src/specs/Tabs/Tabs.json b/www/apps/ui/src/specs/Tabs/Tabs.json index 632fc5775d..7e99efe796 100644 --- a/www/apps/ui/src/specs/Tabs/Tabs.json +++ b/www/apps/ui/src/specs/Tabs/Tabs.json @@ -1,5 +1,89 @@ { "description": "This component is based on the [Radix UI Tabs](https://radix-ui.com/primitives/docs/components/tabs) primitves", "methods": [], - "displayName": "Tabs" + "displayName": "Tabs", + "props": { + "activationMode": { + "description": "Whether a tab is activated automatically or manually.", + "required": false, + "tsType": { + "name": "union", + "raw": "\"manual\" \\| \"automatic\"", + "elements": [ + { + "name": "literal", + "value": "\"manual\"" + }, + { + "name": "literal", + "value": "\"automatic\"" + } + ] + } + }, + "defaultValue": { + "description": "The value of the tab to select by default, if uncontrolled", + "required": false, + "tsType": { + "name": "string" + } + }, + "dir": { + "description": "The direction of navigation between toolbar items.", + "required": false, + "tsType": { + "name": "Direction", + "elements": [], + "raw": "Direction" + } + }, + "onValueChange": { + "description": "A function called when a new tab is selected", + "required": false, + "tsType": { + "name": "signature", + "type": "function", + "raw": "(value: string) => void", + "signature": { + "arguments": [ + { + "name": "value", + "type": { + "name": "string" + }, + "rest": false + } + ], + "return": { + "name": "void" + } + } + } + }, + "orientation": { + "description": "The orientation the tabs are layed out.\nMainly so arrow navigation is done accordingly (left & right vs. up & down)", + "required": false, + "tsType": { + "name": "union", + "raw": "\"horizontal\" \\| \"vertical\"", + "elements": [ + { + "name": "literal", + "value": "\"horizontal\"" + }, + { + "name": "literal", + "value": "\"vertical\"" + } + ] + } + }, + "value": { + "description": "The value for the selected tab, if controlled", + "required": false, + "tsType": { + "name": "string" + } + } + } } \ No newline at end of file diff --git a/www/apps/ui/src/specs/Text/Text.json b/www/apps/ui/src/specs/Text/Text.json index 047a115be9..f3755178e9 100644 --- a/www/apps/ui/src/specs/Text/Text.json +++ b/www/apps/ui/src/specs/Text/Text.json @@ -46,6 +46,32 @@ "computed": false }, "description": "The text's size.", + "tsType": { + "name": "union", + "raw": "\"xsmall\" \\| \"small\" \\| \"base\" \\| \"large\" \\| \"xlarge\"", + "elements": [ + { + "name": "literal", + "value": "\"xsmall\"" + }, + { + "name": "literal", + "value": "\"small\"" + }, + { + "name": "literal", + "value": "\"base\"" + }, + { + "name": "literal", + "value": "\"large\"" + }, + { + "name": "literal", + "value": "\"xlarge\"" + } + ] + }, "required": false }, "weight": { @@ -54,6 +80,20 @@ "computed": false }, "description": "The text's font weight.", + "tsType": { + "name": "union", + "raw": "\"regular\" \\| \"plus\"", + "elements": [ + { + "name": "literal", + "value": "\"regular\"" + }, + { + "name": "literal", + "value": "\"plus\"" + } + ] + }, "required": false }, "family": { @@ -62,6 +102,20 @@ "computed": false }, "description": "The text's font family.", + "tsType": { + "name": "union", + "raw": "\"sans\" \\| \"mono\"", + "elements": [ + { + "name": "literal", + "value": "\"sans\"" + }, + { + "name": "literal", + "value": "\"mono\"" + } + ] + }, "required": false }, "leading": { @@ -70,6 +124,20 @@ "computed": false }, "description": "The text's line height.", + "tsType": { + "name": "union", + "raw": "\"normal\" \\| \"compact\"", + "elements": [ + { + "name": "literal", + "value": "\"normal\"" + }, + { + "name": "literal", + "value": "\"compact\"" + } + ] + }, "required": false } }, diff --git a/www/apps/ui/src/specs/TimeInput/TimeInput.json b/www/apps/ui/src/specs/TimeInput/TimeInput.json index f6aa023a6d..c9ae535e08 100644 --- a/www/apps/ui/src/specs/TimeInput/TimeInput.json +++ b/www/apps/ui/src/specs/TimeInput/TimeInput.json @@ -1,5 +1,6 @@ { "description": "", "methods": [], - "displayName": "TimeInput" + "displayName": "TimeInput", + "props": {} } \ No newline at end of file diff --git a/www/apps/ui/src/specs/Toast/Toast.json b/www/apps/ui/src/specs/Toast/Toast.json index afc1b1076b..47cc9e0b36 100644 --- a/www/apps/ui/src/specs/Toast/Toast.json +++ b/www/apps/ui/src/specs/Toast/Toast.json @@ -30,7 +30,64 @@ "action": { "required": false, "tsType": { - "name": "ToastAction" + "name": "signature", + "type": "object", + "raw": "{ altText: string ; label: string ; onClick: () => void \\| Promise<void> ; variant?: ToastActionVariant }", + "signature": { + "properties": [ + { + "key": "altText", + "value": { + "name": "string" + }, + "description": "The button's alt text." + }, + { + "key": "label", + "value": { + "name": "string" + }, + "description": "The button's text." + }, + { + "key": "onClick", + "value": { + "name": "signature", + "type": "function", + "raw": "() => void \\| Promise<void>", + "signature": { + "arguments": [], + "return": { + "name": "void \\| Promise<void>" + } + } + }, + "description": "The function to execute when the button is clicked." + }, + { + "key": "variant", + "value": { + "name": "ToastActionVariant", + "elements": [ + { + "name": "union", + "raw": "\"default\" \\| \"destructive\"", + "elements": [ + { + "name": "\"default\"" + }, + { + "name": "\"destructive\"" + } + ] + } + ], + "raw": "ToastActionVariant" + }, + "description": "The button's variant." + } + ] + } }, "description": "The toast's action buttons." } diff --git a/www/apps/ui/src/specs/Toaster/Toaster.json b/www/apps/ui/src/specs/Toaster/Toaster.json index a9bafd96b5..23e7c0ea7d 100644 --- a/www/apps/ui/src/specs/Toaster/Toaster.json +++ b/www/apps/ui/src/specs/Toaster/Toaster.json @@ -9,6 +9,11 @@ "computed": false }, "description": "The position of the created toasts.", + "tsType": { + "name": "Position", + "elements": [], + "raw": "Position" + }, "required": false }, "gap": { @@ -17,6 +22,9 @@ "computed": false }, "description": "The gap between the toast components.", + "tsType": { + "name": "number" + }, "required": false }, "offset": { @@ -25,10 +33,29 @@ "computed": false }, "description": "The space from the edges of the screen.", + "tsType": { + "name": "union", + "raw": "string \\| number", + "elements": [ + { + "name": "string" + }, + { + "name": "number" + } + ] + }, "required": false }, "duration": { - "description": "The time in milliseconds that a toast is shown before it's\nautomatically dismissed.\n\n@defaultValue 4000" + "description": "The time in milliseconds that a toast is shown before it's\nautomatically dismissed.\n\n", + "tsType": { + "name": "number" + }, + "defaultValue": { + "value": "4000", + "computed": false + } } }, "composes": [ diff --git a/www/apps/ui/src/specs/Tooltip/Tooltip.json b/www/apps/ui/src/specs/Tooltip/Tooltip.json index 5b68b7066b..0d4bc2df68 100644 --- a/www/apps/ui/src/specs/Tooltip/Tooltip.json +++ b/www/apps/ui/src/specs/Tooltip/Tooltip.json @@ -3,53 +3,6 @@ "methods": [], "displayName": "Tooltip", "props": { - "content": { - "required": true, - "tsType": { - "name": "ReactReactNode", - "raw": "React.ReactNode" - }, - "description": "" - }, - "onClick": { - "required": false, - "tsType": { - "name": "ReactMouseEventHandler", - "raw": "React.MouseEventHandler", - "elements": [ - { - "name": "HTMLButtonElement" - } - ] - }, - "description": "" - }, - "side": { - "required": false, - "tsType": { - "name": "union", - "raw": "\"bottom\" | \"left\" | \"top\" | \"right\"", - "elements": [ - { - "name": "literal", - "value": "\"bottom\"" - }, - { - "name": "literal", - "value": "\"left\"" - }, - { - "name": "literal", - "value": "\"top\"" - }, - { - "name": "literal", - "value": "\"right\"" - } - ] - }, - "description": "" - }, "maxWidth": { "required": false, "tsType": { @@ -61,13 +14,77 @@ "computed": false } }, - "sideOffset": { - "defaultValue": { - "value": "8", - "computed": false - }, - "description": "", - "required": false + "aria-label": { + "description": "A more descriptive label for accessibility purpose", + "required": false, + "tsType": { + "name": "string" + } + }, + "delayDuration": { + "description": "The duration from when the pointer enters the trigger until the tooltip gets opened. This will\noverride the prop with the same name passed to Provider.", + "required": false, + "tsType": { + "name": "number" + } + }, + "forceMount": { + "description": "Used to force mounting when more control is needed. Useful when\ncontrolling animation with React animation libraries.", + "required": false, + "tsType": { + "name": "literal", + "value": "true" + } + }, + "onEscapeKeyDown": { + "description": "Event handler called when the escape key is down.\nCan be prevented.", + "required": false, + "tsType": { + "name": "signature", + "type": "function", + "raw": "(event: KeyboardEvent) => void", + "signature": { + "arguments": [ + { + "name": "event", + "type": { + "name": "KeyboardEvent", + "elements": [], + "raw": "KeyboardEvent" + }, + "rest": false + } + ], + "return": { + "name": "void" + } + } + } + }, + "onPointerDownOutside": { + "description": "Event handler called when the a `pointerdown` event happens outside of the `Tooltip`.\nCan be prevented.", + "required": false, + "tsType": { + "name": "signature", + "type": "function", + "raw": "(event: PointerDownOutsideEvent) => void", + "signature": { + "arguments": [ + { + "name": "event", + "type": { + "name": "PointerDownOutsideEvent", + "elements": [], + "raw": "PointerDownOutsideEvent" + }, + "rest": false + } + ], + "return": { + "name": "void" + } + } + } } }, "composes": [ diff --git a/www/apps/ui/src/specs/TooltipProvider/TooltipProvider.json b/www/apps/ui/src/specs/TooltipProvider/TooltipProvider.json index 64660a631d..1e4e76327b 100644 --- a/www/apps/ui/src/specs/TooltipProvider/TooltipProvider.json +++ b/www/apps/ui/src/specs/TooltipProvider/TooltipProvider.json @@ -8,7 +8,10 @@ "value": "100", "computed": false }, - "description": "", + "description": "The duration from when the pointer enters the trigger until the tooltip gets opened.", + "tsType": { + "name": "number" + }, "required": false }, "skipDelayDuration": { @@ -16,8 +19,18 @@ "value": "300", "computed": false }, - "description": "", + "description": "How much time a user has to enter another trigger without incurring a delay again.", + "tsType": { + "name": "number" + }, "required": false + }, + "disableHoverableContent": { + "description": "When `true`, trying to hover the content will result in the tooltip closing as the pointer leaves the trigger.", + "required": false, + "tsType": { + "name": "boolean" + } } } } \ No newline at end of file diff --git a/www/apps/ui/src/types/props.ts b/www/apps/ui/src/types/props.ts index ab9a7ee214..f79fd25442 100644 --- a/www/apps/ui/src/types/props.ts +++ b/www/apps/ui/src/types/props.ts @@ -20,6 +20,12 @@ export type FunctionType = { signature: string } +export type PartialType = { + type: "partial" + elements: unknown[] + raw: string +} + // Keeping this as it's still used by hooks export type PropType = | "string" diff --git a/www/packages/docs-ui/src/components/MainNav/Version/index.tsx b/www/packages/docs-ui/src/components/MainNav/Version/index.tsx index b4e37c81a5..bba468b30f 100644 --- a/www/packages/docs-ui/src/components/MainNav/Version/index.tsx +++ b/www/packages/docs-ui/src/components/MainNav/Version/index.tsx @@ -37,7 +37,11 @@ export const MainNavVersion = () => { return ( <> - + { - · + + · + ) } diff --git a/www/packages/types/src/config.ts b/www/packages/types/src/config.ts index 45ca172955..106138b45a 100644 --- a/www/packages/types/src/config.ts +++ b/www/packages/types/src/config.ts @@ -19,6 +19,7 @@ export declare type DocsConfig = { version: { number: string releaseUrl: string + hide?: boolean } reportIssueLink?: string logo: string diff --git a/www/utils/packages/react-docs-generator/package.json b/www/utils/packages/react-docs-generator/package.json index be7bbbd0b0..faf66ccbe6 100644 --- a/www/utils/packages/react-docs-generator/package.json +++ b/www/utils/packages/react-docs-generator/package.json @@ -2,7 +2,7 @@ "name": "react-docs-generator", "license": "MIT", "scripts": { - "dev": "ts-node src/index.ts", + "dev": "node --loader ts-node/esm src/index.ts", "start": "node dist/index.js", "generate:ui": "yarn start --src ../../../../packages/design-system/ui/src --output ../../../apps/ui/src/specs --clean", "build": "tsc", diff --git a/www/utils/packages/react-docs-generator/src/classes/typedoc-manager.ts b/www/utils/packages/react-docs-generator/src/classes/typedoc-manager.ts index d77081948a..5ea71e4fbc 100644 --- a/www/utils/packages/react-docs-generator/src/classes/typedoc-manager.ts +++ b/www/utils/packages/react-docs-generator/src/classes/typedoc-manager.ts @@ -126,129 +126,141 @@ export default class TypedocManager { reflection.type.reflection instanceof DeclarationReflection && reflection.type.reflection.signatures?.length - // If the original reflection in the reference type has a signature - // use that signature. Else, try to get the signature from the mapping. - const signature = doesReflectionHaveSignature - ? ( - (reflection.type! as ReferenceType) - .reflection as DeclarationReflection - ).signatures![0] - : reflection.sources?.length + let signature: SignatureReflection | undefined + let props: DeclarationReflection[] = [] + if (doesReflectionHaveSignature) { + signature = ( + (reflection.type! as ReferenceType).reflection as DeclarationReflection + ).signatures![0] + props = + signature?.parameters?.length && signature.parameters[0].type + ? getTypeChildren({ + reflectionType: signature.parameters![0].type!, + project: this.project, + }) + : [] + } + + if (!signature || !props.length) { + signature = reflection.sources?.length ? this.getMappedSignatureFromSource(reflection.sources[0]) ?.signatures[0] : undefined + props = + signature?.parameters?.length && signature.parameters[0].type + ? getTypeChildren({ + reflectionType: signature.parameters![0].type!, + project: this.project, + }) + : [] + } - if (signature?.parameters?.length && signature.parameters[0].type) { - // get the props of the component from the - // first parameter in the signature. - const props = getTypeChildren({ - reflectionType: signature.parameters![0].type!, - project: this.project, - }) + if (!signature || !props.length) { + return spec + } - // this stores props that should be removed from the - // spec - const propsToRemove = new Set() + // this stores props that should be removed from the + // spec + const propsToRemove = new Set() - // loop over props in the spec to either add missing descriptions or - // push a prop into the `propsToRemove` set. - Object.entries(spec.props!).forEach(([propName, propDetails]) => { - // retrieve the reflection of the prop - const reflectionProp = props.find( - (propType) => propType.name === propName - ) - if (!reflectionProp) { - // if the reflection doesn't exist and the - // prop doesn't have a description, it should - // be removed. - if (!propDetails.description) { - propsToRemove.add(propName) - } - return - } - // if the component has the `@excludeExternal` tag, - // the prop is external, and it doesn't have the - // `@keep` tag, the prop is removed. - if ( - this.shouldExcludeExternal({ - parentReflection: reflection, - childReflection: reflectionProp, - propDescription: propDetails.description, - signature, - }) - ) { - propsToRemove.add(propName) - return - } - - // if the prop doesn't have a default value, try to retrieve it - if (!propDetails.defaultValue) { - propDetails.defaultValue = this.getReflectionDefaultValue( - reflectionProp, - propDetails.description - ) - } - - // if the prop doesn't have description, retrieve it using Typedoc - propDetails.description = - propDetails.description || this.getDescription(reflectionProp) - // if the prop still doesn't have description, remove it. + // loop over props in the spec to either add missing descriptions or + // push a prop into the `propsToRemove` set. + Object.entries(spec.props!).forEach(([propName, propDetails]) => { + // retrieve the reflection of the prop + const reflectionProp = props.find( + (propType) => propType.name === propName + ) + if (!reflectionProp) { + // if the reflection doesn't exist and the + // prop doesn't have a description, it should + // be removed. if (!propDetails.description) { propsToRemove.add(propName) - } else { - propDetails.description = this.normalizeDescription( - propDetails.description - ) + } + return + } + // if the component has the `@excludeExternal` tag, + // the prop is external, and it doesn't have the + // `@keep` tag, the prop is removed. + if ( + this.shouldExcludeExternal({ + parentReflection: reflection, + childReflection: reflectionProp, + propDescription: propDetails.description, + signature, + }) + ) { + propsToRemove.add(propName) + return + } + + // if the prop doesn't have a default value, try to retrieve it + if (!propDetails.defaultValue) { + propDetails.defaultValue = this.getReflectionDefaultValue( + reflectionProp, + propDetails.description + ) + } + + // if the prop doesn't have description, retrieve it using Typedoc + propDetails.description = + propDetails.description || this.getDescription(reflectionProp) + // if the prop still doesn't have description, remove it. + if (!propDetails.description) { + propsToRemove.add(propName) + } else { + propDetails.description = this.normalizeDescription( + propDetails.description + ) + } + }) + + // delete props in the `propsToRemove` set from the specs. + propsToRemove.forEach((prop) => delete spec.props![prop]) + + // try to add missing props + props + .filter( + (prop) => + // Filter out props that are already in the + // specs, are already in the `propsToRemove` set + // (meaning they've been removed), don't have a + // comment, are React props, and are external props (if + // the component excludes them). + !Object.hasOwn(spec.props!, prop.name) && + !propsToRemove.has(prop.name) && + this.getReflectionComment(prop) && + !this.isFromReact(prop) && + !this.shouldExcludeExternal({ + parentReflection: reflection, + childReflection: prop, + signature, + }) + ) + .forEach((prop) => { + // If the prop has description (retrieved) + // through Typedoc, it's added into the spec. + const rawDescription = this.getDescription(prop) + const description = this.normalizeDescription(rawDescription) + if (!description) { + return + } + spec.props![prop.name] = { + description, + required: !prop.flags.isOptional, + defaultValue: this.getReflectionDefaultValue(prop, rawDescription), + tsType: prop.type + ? this.getTsType(prop.type) + : prop.signatures?.length + ? this.getFunctionTsType(prop.signatures[0]) + : undefined, + } + + if (!spec.props![prop.name].tsType) { + delete spec.props![prop.name].tsType } }) - // delete props in the `propsToRemove` set from the specs. - propsToRemove.forEach((prop) => delete spec.props![prop]) - - // try to add missing props - props - .filter( - (prop) => - // Filter out props that are already in the - // specs, are already in the `propsToRemove` set - // (meaning they've been removed), don't have a - // comment, are React props, and are external props (if - // the component excludes them). - !Object.hasOwn(spec.props!, prop.name) && - !propsToRemove.has(prop.name) && - this.getReflectionComment(prop) && - !this.isFromReact(prop) && - !this.shouldExcludeExternal({ - parentReflection: reflection, - childReflection: prop, - signature, - }) - ) - .forEach((prop) => { - // If the prop has description (retrieved) - // through Typedoc, it's added into the spec. - const rawDescription = this.getDescription(prop) - const description = this.normalizeDescription(rawDescription) - if (!description) { - return - } - spec.props![prop.name] = { - description, - required: !prop.flags.isOptional, - defaultValue: this.getReflectionDefaultValue(prop, rawDescription), - tsType: prop.type - ? this.getTsType(prop.type) - : prop.signatures?.length - ? this.getFunctionTsType(prop.signatures[0]) - : undefined, - } - - if (!spec.props![prop.name].tsType) { - delete spec.props![prop.name].tsType - } - }) - } - return spec } diff --git a/www/utils/packages/react-docs-generator/src/commands/generate.ts b/www/utils/packages/react-docs-generator/src/commands/generate.ts index 278d9aeadd..fa97fc5495 100644 --- a/www/utils/packages/react-docs-generator/src/commands/generate.ts +++ b/www/utils/packages/react-docs-generator/src/commands/generate.ts @@ -100,6 +100,10 @@ export default async function ({ mkdirSync(filePath) } + if (spec.displayName === "Drawer.Content") { + console.log("here", spec) + } + // write spec to output path writeFileSync( path.join(filePath, `${spec.displayName}.json`), diff --git a/www/utils/packages/react-docs-generator/src/handlers/argsPropHandler.ts b/www/utils/packages/react-docs-generator/src/handlers/argsPropHandler.ts index 5c128deccd..1d767fd3c7 100644 --- a/www/utils/packages/react-docs-generator/src/handlers/argsPropHandler.ts +++ b/www/utils/packages/react-docs-generator/src/handlers/argsPropHandler.ts @@ -52,7 +52,7 @@ function resolveDocumentation( // set type if missing if (!propDescriptor.tsType && typedocManager) { const typeAnnotation = utils.getTypeAnnotation(path) - if (typeAnnotation?.isTSTypeReference) { + if (typeAnnotation?.isTSTypeReference()) { const typeName = typeAnnotation.get("typeName") if ( !Array.isArray(typeName) && diff --git a/www/utils/packages/typedoc-config/ui.json b/www/utils/packages/typedoc-config/ui.json index c7b96fd133..c5b371c14e 100644 --- a/www/utils/packages/typedoc-config/ui.json +++ b/www/utils/packages/typedoc-config/ui.json @@ -7,5 +7,8 @@ "exclude": [ "../../../../packages/design-system/ui/dist", "../../../../packages/design-system/ui/node_modules" - ] + ], + "compilerOptions": { + "jsx": "react-jsx" + } } \ No newline at end of file