mirror of
https://github.com/HoshinoSuzumi/rayine-ui.git
synced 2025-04-07 12:48:50 +08:00
🎨 chore: lint code
This commit is contained in:
parent
0e070c8909
commit
69cbab8bb4
@ -1,7 +1,7 @@
|
||||
<script lang="ts" setup>
|
||||
import { camelCase, upperFirst } from 'scule'
|
||||
import * as config from '#rayui/ui.config'
|
||||
import json5 from 'json5'
|
||||
import * as config from '#rayui/ui.config'
|
||||
|
||||
const route = useRoute()
|
||||
|
||||
@ -17,12 +17,11 @@ const componentCamelName = camelCase(slug)
|
||||
const componentName = `Ray${upperFirst(componentCamelName)}`
|
||||
|
||||
const defaults = config[componentCamelName as keyof typeof config]
|
||||
console.log(componentCamelName, JSON.stringify(defaults));
|
||||
|
||||
const { data: defaultsRender } = await useAsyncData(`${componentName}-defaults`, () => {
|
||||
return parseMarkdown(`
|
||||
\`\`\`yaml
|
||||
${json5.stringify(defaults, null, 2).replace(/,(\s+[}\]\|])/g, '$1') }
|
||||
${json5.stringify(defaults, null, 2).replace(/,(\s+[}\]|])/g, '$1')}
|
||||
\`\`\`
|
||||
`)
|
||||
})
|
||||
|
||||
@ -150,18 +150,31 @@ const { data: codeRender, error: codeRenderError } = await useAsyncData(`${compo
|
||||
</div>
|
||||
|
||||
<div v-if="customizableProps.length > 0" class="border-b border-neutral-200 dark:border-neutral-700 flex">
|
||||
<div v-for="(prop, k) in customizableProps" :key="k"
|
||||
class="px-2 py-0.5 flex flex-col gap-0.5 border-r dark:border-neutral-700">
|
||||
<div
|
||||
v-for="(prop, k) in customizableProps"
|
||||
:key="k"
|
||||
class="px-2 py-0.5 flex flex-col gap-0.5 border-r dark:border-neutral-700"
|
||||
>
|
||||
<label :for="`${prop.name}-prop`" class="text-sm text-neutral-400">{{ prop.name }}</label>
|
||||
<input v-if="prop.type.startsWith('boolean')" :id="`${prop.name}-prop`" v-model="componentProps[prop.name]"
|
||||
type="checkbox" class="mt-1 mb-2">
|
||||
<input
|
||||
v-if="prop.type.startsWith('boolean')"
|
||||
:id="`${prop.name}-prop`"
|
||||
v-model="componentProps[prop.name]"
|
||||
type="checkbox"
|
||||
class="mt-1 mb-2"
|
||||
>
|
||||
<select v-else-if="prop.options.length" :id="`${prop.name}-prop`" v-model="componentProps[prop.name]">
|
||||
<option v-for="option in prop.options" :key="option" :value="option">
|
||||
{{ option }}
|
||||
</option>
|
||||
</select>
|
||||
<input v-else :id="`${prop.name}-prop`" v-model="componentProps[prop.name]" type="text"
|
||||
placeholder="type something...">
|
||||
<input
|
||||
v-else
|
||||
:id="`${prop.name}-prop`"
|
||||
v-model="componentProps[prop.name]"
|
||||
type="text"
|
||||
placeholder="type something..."
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@ -8,24 +8,24 @@
|
||||
defineProps({
|
||||
code: {
|
||||
type: String,
|
||||
default: ''
|
||||
default: '',
|
||||
},
|
||||
language: {
|
||||
type: String,
|
||||
default: null
|
||||
default: null,
|
||||
},
|
||||
filename: {
|
||||
type: String,
|
||||
default: null
|
||||
default: null,
|
||||
},
|
||||
highlights: {
|
||||
type: Array as () => number[],
|
||||
default: () => []
|
||||
default: () => [],
|
||||
},
|
||||
meta: {
|
||||
type: String,
|
||||
default: null
|
||||
}
|
||||
default: null,
|
||||
},
|
||||
})
|
||||
</script>
|
||||
|
||||
@ -41,6 +41,4 @@ pre code .line {
|
||||
pre code .line.highlight {
|
||||
@apply !bg-gray-200/50 dark:!bg-gray-800;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
@ -3,39 +3,39 @@ import FileTypeVue from '../../icon/VscodeIconsFileTypeVue.vue'
|
||||
import FileTypeTypescript from '../../icon/VscodeIconsFileTypeTypescriptOfficial.vue'
|
||||
import FileTypeJavascript from '../../icon/VscodeIconsFileTypeJsOfficial.vue'
|
||||
import TablerTerminal from '../../icon/TablerTerminal.vue'
|
||||
import TablerFile from '~/components/icon/TablerFile.vue';
|
||||
import VscodeIconsFileTypeJson from '~/components/icon/VscodeIconsFileTypeJson.vue';
|
||||
import VscodeIconsFileTypeNuxt from '~/components/icon/VscodeIconsFileTypeNuxt.vue';
|
||||
import TablerFile from '~/components/icon/TablerFile.vue'
|
||||
import VscodeIconsFileTypeJson from '~/components/icon/VscodeIconsFileTypeJson.vue'
|
||||
import VscodeIconsFileTypeNuxt from '~/components/icon/VscodeIconsFileTypeNuxt.vue'
|
||||
|
||||
const props = defineProps({
|
||||
code: {
|
||||
type: String,
|
||||
default: ''
|
||||
default: '',
|
||||
},
|
||||
language: {
|
||||
type: String,
|
||||
default: null
|
||||
default: null,
|
||||
},
|
||||
filename: {
|
||||
type: String,
|
||||
default: null
|
||||
default: null,
|
||||
},
|
||||
highlights: {
|
||||
type: Array as () => number[],
|
||||
default: () => []
|
||||
default: () => [],
|
||||
},
|
||||
meta: {
|
||||
type: String,
|
||||
default: null
|
||||
default: null,
|
||||
},
|
||||
class: {
|
||||
type: String,
|
||||
default: null
|
||||
default: null,
|
||||
},
|
||||
style: {
|
||||
type: [String, Object],
|
||||
default: null
|
||||
}
|
||||
default: null,
|
||||
},
|
||||
})
|
||||
|
||||
const mapIconLanguage = {
|
||||
@ -46,17 +46,17 @@ const mapIconLanguage = {
|
||||
'sh': TablerTerminal,
|
||||
'ts': FileTypeTypescript,
|
||||
'js': FileTypeJavascript,
|
||||
'json': VscodeIconsFileTypeJson
|
||||
'json': VscodeIconsFileTypeJson,
|
||||
}
|
||||
|
||||
const mapIconFilename = {
|
||||
'nuxt.config.ts': VscodeIconsFileTypeNuxt
|
||||
'nuxt.config.ts': VscodeIconsFileTypeNuxt,
|
||||
}
|
||||
|
||||
const resolveIcon = computed(() => {
|
||||
if (props.filename) {
|
||||
if (props.filename.endsWith('.vue')) return FileTypeVue
|
||||
|
||||
|
||||
const icon = mapIconFilename[props.filename as keyof typeof mapIconFilename]
|
||||
if (icon) return icon
|
||||
}
|
||||
@ -72,9 +72,15 @@ const resolveIcon = computed(() => {
|
||||
<span class="text-sm text-neutral-500 dark:text-neutral-400">{{ filename }}</span>
|
||||
</span>
|
||||
</div>
|
||||
<ProseCode data-prose-precode :code="code" :language="language" :filename="filename" :highlights="highlights"
|
||||
:meta="meta">
|
||||
<pre data-prose-pre-inner-pre :class="$props.class" :style="style"><slot></slot></pre>
|
||||
<ProseCode
|
||||
data-prose-precode
|
||||
:code="code"
|
||||
:language="language"
|
||||
:filename="filename"
|
||||
:highlights="highlights"
|
||||
:meta="meta"
|
||||
>
|
||||
<pre data-prose-pre-inner-pre :class="$props.class" :style="style"><slot /></pre>
|
||||
</ProseCode>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -1,10 +1,9 @@
|
||||
|
||||
<template>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="M14 3v4a1 1 0 0 0 1 1h4"></path><path d="M17 21H7a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h7l5 5v11a2 2 0 0 1-2 2"></path></g></svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="M14 3v4a1 1 0 0 0 1 1h4" /><path d="M17 21H7a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h7l5 5v11a2 2 0 0 1-2 2" /></g></svg>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'TablerFile'
|
||||
name: 'TablerFile',
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
|
||||
@ -1,10 +1,9 @@
|
||||
|
||||
<template>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="#f5de19" d="M4.014 14.976a2.5 2.5 0 0 0 1.567-.518a2.38 2.38 0 0 0 .805-1.358a15.3 15.3 0 0 0 .214-2.944q.012-2.085.075-2.747a5.2 5.2 0 0 1 .418-1.686a3 3 0 0 1 .755-1.018A3.05 3.05 0 0 1 9 4.125A6.8 6.8 0 0 1 10.544 4h.7v1.96h-.387a2.34 2.34 0 0 0-1.723.468a3.4 3.4 0 0 0-.425 2.092a36 36 0 0 1-.137 4.133a4.7 4.7 0 0 1-.768 2.06A4.6 4.6 0 0 1 6.1 16a3.8 3.8 0 0 1 1.992 1.754a8.9 8.9 0 0 1 .618 3.865q0 2.435.05 2.9a1.76 1.76 0 0 0 .504 1.181a2.64 2.64 0 0 0 1.592.337h.387V28h-.7a5.7 5.7 0 0 1-1.773-.2a2.97 2.97 0 0 1-1.324-.93a3.35 3.35 0 0 1-.681-1.63a24 24 0 0 1-.165-3.234a16.5 16.5 0 0 0-.214-3.106a2.4 2.4 0 0 0-.805-1.361a2.5 2.5 0 0 0-1.567-.524Zm23.972 2.035a2.5 2.5 0 0 0-1.567.524a2.4 2.4 0 0 0-.805 1.361a16.5 16.5 0 0 0-.212 3.109a24 24 0 0 1-.169 3.234a3.35 3.35 0 0 1-.681 1.63a2.97 2.97 0 0 1-1.324.93a5.7 5.7 0 0 1-1.773.2h-.7V26.04h.387a2.64 2.64 0 0 0 1.592-.337a1.76 1.76 0 0 0 .506-1.186q.05-.462.05-2.9a8.9 8.9 0 0 1 .618-3.865A3.8 3.8 0 0 1 25.9 16a4.6 4.6 0 0 1-1.7-1.286a4.7 4.7 0 0 1-.768-2.06a36 36 0 0 1-.137-4.133a3.4 3.4 0 0 0-.425-2.092a2.34 2.34 0 0 0-1.723-.468h-.387V4h.7a6.8 6.8 0 0 1 1.54.125a3.05 3.05 0 0 1 1.149.581a3 3 0 0 1 .755 1.018a5.2 5.2 0 0 1 .418 1.686q.062.662.075 2.747a15.3 15.3 0 0 0 .212 2.947a2.38 2.38 0 0 0 .805 1.355a2.5 2.5 0 0 0 1.567.518Z"></path></svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="#f5de19" d="M4.014 14.976a2.5 2.5 0 0 0 1.567-.518a2.38 2.38 0 0 0 .805-1.358a15.3 15.3 0 0 0 .214-2.944q.012-2.085.075-2.747a5.2 5.2 0 0 1 .418-1.686a3 3 0 0 1 .755-1.018A3.05 3.05 0 0 1 9 4.125A6.8 6.8 0 0 1 10.544 4h.7v1.96h-.387a2.34 2.34 0 0 0-1.723.468a3.4 3.4 0 0 0-.425 2.092a36 36 0 0 1-.137 4.133a4.7 4.7 0 0 1-.768 2.06A4.6 4.6 0 0 1 6.1 16a3.8 3.8 0 0 1 1.992 1.754a8.9 8.9 0 0 1 .618 3.865q0 2.435.05 2.9a1.76 1.76 0 0 0 .504 1.181a2.64 2.64 0 0 0 1.592.337h.387V28h-.7a5.7 5.7 0 0 1-1.773-.2a2.97 2.97 0 0 1-1.324-.93a3.35 3.35 0 0 1-.681-1.63a24 24 0 0 1-.165-3.234a16.5 16.5 0 0 0-.214-3.106a2.4 2.4 0 0 0-.805-1.361a2.5 2.5 0 0 0-1.567-.524Zm23.972 2.035a2.5 2.5 0 0 0-1.567.524a2.4 2.4 0 0 0-.805 1.361a16.5 16.5 0 0 0-.212 3.109a24 24 0 0 1-.169 3.234a3.35 3.35 0 0 1-.681 1.63a2.97 2.97 0 0 1-1.324.93a5.7 5.7 0 0 1-1.773.2h-.7V26.04h.387a2.64 2.64 0 0 0 1.592-.337a1.76 1.76 0 0 0 .506-1.186q.05-.462.05-2.9a8.9 8.9 0 0 1 .618-3.865A3.8 3.8 0 0 1 25.9 16a4.6 4.6 0 0 1-1.7-1.286a4.7 4.7 0 0 1-.768-2.06a36 36 0 0 1-.137-4.133a3.4 3.4 0 0 0-.425-2.092a2.34 2.34 0 0 0-1.723-.468h-.387V4h.7a6.8 6.8 0 0 1 1.54.125a3.05 3.05 0 0 1 1.149.581a3 3 0 0 1 .755 1.018a5.2 5.2 0 0 1 .418 1.686q.062.662.075 2.747a15.3 15.3 0 0 0 .212 2.947a2.38 2.38 0 0 0 .805 1.355a2.5 2.5 0 0 0 1.567.518Z" /></svg>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'VscodeIconsFileTypeJson'
|
||||
name: 'VscodeIconsFileTypeJson',
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
|
||||
@ -1,10 +1,9 @@
|
||||
|
||||
<template>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="#00DC82" d="M17.708 25h10.409c.33 0 .655-.088.942-.254a1.9 1.9 0 0 0 .689-.696a1.91 1.91 0 0 0 0-1.9L22.756 9.936a1.87 1.87 0 0 0-3.261 0l-1.788 3.125l-3.494-6.111a1.871 1.871 0 0 0-3.262 0l-8.7 15.2a1.91 1.91 0 0 0 .69 2.595c.286.167.61.255.941.255h6.534c2.589 0 4.498-1.147 5.811-3.385l3.19-5.572l1.708-2.982l5.127 8.957h-6.835zm-7.398-2.985l-4.56-.001l6.836-11.942l3.41 5.97l-2.283 3.992c-.873 1.452-1.864 1.981-3.403 1.981"></path></svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="#00DC82" d="M17.708 25h10.409c.33 0 .655-.088.942-.254a1.9 1.9 0 0 0 .689-.696a1.91 1.91 0 0 0 0-1.9L22.756 9.936a1.87 1.87 0 0 0-3.261 0l-1.788 3.125l-3.494-6.111a1.871 1.871 0 0 0-3.262 0l-8.7 15.2a1.91 1.91 0 0 0 .69 2.595c.286.167.61.255.941.255h6.534c2.589 0 4.498-1.147 5.811-3.385l3.19-5.572l1.708-2.982l5.127 8.957h-6.835zm-7.398-2.985l-4.56-.001l6.836-11.942l3.41 5.97l-2.283 3.992c-.873 1.452-1.864 1.981-3.403 1.981" /></svg>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'VscodeIconsFileTypeNuxt'
|
||||
name: 'VscodeIconsFileTypeNuxt',
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
|
||||
@ -86,12 +86,13 @@ export default defineComponent({
|
||||
})
|
||||
|
||||
return {
|
||||
// eslint-disable-next-line vue/no-dupe-keys
|
||||
ui,
|
||||
attrs,
|
||||
extProps,
|
||||
buttonClass,
|
||||
}
|
||||
}
|
||||
},
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
@ -1,69 +1,69 @@
|
||||
export default {
|
||||
base: "focus:outline-none focus-visible:outline-0 disabled:cursor-not-allowed disabled:opacity-70 aria-disabled:cursor-not-allowed aria-disabled:opacity-70 flex-shrink-0 transition",
|
||||
rounded: "rounded-lg",
|
||||
font: "font-medium",
|
||||
block: "w-full flex justify-center items-center",
|
||||
inline: "inline-flex items-center",
|
||||
base: 'focus:outline-none focus-visible:outline-0 disabled:cursor-not-allowed disabled:opacity-70 aria-disabled:cursor-not-allowed aria-disabled:opacity-70 flex-shrink-0 transition',
|
||||
rounded: 'rounded-lg',
|
||||
font: 'font-medium',
|
||||
block: 'w-full flex justify-center items-center',
|
||||
inline: 'inline-flex items-center',
|
||||
size: {
|
||||
"2xs": "text-xs",
|
||||
xs: "text-xs",
|
||||
sm: "text-sm",
|
||||
md: "text-sm",
|
||||
lg: "text-sm",
|
||||
xl: "text-base",
|
||||
'2xs': 'text-xs',
|
||||
'xs': 'text-xs',
|
||||
'sm': 'text-sm',
|
||||
'md': 'text-sm',
|
||||
'lg': 'text-sm',
|
||||
'xl': 'text-base',
|
||||
},
|
||||
padding: {
|
||||
"2xs": "px-2 py-1",
|
||||
xs: "px-2.5 py-1.5",
|
||||
sm: "px-2.5 py-1.5",
|
||||
md: "px-3 py-2",
|
||||
lg: "px-3.5 py-2.5",
|
||||
xl: "px-3.5 py-2.5",
|
||||
'2xs': 'px-2 py-1',
|
||||
'xs': 'px-2.5 py-1.5',
|
||||
'sm': 'px-2.5 py-1.5',
|
||||
'md': 'px-3 py-2',
|
||||
'lg': 'px-3.5 py-2.5',
|
||||
'xl': 'px-3.5 py-2.5',
|
||||
},
|
||||
square: {
|
||||
"2xs": "p-1",
|
||||
xs: "p-1.5",
|
||||
sm: "p-1.5",
|
||||
md: "p-2",
|
||||
lg: "p-2.5",
|
||||
xl: "p-2.5",
|
||||
'2xs': 'p-1',
|
||||
'xs': 'p-1.5',
|
||||
'sm': 'p-1.5',
|
||||
'md': 'p-2',
|
||||
'lg': 'p-2.5',
|
||||
'xl': 'p-2.5',
|
||||
},
|
||||
icon: {
|
||||
base: "flex-shrink-0",
|
||||
loading: "animate-spin",
|
||||
base: 'flex-shrink-0',
|
||||
loading: 'animate-spin',
|
||||
size: {
|
||||
"2xs": "h-4 w-4",
|
||||
xs: "h-4 w-4",
|
||||
sm: "h-5 w-5",
|
||||
md: "h-5 w-5",
|
||||
lg: "h-5 w-5",
|
||||
xl: "h-6 w-6",
|
||||
'2xs': 'h-4 w-4',
|
||||
'xs': 'h-4 w-4',
|
||||
'sm': 'h-5 w-5',
|
||||
'md': 'h-5 w-5',
|
||||
'lg': 'h-5 w-5',
|
||||
'xl': 'h-6 w-6',
|
||||
},
|
||||
},
|
||||
color: {
|
||||
match: {
|
||||
solid:
|
||||
"shadow-sm active:shadow-none bg-white dark:bg-gray-900 hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-900 dark:text-white ring-1 ring-inset ring-gray-300 dark:ring-gray-700 disabled:bg-white disabled:active:shadow-sm focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400",
|
||||
'shadow-sm active:shadow-none bg-white dark:bg-gray-900 hover:bg-gray-100 dark:hover:bg-gray-800 text-gray-900 dark:text-white ring-1 ring-inset ring-gray-300 dark:ring-gray-700 disabled:bg-white disabled:active:shadow-sm focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400',
|
||||
},
|
||||
invert: {
|
||||
solid:
|
||||
"shadow-sm active:shadow-none bg-gray-900 dark:bg-white hover:bg-gray-800 dark:hover:bg-gray-100 text-white dark:text-gray-900 ring-1 ring-inset ring-gray-900 dark:ring-white disabled:bg-white disabled:active:shadow-sm focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400",
|
||||
'shadow-sm active:shadow-none bg-gray-900 dark:bg-white hover:bg-gray-800 dark:hover:bg-gray-100 text-white dark:text-gray-900 ring-1 ring-inset ring-gray-900 dark:ring-white disabled:bg-white disabled:active:shadow-sm focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400',
|
||||
},
|
||||
},
|
||||
variant: {
|
||||
solid:
|
||||
"shadow-sm hover:shadow-md disabled:hover:shadow-sm active:shadow-none bg-{color}-500 disabled:bg-{color}-500 aria-disabled:bg-{color}-500 hover:bg-{color}-600 text-white active:bg-{color}-700 dark:active:bg-{color}-500 focus:ring focus:ring-{color}-300 focus:ring-opacity-50 dark:focus:ring-opacity-20",
|
||||
'shadow-sm hover:shadow-md disabled:hover:shadow-sm active:shadow-none bg-{color}-500 disabled:bg-{color}-500 aria-disabled:bg-{color}-500 hover:bg-{color}-600 text-white active:bg-{color}-700 dark:active:bg-{color}-500 focus:ring focus:ring-{color}-300 focus:ring-opacity-50 dark:focus:ring-opacity-20',
|
||||
outline:
|
||||
"ring-1 ring-inset ring-current ring-{color}-500 text-{color}-500 dark:hover:text-{color}-400 dark:hover:text-{color}-500 hover:bg-{color}-100 dark:hover:bg-{color}-900 disabled:bg-transparent disabled:hover:bg-transparent aria-disabled:bg-transparent focus-visible:ring-2 focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400",
|
||||
soft: "text-{color}-500 dark:text-{color}-400 bg-{color}-50 hover:bg-{color}-100 disabled:bg-{color}-50 aria-disabled:bg-{color}-50 dark:bg-{color}-950 dark:hover:bg-{color}-900 dark:disabled:bg-{color}-950 dark:aria-disabled:bg-{color}-950 focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400 transition-none",
|
||||
'ring-1 ring-inset ring-current ring-{color}-500 text-{color}-500 dark:hover:text-{color}-400 dark:hover:text-{color}-500 hover:bg-{color}-100 dark:hover:bg-{color}-900 disabled:bg-transparent disabled:hover:bg-transparent aria-disabled:bg-transparent focus-visible:ring-2 focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400',
|
||||
soft: 'text-{color}-500 dark:text-{color}-400 bg-{color}-50 hover:bg-{color}-100 disabled:bg-{color}-50 aria-disabled:bg-{color}-50 dark:bg-{color}-950 dark:hover:bg-{color}-900 dark:disabled:bg-{color}-950 dark:aria-disabled:bg-{color}-950 focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400 transition-none',
|
||||
ghost:
|
||||
"text-{color}-500 dark:text-{color}-400 hover:bg-{color}-50 disabled:bg-transparent aria-disabled:bg-transparent dark:hover:bg-{color}-950 dark:disabled:bg-transparent dark:aria-disabled:bg-transparent focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400",
|
||||
link: "text-{color}-500 hover:text-{color}-600 disabled:text-{color}-500 aria-disabled:text-{color}-500 dark:text-{color}-400 dark:hover:text-{color}-500 dark:disabled:text-{color}-400 dark:aria-disabled:text-{color}-400 underline-offset-4 hover:underline focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400",
|
||||
'text-{color}-500 dark:text-{color}-400 hover:bg-{color}-50 disabled:bg-transparent aria-disabled:bg-transparent dark:hover:bg-{color}-950 dark:disabled:bg-transparent dark:aria-disabled:bg-transparent focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400',
|
||||
link: 'text-{color}-500 hover:text-{color}-600 disabled:text-{color}-500 aria-disabled:text-{color}-500 dark:text-{color}-400 dark:hover:text-{color}-500 dark:disabled:text-{color}-400 dark:aria-disabled:text-{color}-400 underline-offset-4 hover:underline focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-{color}-500 dark:focus-visible:ring-{color}-400',
|
||||
},
|
||||
default: {
|
||||
size: "sm",
|
||||
color: "primary",
|
||||
variant: "solid",
|
||||
loadingIcon: "loading",
|
||||
size: 'sm',
|
||||
color: 'primary',
|
||||
variant: 'solid',
|
||||
loadingIcon: 'loading',
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user