Merge branch 'dev' into cli-nypm-and-other-improves
This commit is contained in:
sadeghbarati
commit
5a0ee4ecb5
|
|
@ -74,7 +74,7 @@ export default defineConfig({
|
|||
css: {
|
||||
postcss: {
|
||||
plugins: [
|
||||
tailwind(),
|
||||
tailwind() as any,
|
||||
autoprefixer(),
|
||||
],
|
||||
},
|
||||
|
|
|
|||
|
|
@ -290,9 +290,7 @@ watch(() => $route.path, (n) => {
|
|||
</DialogContent>
|
||||
</Dialog>
|
||||
<DefaultToaster />
|
||||
<ClientOnly>
|
||||
<NewYorkSonner :theme="isDark ? 'dark' : 'light'" />
|
||||
</ClientOnly>
|
||||
<NewYorkSonner :theme="'system'" />
|
||||
<NewYorkToaster />
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { dependencies as deps } from '../../../package.json'
|
|||
import { Index as demoIndex } from '../../../../www/__registry__'
|
||||
import tailwindConfigRaw from '../../../tailwind.config?raw'
|
||||
import cssRaw from '../../../../../packages/cli/test/fixtures/nuxt/assets/css/tailwind.css?raw'
|
||||
import { type Style } from '@/lib/registry/styles'
|
||||
import type { Style } from '@/lib/registry/styles'
|
||||
|
||||
export function makeCodeSandboxParams(componentName: string, style: Style, sources: Record<string, string>) {
|
||||
let files: Record<string, any> = {}
|
||||
|
|
@ -164,7 +164,6 @@ function constructFiles(componentName: string, style: Style, sources: Record<str
|
|||
isBinary: false,
|
||||
content: `import { type ClassValue, clsx } from 'clsx'
|
||||
import { twMerge } from 'tailwind-merge'
|
||||
import { camelize, getCurrentInstance, toHandlerKey } from 'vue'
|
||||
|
||||
export function cn(...inputs: ClassValue[]) {
|
||||
return twMerge(clsx(inputs))
|
||||
|
|
|
|||
|
|
@ -19,25 +19,25 @@
|
|||
"@morev/vue-transitions": "^2.3.6",
|
||||
"@radix-icons/vue": "^1.0.0",
|
||||
"@stackblitz/sdk": "^1.9.0",
|
||||
"@tanstack/vue-table": "^8.11.8",
|
||||
"@unovis/ts": "^1.3.3",
|
||||
"@unovis/vue": "^1.3.3",
|
||||
"@tanstack/vue-table": "^8.13.2",
|
||||
"@unovis/ts": "^1.3.5",
|
||||
"@unovis/vue": "^1.3.5",
|
||||
"@vee-validate/zod": "^4.12.5",
|
||||
"@vueuse/core": "^10.7.2",
|
||||
"@vueuse/core": "^10.9.0",
|
||||
"class-variance-authority": "^0.7.0",
|
||||
"clsx": "^2.1.0",
|
||||
"codesandbox": "^2.2.3",
|
||||
"date-fns": "^2.30.0",
|
||||
"embla-carousel": "^8.0.0-rc22",
|
||||
"embla-carousel-autoplay": "^8.0.0-rc22",
|
||||
"embla-carousel-vue": "^8.0.0-rc22",
|
||||
"date-fns": "^3.3.1",
|
||||
"embla-carousel": "^8.0.0",
|
||||
"embla-carousel-autoplay": "^8.0.0",
|
||||
"embla-carousel-vue": "^8.0.0",
|
||||
"lucide-vue-next": "^0.276.0",
|
||||
"radix-vue": "^1.4.8",
|
||||
"radix-vue": "^1.4.9",
|
||||
"tailwindcss-animate": "^1.0.7",
|
||||
"v-calendar": "^3.1.2",
|
||||
"vee-validate": "4.12.5",
|
||||
"vue": "^3.4.15",
|
||||
"vue-sonner": "^1.0.3",
|
||||
"vue": "^3.4.21",
|
||||
"vue-sonner": "^1.1.0",
|
||||
"vue-wrap-balancer": "^1.1.3",
|
||||
"zod": "^3.22.4"
|
||||
},
|
||||
|
|
@ -46,27 +46,27 @@
|
|||
"@iconify-json/tabler": "^1.1.89",
|
||||
"@iconify/json": "^2.2.108",
|
||||
"@iconify/vue": "^4.1.1",
|
||||
"@shikijs/transformers": "^1.0.0-beta.3",
|
||||
"@types/lodash.template": "^4.5.2",
|
||||
"@types/node": "^20.8.10",
|
||||
"@vitejs/plugin-vue": "^5.0.3",
|
||||
"@shikijs/transformers": "^1.1.7",
|
||||
"@types/lodash.template": "^4.5.3",
|
||||
"@types/node": "^20.11.24",
|
||||
"@vitejs/plugin-vue": "^5.0.4",
|
||||
"@vitejs/plugin-vue-jsx": "^3.1.0",
|
||||
"@vue/compiler-core": "^3.4.15",
|
||||
"@vue/compiler-dom": "^3.4.15",
|
||||
"@vue/compiler-core": "^3.4.21",
|
||||
"@vue/compiler-dom": "^3.4.21",
|
||||
"@vue/tsconfig": "^0.5.1",
|
||||
"autoprefixer": "^10.4.17",
|
||||
"lodash.template": "^4.5.0",
|
||||
"oxc-parser": "^0.2.0",
|
||||
"oxc-parser": "^0.7.0",
|
||||
"pathe": "^1.1.2",
|
||||
"rimraf": "^5.0.5",
|
||||
"shiki": "^1.0.0-beta.3",
|
||||
"shiki": "^1.1.7",
|
||||
"tailwind-merge": "^2.2.1",
|
||||
"tailwindcss": "^3.4.1",
|
||||
"tsx": "^4.7.0",
|
||||
"tsx": "^4.7.1",
|
||||
"typescript": "^5.3.3",
|
||||
"unplugin-icons": "^0.18.3",
|
||||
"vite": "^5.0.12",
|
||||
"vitepress": "^1.0.0-rc.41",
|
||||
"unplugin-icons": "^0.18.5",
|
||||
"vite": "^5.1.4",
|
||||
"vitepress": "^1.0.0-rc.44",
|
||||
"vue-tsc": "^1.8.27"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,7 +4,6 @@ description: Powerful table and datagrids built using TanStack Table.
|
|||
primitive: https://tanstack.com/table/v8/docs/guide/introduction
|
||||
---
|
||||
|
||||
|
||||
<ComponentPreview name="DataTableDemo" />
|
||||
|
||||
## Introduction
|
||||
|
|
@ -56,7 +55,6 @@ npm install @tanstack/vue-table
|
|||
|
||||
<ComponentPreview name="DataTableColumnPinningDemo" />
|
||||
|
||||
|
||||
## Prerequisites
|
||||
|
||||
We are going to build a table to show recent payments. Here's what our data looks like:
|
||||
|
|
@ -219,7 +217,6 @@ const table = useVueTable({
|
|||
|
||||
</Callout>
|
||||
|
||||
|
||||
### Render the table
|
||||
|
||||
Finally, we'll render our table in our index component.
|
||||
|
|
@ -270,7 +267,6 @@ Let's format the amount cell to display the dollar amount. We'll also align the
|
|||
|
||||
Update the `header` and `cell` definitions for amount as follows:
|
||||
|
||||
|
||||
```ts:line-numbers title="components/payments/columns.ts" {5-17}
|
||||
import { h } from 'vue'
|
||||
|
||||
|
|
@ -345,7 +341,6 @@ function copy(id: string) {
|
|||
|
||||
Update our columns definition to add a new `actions` column. The `actions` cell returns a `<Dropdown />` component.
|
||||
|
||||
|
||||
```ts:line-numbers showLineNumber{2,6-16}
|
||||
import { ColumnDef } from "@tanstack/vue-table"
|
||||
import DropdownAction from '@/components/DataTableDropDown.vue'
|
||||
|
|
@ -459,7 +454,6 @@ Let's make the email column sortable.
|
|||
```ts:line-numbers {5,6,12-17}
|
||||
import { type ClassValue, clsx } from 'clsx'
|
||||
import { twMerge } from 'tailwind-merge'
|
||||
import { camelize, getCurrentInstance, toHandlerKey } from 'vue'
|
||||
|
||||
import type { Updater } from '@tanstack/vue-table'
|
||||
import { type Ref } from 'vue'
|
||||
|
|
@ -971,11 +965,9 @@ export const columns = [
|
|||
{
|
||||
accessorKey: "email",
|
||||
header: ({ column }) => (
|
||||
return h(DataTableColumnHeader, {
|
||||
props: {
|
||||
h(DataTableColumnHeader, {
|
||||
column: column,
|
||||
title: 'Email'
|
||||
}
|
||||
})
|
||||
),
|
||||
},
|
||||
|
|
|
|||
|
|
@ -49,5 +49,5 @@ const onSubmit = handleSubmit((values) => {
|
|||
<Button type="submit">
|
||||
Submit
|
||||
</Button>
|
||||
</Form>
|
||||
</form>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -50,5 +50,5 @@ const onSubmit = handleSubmit((values) => {
|
|||
<Button type="submit">
|
||||
Submit
|
||||
</Button>
|
||||
</Form>
|
||||
</form>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -7,15 +7,16 @@ const props = defineProps<ToasterProps>()
|
|||
<template>
|
||||
<Sonner
|
||||
class="toaster group"
|
||||
:class-names="{
|
||||
toast:
|
||||
'group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg',
|
||||
v-bind="props"
|
||||
:toast-options="{
|
||||
classes: {
|
||||
toast: 'group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg',
|
||||
description: 'group-[.toast]:text-muted-foreground',
|
||||
actionButton:
|
||||
'group-[.toast]:bg-primary group-[.toast]:text-primary-foreground',
|
||||
cancelButton:
|
||||
'group-[.toast]:bg-muted group-[.toast]:text-muted-foreground',
|
||||
},
|
||||
}"
|
||||
v-bind="props"
|
||||
/>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -49,5 +49,5 @@ const onSubmit = handleSubmit((values) => {
|
|||
<Button type="submit">
|
||||
Submit
|
||||
</Button>
|
||||
</Form>
|
||||
</form>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -50,5 +50,5 @@ const onSubmit = handleSubmit((values) => {
|
|||
<Button type="submit">
|
||||
Submit
|
||||
</Button>
|
||||
</Form>
|
||||
</form>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -7,15 +7,16 @@ const props = defineProps<ToasterProps>()
|
|||
<template>
|
||||
<Sonner
|
||||
class="toaster group"
|
||||
:class-names="{
|
||||
toast:
|
||||
'group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg',
|
||||
v-bind="props"
|
||||
:toast-options="{
|
||||
classes: {
|
||||
toast: 'group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg',
|
||||
description: 'group-[.toast]:text-muted-foreground',
|
||||
actionButton:
|
||||
'group-[.toast]:bg-primary group-[.toast]:text-primary-foreground',
|
||||
cancelButton:
|
||||
'group-[.toast]:bg-muted group-[.toast]:text-muted-foreground',
|
||||
},
|
||||
}"
|
||||
v-bind="props"
|
||||
/>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
"files": [
|
||||
{
|
||||
"name": "Sonner.vue",
|
||||
"content": "<script lang=\"ts\" setup>\nimport { Toaster as Sonner, type ToasterProps } from 'vue-sonner'\n\nconst props = defineProps<ToasterProps>()\n</script>\n\n<template>\n <Sonner\n class=\"toaster group\"\n :class-names=\"{\n toast:\n 'group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg',\n description: 'group-[.toast]:text-muted-foreground',\n actionButton:\n 'group-[.toast]:bg-primary group-[.toast]:text-primary-foreground',\n cancelButton:\n 'group-[.toast]:bg-muted group-[.toast]:text-muted-foreground',\n }\"\n v-bind=\"props\"\n />\n</template>\n"
|
||||
"content": "<script lang=\"ts\" setup>\nimport { Toaster as Sonner, type ToasterProps } from 'vue-sonner'\n\nconst props = defineProps<ToasterProps>()\n</script>\n\n<template>\n <Sonner\n class=\"toaster group\"\n v-bind=\"props\"\n :toast-options=\"{\n classes: {\n toast: 'group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg',\n description: 'group-[.toast]:text-muted-foreground',\n actionButton:\n 'group-[.toast]:bg-primary group-[.toast]:text-primary-foreground',\n cancelButton:\n 'group-[.toast]:bg-muted group-[.toast]:text-muted-foreground',\n },\n }\"\n />\n</template>\n"
|
||||
},
|
||||
{
|
||||
"name": "index.ts",
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
"files": [
|
||||
{
|
||||
"name": "Sonner.vue",
|
||||
"content": "<script lang=\"ts\" setup>\nimport { Toaster as Sonner, type ToasterProps } from 'vue-sonner'\n\nconst props = defineProps<ToasterProps>()\n</script>\n\n<template>\n <Sonner\n class=\"toaster group\"\n :class-names=\"{\n toast:\n 'group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg',\n description: 'group-[.toast]:text-muted-foreground',\n actionButton:\n 'group-[.toast]:bg-primary group-[.toast]:text-primary-foreground',\n cancelButton:\n 'group-[.toast]:bg-muted group-[.toast]:text-muted-foreground',\n }\"\n v-bind=\"props\"\n />\n</template>\n"
|
||||
"content": "<script lang=\"ts\" setup>\nimport { Toaster as Sonner, type ToasterProps } from 'vue-sonner'\n\nconst props = defineProps<ToasterProps>()\n</script>\n\n<template>\n <Sonner\n class=\"toaster group\"\n v-bind=\"props\"\n :toast-options=\"{\n classes: {\n toast: 'group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg',\n description: 'group-[.toast]:text-muted-foreground',\n actionButton:\n 'group-[.toast]:bg-primary group-[.toast]:text-primary-foreground',\n cancelButton:\n 'group-[.toast]:bg-muted group-[.toast]:text-muted-foreground',\n },\n }\"\n />\n</template>\n"
|
||||
},
|
||||
{
|
||||
"name": "index.ts",
|
||||
|
|
|
|||
1120
pnpm-lock.yaml
1120
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue
Block a user