chore(docs): Updated UI Reference (#6221)
Automated changes by [create-pull-request](https://github.com/peter-evans/create-pull-request) GitHub action Co-authored-by: Oli Juhl <59018053+olivermrbl@users.noreply.github.com> Co-authored-by: Shahed Nasser <27354907+shahednasser@users.noreply.github.com>
This commit is contained in:
github-actions[bot]
committed by
GitHub
GitHub
parent
96629f1916
commit
dfd9e7c772
@@ -15,7 +15,7 @@
|
||||
"dependencies": {
|
||||
"@faker-js/faker": "^8.0.2",
|
||||
"@medusajs/icons": "latest",
|
||||
"@medusajs/ui": "latest",
|
||||
"@medusajs/ui": "^2.3.0",
|
||||
"@medusajs/ui-preset": "latest",
|
||||
"@radix-ui/react-dialog": "^1.0.4",
|
||||
"@radix-ui/react-scroll-area": "^1.0.4",
|
||||
@@ -26,7 +26,7 @@
|
||||
"autoprefixer": "10.4.14",
|
||||
"clsx": "^2.0.0",
|
||||
"contentlayer": "^0.3.4",
|
||||
"date-fns": "^2.30.0",
|
||||
"date-fns": "^3.3.1",
|
||||
"docs-ui": "*",
|
||||
"eslint-config-docs": "*",
|
||||
"mdast-util-toc": "^7.0.0",
|
||||
@@ -35,6 +35,7 @@
|
||||
"next-themes": "^0.2.1",
|
||||
"postcss": "8.4.27",
|
||||
"react": "18.2.0",
|
||||
"react-day-picker": "^8.10.0",
|
||||
"react-dom": "18.2.0",
|
||||
"remark": "^14.0.3",
|
||||
"tailwind": "*",
|
||||
|
||||
@@ -35,3 +35,9 @@ import { Calendar } from "@medusajs/ui"
|
||||
### Range
|
||||
|
||||
<ComponentExample name="calendar-range" />
|
||||
|
||||
### Changing Locale
|
||||
|
||||
Changing the locale requires installing the [date-fns library](https://date-fns.org/docs/Getting-Started#npm).
|
||||
|
||||
<ComponentExample name="calendar-locale" />
|
||||
|
||||
@@ -59,4 +59,10 @@ import { DatePicker } from "@medusajs/ui"
|
||||
|
||||
### Range with presets and time
|
||||
|
||||
<ComponentExample name="date-picker-range-presets-time" />
|
||||
<ComponentExample name="date-picker-range-presets-time" />
|
||||
|
||||
### Changing the Locale
|
||||
|
||||
Changing the locale requires installing the [date-fns library](https://date-fns.org/docs/Getting-Started#npm).
|
||||
|
||||
<ComponentExample name="date-picker-locale" />
|
||||
9
www/apps/ui/src/examples/calendar-locale.tsx
Normal file
9
www/apps/ui/src/examples/calendar-locale.tsx
Normal file
@@ -0,0 +1,9 @@
|
||||
import { Calendar } from "@medusajs/ui"
|
||||
import * as React from "react"
|
||||
import { es } from "date-fns/locale"
|
||||
|
||||
export default function CalendarDemo() {
|
||||
const [date, setDate] = React.useState<Date | undefined>()
|
||||
|
||||
return <Calendar selected={date} onSelect={setDate} locale={es} />
|
||||
}
|
||||
@@ -3,7 +3,7 @@ import { DatePicker } from "@medusajs/ui"
|
||||
export default function DatePickerDemo() {
|
||||
return (
|
||||
<div className="w-[250px]">
|
||||
<DatePicker />
|
||||
<DatePicker placeholder="Pick a date" />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
10
www/apps/ui/src/examples/date-picker-locale.tsx
Normal file
10
www/apps/ui/src/examples/date-picker-locale.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import { DatePicker } from "@medusajs/ui"
|
||||
import { es } from "date-fns/locale"
|
||||
|
||||
export default function DatePickerDemo() {
|
||||
return (
|
||||
<div className="w-[250px]">
|
||||
<DatePicker locale={es} placeholder="Elija una fecha" />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -4,6 +4,7 @@ export default function DatePickerRangePresetsTime() {
|
||||
return (
|
||||
<div className="w-[250px]">
|
||||
<DatePicker
|
||||
placeholder="Pick a date"
|
||||
showTimePicker
|
||||
mode="range"
|
||||
presets={[
|
||||
|
||||
@@ -4,6 +4,7 @@ export default function DatePickerRangePresets() {
|
||||
return (
|
||||
<div className="w-[250px]">
|
||||
<DatePicker
|
||||
placeholder="Pick a date"
|
||||
mode="range"
|
||||
presets={[
|
||||
{
|
||||
|
||||
@@ -3,7 +3,7 @@ import { DatePicker } from "@medusajs/ui"
|
||||
export default function DatePickerRangeTime() {
|
||||
return (
|
||||
<div className="w-[250px]">
|
||||
<DatePicker showTimePicker mode="range" />
|
||||
<DatePicker showTimePicker mode="range" placeholder="Pick a date" />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -3,7 +3,7 @@ import { DatePicker } from "@medusajs/ui"
|
||||
export default function DatePickerRange() {
|
||||
return (
|
||||
<div className="w-[250px]">
|
||||
<DatePicker mode="range" />
|
||||
<DatePicker mode="range" placeholder="Pick a date" />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -4,6 +4,7 @@ export default function DatePickerSinglePresetsTime() {
|
||||
return (
|
||||
<div className="w-[250px]">
|
||||
<DatePicker
|
||||
placeholder="Pick a date"
|
||||
showTimePicker
|
||||
presets={[
|
||||
{
|
||||
|
||||
@@ -4,6 +4,7 @@ export default function DatePickerSinglePresets() {
|
||||
return (
|
||||
<div className="w-[250px]">
|
||||
<DatePicker
|
||||
placeholder="Pick a date"
|
||||
presets={[
|
||||
{
|
||||
date: new Date(),
|
||||
|
||||
@@ -3,7 +3,7 @@ import { DatePicker } from "@medusajs/ui"
|
||||
export default function DatePickerSingleTime() {
|
||||
return (
|
||||
<div className="w-[250px]">
|
||||
<DatePicker showTimePicker />
|
||||
<DatePicker showTimePicker placeholder="Pick a date" />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -3,7 +3,7 @@ import { DatePicker } from "@medusajs/ui"
|
||||
export default function DatePickerSingle() {
|
||||
return (
|
||||
<div className="w-[250px]">
|
||||
<DatePicker />
|
||||
<DatePicker placeholder="Pick a date" />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -122,6 +122,11 @@ export const ExampleRegistry: Record<string, ExampleType> = {
|
||||
component: React.lazy(async () => import("@/examples/calendar-demo")),
|
||||
file: "src/examples/calendar-demo.tsx",
|
||||
},
|
||||
"calendar-locale": {
|
||||
name: "calendar-locale",
|
||||
component: React.lazy(async () => import("@/examples/calendar-locale")),
|
||||
file: "src/examples/calendar-locale.tsx",
|
||||
},
|
||||
"checkbox-demo": {
|
||||
name: "checkbox-demo",
|
||||
component: React.lazy(async () => import("@/examples/checkbox-demo")),
|
||||
@@ -214,6 +219,11 @@ export const ExampleRegistry: Record<string, ExampleType> = {
|
||||
),
|
||||
file: "src/examples/date-picker-range-presets-time.tsx",
|
||||
},
|
||||
"date-picker-locale": {
|
||||
name: "date-picker-locale",
|
||||
component: React.lazy(async () => import("@/examples/date-picker-locale")),
|
||||
file: "src/examples/date-picker-locale.tsx",
|
||||
},
|
||||
"drawer-demo": {
|
||||
name: "drawer-demo",
|
||||
component: React.lazy(async () => import("@/examples/drawer-demo")),
|
||||
|
||||
@@ -47,8 +47,20 @@
|
||||
"description": "The size of the avatar's border radius.",
|
||||
"tsType": {
|
||||
"name": "union",
|
||||
"raw": "\"base\" \\| \"large\"",
|
||||
"raw": "\"2xsmall\" \\| \"xsmall\" \\| \"small\" \\| \"base\" \\| \"large\" \\| \"xlarge\"",
|
||||
"elements": [
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"2xsmall\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"xsmall\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"small\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"base\""
|
||||
@@ -56,6 +68,10 @@
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"large\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"xlarge\""
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
@@ -22,8 +22,12 @@
|
||||
"description": "The badge's size.",
|
||||
"tsType": {
|
||||
"name": "union",
|
||||
"raw": "\"base\" \\| \"large\" \\| \"small\"",
|
||||
"raw": "\"small\" \\| \"base\" \\| \"large\"",
|
||||
"elements": [
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"small\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"base\""
|
||||
@@ -31,10 +35,6 @@
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"large\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"small\""
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
@@ -63,8 +63,12 @@
|
||||
"description": "The button's size.",
|
||||
"tsType": {
|
||||
"name": "union",
|
||||
"raw": "\"base\" \\| \"large\" \\| \"xlarge\"",
|
||||
"raw": "\"small\" \\| \"base\" \\| \"large\" \\| \"xlarge\"",
|
||||
"elements": [
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"small\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"base\""
|
||||
|
||||
@@ -35,6 +35,248 @@
|
||||
"name": "boolean"
|
||||
},
|
||||
"required": false
|
||||
},
|
||||
"locale": {
|
||||
"description": "The locale to use for formatting dates. To change the locale pass a date-fns locale object.",
|
||||
"tsType": {
|
||||
"name": "Locale",
|
||||
"elements": [
|
||||
{
|
||||
"name": "signature",
|
||||
"type": "object",
|
||||
"raw": "{ code?: string ; formatDistance?: (...args: any[]) => any ; formatLong?: { date: (...args: any[]) => any ; dateTime: (...args: any[]) => any ; time: (...args: any[]) => any } ; formatRelative?: (...args: any[]) => any ; localize?: { day: (...args: any[]) => any ; dayPeriod: (...args: any[]) => any ; era: (...args: any[]) => any ; month: (...args: any[]) => any ; ordinalNumber: (...args: any[]) => any ; quarter: (...args: any[]) => any } ; match?: { day: (...args: any[]) => any ; dayPeriod: (...args: any[]) => any ; era: (...args: any[]) => any ; month: (...args: any[]) => any ; ordinalNumber: (...args: any[]) => any ; quarter: (...args: any[]) => any } ; options?: { firstWeekContainsDate?: 1 \\| 2 \\| 3 \\| 4 \\| 5 \\| 6 \\| 7 ; weekStartsOn?: 0 \\| 1 \\| 2 \\| 3 \\| 4 \\| 5 \\| 6 } }",
|
||||
"signature": {
|
||||
"properties": [
|
||||
{
|
||||
"key": "code",
|
||||
"value": {
|
||||
"name": "string"
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "formatDistance",
|
||||
"value": {
|
||||
"name": "signature",
|
||||
"type": "function",
|
||||
"raw": "(...args: any[]) => any",
|
||||
"signature": {
|
||||
"arguments": [
|
||||
{
|
||||
"name": "args",
|
||||
"type": {
|
||||
"name": "any[]"
|
||||
},
|
||||
"rest": true
|
||||
}
|
||||
],
|
||||
"return": {
|
||||
"name": "any"
|
||||
}
|
||||
}
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "formatLong",
|
||||
"value": {
|
||||
"name": "signature",
|
||||
"type": "object",
|
||||
"raw": "{ date: (...args: any[]) => any ; dateTime: (...args: any[]) => any ; time: (...args: any[]) => any }",
|
||||
"signature": {
|
||||
"properties": [
|
||||
{
|
||||
"key": "date",
|
||||
"value": {
|
||||
"name": "(...args: any[]) => any"
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "dateTime",
|
||||
"value": {
|
||||
"name": "(...args: any[]) => any"
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "time",
|
||||
"value": {
|
||||
"name": "(...args: any[]) => any"
|
||||
},
|
||||
"description": ""
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "formatRelative",
|
||||
"value": {
|
||||
"name": "signature",
|
||||
"type": "function",
|
||||
"raw": "(...args: any[]) => any",
|
||||
"signature": {
|
||||
"arguments": [
|
||||
{
|
||||
"name": "args",
|
||||
"type": {
|
||||
"name": "any[]"
|
||||
},
|
||||
"rest": true
|
||||
}
|
||||
],
|
||||
"return": {
|
||||
"name": "any"
|
||||
}
|
||||
}
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "localize",
|
||||
"value": {
|
||||
"name": "signature",
|
||||
"type": "object",
|
||||
"raw": "{ day: (...args: any[]) => any ; dayPeriod: (...args: any[]) => any ; era: (...args: any[]) => any ; month: (...args: any[]) => any ; ordinalNumber: (...args: any[]) => any ; quarter: (...args: any[]) => any }",
|
||||
"signature": {
|
||||
"properties": [
|
||||
{
|
||||
"key": "day",
|
||||
"value": {
|
||||
"name": "(...args: any[]) => any"
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "dayPeriod",
|
||||
"value": {
|
||||
"name": "(...args: any[]) => any"
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "era",
|
||||
"value": {
|
||||
"name": "(...args: any[]) => any"
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "month",
|
||||
"value": {
|
||||
"name": "(...args: any[]) => any"
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "ordinalNumber",
|
||||
"value": {
|
||||
"name": "(...args: any[]) => any"
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "quarter",
|
||||
"value": {
|
||||
"name": "(...args: any[]) => any"
|
||||
},
|
||||
"description": ""
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "match",
|
||||
"value": {
|
||||
"name": "signature",
|
||||
"type": "object",
|
||||
"raw": "{ day: (...args: any[]) => any ; dayPeriod: (...args: any[]) => any ; era: (...args: any[]) => any ; month: (...args: any[]) => any ; ordinalNumber: (...args: any[]) => any ; quarter: (...args: any[]) => any }",
|
||||
"signature": {
|
||||
"properties": [
|
||||
{
|
||||
"key": "day",
|
||||
"value": {
|
||||
"name": "(...args: any[]) => any"
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "dayPeriod",
|
||||
"value": {
|
||||
"name": "(...args: any[]) => any"
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "era",
|
||||
"value": {
|
||||
"name": "(...args: any[]) => any"
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "month",
|
||||
"value": {
|
||||
"name": "(...args: any[]) => any"
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "ordinalNumber",
|
||||
"value": {
|
||||
"name": "(...args: any[]) => any"
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "quarter",
|
||||
"value": {
|
||||
"name": "(...args: any[]) => any"
|
||||
},
|
||||
"description": ""
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "options",
|
||||
"value": {
|
||||
"name": "signature",
|
||||
"type": "object",
|
||||
"raw": "{ firstWeekContainsDate?: 1 \\| 2 \\| 3 \\| 4 \\| 5 \\| 6 \\| 7 ; weekStartsOn?: 0 \\| 1 \\| 2 \\| 3 \\| 4 \\| 5 \\| 6 }",
|
||||
"signature": {
|
||||
"properties": [
|
||||
{
|
||||
"key": "firstWeekContainsDate",
|
||||
"value": {
|
||||
"name": "1 \\| 2 \\| 3 \\| 4 \\| 5 \\| 6 \\| 7"
|
||||
},
|
||||
"description": ""
|
||||
},
|
||||
{
|
||||
"key": "weekStartsOn",
|
||||
"value": {
|
||||
"name": "0 \\| 1 \\| 2 \\| 3 \\| 4 \\| 5 \\| 6"
|
||||
},
|
||||
"description": ""
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
"description": ""
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
],
|
||||
"raw": "Locale"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,5 +1,5 @@
|
||||
{
|
||||
"description": "The value component of the command bar. This component is used to display a value, \nsuch as the number of selected items which the commands will act on.",
|
||||
"description": "The value component of the command bar. This component is used to display a value,\nsuch as the number of selected items which the commands will act on.",
|
||||
"methods": [],
|
||||
"displayName": "CommandBar.Value",
|
||||
"props": {}
|
||||
|
||||
@@ -10,6 +10,31 @@
|
||||
},
|
||||
"description": "The content to copy."
|
||||
},
|
||||
"variant": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
"name": "union",
|
||||
"raw": "\"mini\" | \"default\" | null",
|
||||
"elements": [
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"mini\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"default\""
|
||||
},
|
||||
{
|
||||
"name": "null"
|
||||
}
|
||||
]
|
||||
},
|
||||
"description": "The variant of the copy button.",
|
||||
"defaultValue": {
|
||||
"value": "\"default\"",
|
||||
"computed": false
|
||||
}
|
||||
},
|
||||
"asChild": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
|
||||
@@ -25,15 +25,15 @@
|
||||
"description": "The input's size.",
|
||||
"tsType": {
|
||||
"name": "union",
|
||||
"raw": "\"base\" \\| \"small\"",
|
||||
"raw": "\"small\" \\| \"base\"",
|
||||
"elements": [
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"base\""
|
||||
"value": "\"small\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"small\""
|
||||
"value": "\"base\""
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
@@ -59,6 +59,13 @@
|
||||
},
|
||||
"description": "The date to show dates to."
|
||||
},
|
||||
"locale": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
"name": "Locale"
|
||||
},
|
||||
"description": "The locale to use for formatting dates. To change the locale pass a date-fns locale object."
|
||||
},
|
||||
"className": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
@@ -80,6 +87,13 @@
|
||||
},
|
||||
"description": "Whether the date picker's input is required."
|
||||
},
|
||||
"placeholder": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
"name": "string"
|
||||
},
|
||||
"description": "The date picker's placeholder."
|
||||
},
|
||||
"size": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
@@ -105,6 +119,54 @@
|
||||
},
|
||||
"description": "Whether to show a time picker along with the date picker."
|
||||
},
|
||||
"translations": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
"name": "signature",
|
||||
"type": "object",
|
||||
"raw": "{\n cancel?: string\n apply?: string\n start?: string\n end?: string\n range?: string\n}",
|
||||
"signature": {
|
||||
"properties": [
|
||||
{
|
||||
"key": "cancel",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"key": "apply",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"key": "start",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"key": "end",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"key": "range",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
"description": "Translation keys for the date picker. Use this to localize the date picker."
|
||||
},
|
||||
"mode": {
|
||||
"defaultValue": {
|
||||
"value": "\"single\"",
|
||||
|
||||
6
www/apps/ui/src/specs/FocusModal/FocusModal.Close.json
Normal file
6
www/apps/ui/src/specs/FocusModal/FocusModal.Close.json
Normal file
@@ -0,0 +1,6 @@
|
||||
{
|
||||
"description": "",
|
||||
"methods": [],
|
||||
"displayName": "FocusModal.Close",
|
||||
"props": {}
|
||||
}
|
||||
@@ -55,8 +55,12 @@
|
||||
"description": "The button's size.",
|
||||
"tsType": {
|
||||
"name": "union",
|
||||
"raw": "\"base\" \\| \"large\" \\| \"xlarge\"",
|
||||
"raw": "\"small\" \\| \"base\" \\| \"large\" \\| \"xlarge\"",
|
||||
"elements": [
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"small\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"base\""
|
||||
|
||||
@@ -11,15 +11,15 @@
|
||||
"description": "The input's size.",
|
||||
"tsType": {
|
||||
"name": "union",
|
||||
"raw": "\"base\" \\| \"small\"",
|
||||
"raw": "\"small\" \\| \"base\"",
|
||||
"elements": [
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"base\""
|
||||
"value": "\"small\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"small\""
|
||||
"value": "\"base\""
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
@@ -11,15 +11,11 @@
|
||||
"description": "The label's size.",
|
||||
"tsType": {
|
||||
"name": "union",
|
||||
"raw": "\"base\" \\| \"large\" \\| \"small\" \\| \"xsmall\"",
|
||||
"raw": "\"xsmall\" \\| \"small\" \\| \"base\" \\| \"large\"",
|
||||
"elements": [
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"base\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"large\""
|
||||
"value": "\"xsmall\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
@@ -27,7 +23,11 @@
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"xsmall\""
|
||||
"value": "\"base\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"large\""
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
@@ -2,5 +2,28 @@
|
||||
"description": "This component is based on the [Radix UI Alert Dialog](https://www.radix-ui.com/primitives/docs/components/alert-dialog) primitives.",
|
||||
"methods": [],
|
||||
"displayName": "Prompt",
|
||||
"props": {}
|
||||
"props": {
|
||||
"variant": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
"name": "union",
|
||||
"raw": "\"danger\" | \"confirmation\"",
|
||||
"elements": [
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"danger\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"confirmation\""
|
||||
}
|
||||
]
|
||||
},
|
||||
"description": "The variant of the prompt.",
|
||||
"defaultValue": {
|
||||
"value": "\"danger\"",
|
||||
"computed": false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
6
www/apps/ui/src/specs/PromptProvider/PromptProvider.json
Normal file
6
www/apps/ui/src/specs/PromptProvider/PromptProvider.json
Normal file
@@ -0,0 +1,6 @@
|
||||
{
|
||||
"description": "",
|
||||
"methods": [],
|
||||
"displayName": "PromptProvider",
|
||||
"props": {}
|
||||
}
|
||||
@@ -59,6 +59,13 @@
|
||||
},
|
||||
"description": "The date to show dates to."
|
||||
},
|
||||
"locale": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
"name": "Locale"
|
||||
},
|
||||
"description": "The locale to use for formatting dates. To change the locale pass a date-fns locale object."
|
||||
},
|
||||
"className": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
@@ -80,6 +87,13 @@
|
||||
},
|
||||
"description": "Whether the date picker's input is required."
|
||||
},
|
||||
"placeholder": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
"name": "string"
|
||||
},
|
||||
"description": "The date picker's placeholder."
|
||||
},
|
||||
"size": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
@@ -109,6 +123,54 @@
|
||||
},
|
||||
"description": "Whether to show a time picker along with the date picker."
|
||||
},
|
||||
"translations": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
"name": "signature",
|
||||
"type": "object",
|
||||
"raw": "{\n cancel?: string\n apply?: string\n start?: string\n end?: string\n range?: string\n}",
|
||||
"signature": {
|
||||
"properties": [
|
||||
{
|
||||
"key": "cancel",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"key": "apply",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"key": "start",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"key": "end",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"key": "range",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
"description": "Translation keys for the date picker. Use this to localize the date picker."
|
||||
},
|
||||
"id": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
|
||||
@@ -17,6 +17,28 @@
|
||||
},
|
||||
"description": "The prompt's description."
|
||||
},
|
||||
"variant": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
"name": "union",
|
||||
"raw": "\"danger\" | \"confirmation\"",
|
||||
"elements": [
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"danger\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"confirmation\""
|
||||
}
|
||||
]
|
||||
},
|
||||
"description": "The variant of the prompt.",
|
||||
"defaultValue": {
|
||||
"value": "\"danger\"",
|
||||
"computed": false
|
||||
}
|
||||
},
|
||||
"verificationText": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
@@ -24,6 +46,17 @@
|
||||
},
|
||||
"description": "The text the user has to input in order to confirm the action."
|
||||
},
|
||||
"verificationInstruction": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
"name": "string"
|
||||
},
|
||||
"description": "The instruction for the verification text. Useful for passing a translated string to use instead of the default english one.\nShould be in the format: \"Please type {val} to confirm:\"",
|
||||
"defaultValue": {
|
||||
"value": "\"Please type {val} to confirm:\"",
|
||||
"computed": false
|
||||
}
|
||||
},
|
||||
"cancelText": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
|
||||
@@ -59,6 +59,13 @@
|
||||
},
|
||||
"description": "The date to show dates to."
|
||||
},
|
||||
"locale": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
"name": "Locale"
|
||||
},
|
||||
"description": "The locale to use for formatting dates. To change the locale pass a date-fns locale object."
|
||||
},
|
||||
"className": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
@@ -80,6 +87,13 @@
|
||||
},
|
||||
"description": "Whether the date picker's input is required."
|
||||
},
|
||||
"placeholder": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
"name": "string"
|
||||
},
|
||||
"description": "The date picker's placeholder."
|
||||
},
|
||||
"size": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
@@ -109,6 +123,54 @@
|
||||
},
|
||||
"description": "Whether to show a time picker along with the date picker."
|
||||
},
|
||||
"translations": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
"name": "signature",
|
||||
"type": "object",
|
||||
"raw": "{\n cancel?: string\n apply?: string\n start?: string\n end?: string\n range?: string\n}",
|
||||
"signature": {
|
||||
"properties": [
|
||||
{
|
||||
"key": "cancel",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"key": "apply",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"key": "start",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"key": "end",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"key": "range",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
"description": "Translation keys for the date picker. Use this to localize the date picker."
|
||||
},
|
||||
"id": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
|
||||
@@ -4,10 +4,14 @@
|
||||
"displayName": "StatusBadge",
|
||||
"props": {
|
||||
"color": {
|
||||
"required": false,
|
||||
"defaultValue": {
|
||||
"value": "\"grey\"",
|
||||
"computed": false
|
||||
},
|
||||
"description": "The status's color.",
|
||||
"tsType": {
|
||||
"name": "union",
|
||||
"raw": "\"green\" | \"red\" | \"blue\" | \"orange\" | \"grey\" | \"purple\"",
|
||||
"raw": "\"green\" \\| \"red\" \\| \"blue\" \\| \"orange\" \\| \"grey\" \\| \"purple\"",
|
||||
"elements": [
|
||||
{
|
||||
"name": "literal",
|
||||
@@ -35,14 +39,11 @@
|
||||
}
|
||||
]
|
||||
},
|
||||
"description": "The status's color.",
|
||||
"defaultValue": {
|
||||
"value": "\"grey\"",
|
||||
"computed": false
|
||||
}
|
||||
"required": false
|
||||
}
|
||||
},
|
||||
"composes": [
|
||||
"Omit"
|
||||
"Omit",
|
||||
"VariantProps"
|
||||
]
|
||||
}
|
||||
@@ -11,15 +11,15 @@
|
||||
"description": "The switch's size.",
|
||||
"tsType": {
|
||||
"name": "union",
|
||||
"raw": "\"base\" \\| \"small\"",
|
||||
"raw": "\"small\" \\| \"base\"",
|
||||
"elements": [
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"base\""
|
||||
"value": "\"small\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"small\""
|
||||
"value": "\"base\""
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
@@ -45,6 +45,58 @@
|
||||
},
|
||||
"description": "Whether there's a next page that can be navigated to."
|
||||
},
|
||||
"translations": {
|
||||
"required": false,
|
||||
"tsType": {
|
||||
"name": "signature",
|
||||
"type": "object",
|
||||
"raw": "{\n of?: string\n results?: string\n pages?: string\n prev?: string\n next?: string\n}",
|
||||
"signature": {
|
||||
"properties": [
|
||||
{
|
||||
"key": "of",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"key": "results",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"key": "pages",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"key": "prev",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"key": "next",
|
||||
"value": {
|
||||
"name": "string",
|
||||
"required": false
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
"description": "An optional object of words to use in the pagination component.\nUse this to override the default words, or translate them into another language.",
|
||||
"defaultValue": {
|
||||
"value": "{\n of: \"of\",\n results: \"results\",\n pages: \"pages\",\n prev: \"Prev\",\n next: \"Next\",\n}",
|
||||
"computed": false
|
||||
}
|
||||
},
|
||||
"previousPage": {
|
||||
"required": true,
|
||||
"tsType": {
|
||||
|
||||
@@ -48,8 +48,16 @@
|
||||
"description": "The text's size.",
|
||||
"tsType": {
|
||||
"name": "union",
|
||||
"raw": "\"base\" \\| \"large\" \\| \"small\" \\| \"xlarge\" \\| \"xsmall\"",
|
||||
"raw": "\"xsmall\" \\| \"small\" \\| \"base\" \\| \"large\" \\| \"xlarge\"",
|
||||
"elements": [
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"xsmall\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"small\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"base\""
|
||||
@@ -58,17 +66,9 @@
|
||||
"name": "literal",
|
||||
"value": "\"large\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"small\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"xlarge\""
|
||||
},
|
||||
{
|
||||
"name": "literal",
|
||||
"value": "\"xsmall\""
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user