导入CSV文件

This commit is contained in:
柳清爽
2025-04-08 16:01:59 +08:00
parent dbc010a294
commit cccff5befb
106 changed files with 187604 additions and 319 deletions

21
node_modules/sonner/LICENSE.md generated vendored Normal file
View File

@@ -0,0 +1,21 @@
MIT License
Copyright (c) 2023 Emil Kowalski
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

33
node_modules/sonner/README.md generated vendored Normal file
View File

@@ -0,0 +1,33 @@
https://github.com/vallezw/sonner/assets/50796600/59b95cb7-9068-4f3e-8469-0b35d9de5cf0
[Sonner](https://sonner.emilkowal.ski/) is an opinionated toast component for React. You can read more about why and how it was built [here](https://emilkowal.ski/ui/building-a-toast-component).
## Usage
To start using the library, install it in your project:
```bash
npm install sonner
```
Add `<Toaster />` to your app, it will be the place where all your toasts will be rendered.
After that you can use `toast()` from anywhere in your app.
```jsx
import { Toaster, toast } from 'sonner';
// ...
function App() {
return (
<div>
<Toaster />
<button onClick={() => toast('My first toast')}>Give me a toast</button>
</div>
);
}
```
## Documentation
Find the full API reference in the [documentation](https://sonner.emilkowal.ski/getting-started).

151
node_modules/sonner/dist/index.d.mts generated vendored Normal file
View File

@@ -0,0 +1,151 @@
import React from 'react';
type ToastTypes = 'normal' | 'action' | 'success' | 'info' | 'warning' | 'error' | 'loading' | 'default';
type PromiseT<Data = any> = Promise<Data> | (() => Promise<Data>);
interface PromiseIExtendedResult extends ExternalToast {
message: React.ReactNode;
}
type PromiseTExtendedResult<Data = any> = PromiseIExtendedResult | ((data: Data) => PromiseIExtendedResult | Promise<PromiseIExtendedResult>);
type PromiseTResult<Data = any> = string | React.ReactNode | ((data: Data) => React.ReactNode | string | Promise<React.ReactNode | string>);
type PromiseExternalToast = Omit<ExternalToast, 'description'>;
type PromiseData<ToastData = any> = PromiseExternalToast & {
loading?: string | React.ReactNode;
success?: PromiseTResult<ToastData> | PromiseTExtendedResult<ToastData>;
error?: PromiseTResult | PromiseTExtendedResult;
description?: PromiseTResult;
finally?: () => void | Promise<void>;
};
interface ToastClassnames {
toast?: string;
title?: string;
description?: string;
loader?: string;
closeButton?: string;
cancelButton?: string;
actionButton?: string;
success?: string;
error?: string;
info?: string;
warning?: string;
loading?: string;
default?: string;
content?: string;
icon?: string;
}
interface ToastIcons {
success?: React.ReactNode;
info?: React.ReactNode;
warning?: React.ReactNode;
error?: React.ReactNode;
loading?: React.ReactNode;
close?: React.ReactNode;
}
interface Action {
label: React.ReactNode;
onClick: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
actionButtonStyle?: React.CSSProperties;
}
interface ToastT {
id: number | string;
title?: (() => React.ReactNode) | React.ReactNode;
type?: ToastTypes;
icon?: React.ReactNode;
jsx?: React.ReactNode;
richColors?: boolean;
invert?: boolean;
closeButton?: boolean;
dismissible?: boolean;
description?: (() => React.ReactNode) | React.ReactNode;
duration?: number;
delete?: boolean;
action?: Action | React.ReactNode;
cancel?: Action | React.ReactNode;
onDismiss?: (toast: ToastT) => void;
onAutoClose?: (toast: ToastT) => void;
promise?: PromiseT;
cancelButtonStyle?: React.CSSProperties;
actionButtonStyle?: React.CSSProperties;
style?: React.CSSProperties;
unstyled?: boolean;
className?: string;
classNames?: ToastClassnames;
descriptionClassName?: string;
position?: Position;
}
type Position = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'top-center' | 'bottom-center';
interface ToastOptions {
className?: string;
closeButton?: boolean;
descriptionClassName?: string;
style?: React.CSSProperties;
cancelButtonStyle?: React.CSSProperties;
actionButtonStyle?: React.CSSProperties;
duration?: number;
unstyled?: boolean;
classNames?: ToastClassnames;
closeButtonAriaLabel?: string;
}
type Offset = {
top?: string | number;
right?: string | number;
bottom?: string | number;
left?: string | number;
} | string | number;
interface ToasterProps {
invert?: boolean;
theme?: 'light' | 'dark' | 'system';
position?: Position;
hotkey?: string[];
richColors?: boolean;
expand?: boolean;
duration?: number;
gap?: number;
visibleToasts?: number;
closeButton?: boolean;
toastOptions?: ToastOptions;
className?: string;
style?: React.CSSProperties;
offset?: Offset;
mobileOffset?: Offset;
dir?: 'rtl' | 'ltr' | 'auto';
swipeDirections?: SwipeDirection[];
icons?: ToastIcons;
containerAriaLabel?: string;
}
type SwipeDirection = 'top' | 'right' | 'bottom' | 'left';
interface ToastToDismiss {
id: number | string;
dismiss: boolean;
}
type ExternalToast = Omit<ToastT, 'id' | 'type' | 'title' | 'jsx' | 'delete' | 'promise'> & {
id?: number | string;
};
type titleT = (() => React.ReactNode) | React.ReactNode;
declare const toast: ((message: titleT, data?: ExternalToast) => string | number) & {
success: (message: titleT | React.ReactNode, data?: ExternalToast) => string | number;
info: (message: titleT | React.ReactNode, data?: ExternalToast) => string | number;
warning: (message: titleT | React.ReactNode, data?: ExternalToast) => string | number;
error: (message: titleT | React.ReactNode, data?: ExternalToast) => string | number;
custom: (jsx: (id: number | string) => React.ReactElement, data?: ExternalToast) => string | number;
message: (message: titleT | React.ReactNode, data?: ExternalToast) => string | number;
promise: <ToastData>(promise: PromiseT<ToastData>, data?: PromiseData<ToastData>) => (string & {
unwrap: () => Promise<ToastData>;
}) | (number & {
unwrap: () => Promise<ToastData>;
}) | {
unwrap: () => Promise<ToastData>;
};
dismiss: (id?: number | string) => string | number;
loading: (message: titleT | React.ReactNode, data?: ExternalToast) => string | number;
} & {
getHistory: () => (ToastT | ToastToDismiss)[];
getToasts: () => (ToastT | ToastToDismiss)[];
};
declare function useSonner(): {
toasts: ToastT[];
};
declare const Toaster: React.ForwardRefExoticComponent<ToasterProps & React.RefAttributes<HTMLElement>>;
export { type Action, type ExternalToast, type ToastClassnames, type ToastT, type ToastToDismiss, Toaster, type ToasterProps, toast, useSonner };

151
node_modules/sonner/dist/index.d.ts generated vendored Normal file
View File

@@ -0,0 +1,151 @@
import React from 'react';
type ToastTypes = 'normal' | 'action' | 'success' | 'info' | 'warning' | 'error' | 'loading' | 'default';
type PromiseT<Data = any> = Promise<Data> | (() => Promise<Data>);
interface PromiseIExtendedResult extends ExternalToast {
message: React.ReactNode;
}
type PromiseTExtendedResult<Data = any> = PromiseIExtendedResult | ((data: Data) => PromiseIExtendedResult | Promise<PromiseIExtendedResult>);
type PromiseTResult<Data = any> = string | React.ReactNode | ((data: Data) => React.ReactNode | string | Promise<React.ReactNode | string>);
type PromiseExternalToast = Omit<ExternalToast, 'description'>;
type PromiseData<ToastData = any> = PromiseExternalToast & {
loading?: string | React.ReactNode;
success?: PromiseTResult<ToastData> | PromiseTExtendedResult<ToastData>;
error?: PromiseTResult | PromiseTExtendedResult;
description?: PromiseTResult;
finally?: () => void | Promise<void>;
};
interface ToastClassnames {
toast?: string;
title?: string;
description?: string;
loader?: string;
closeButton?: string;
cancelButton?: string;
actionButton?: string;
success?: string;
error?: string;
info?: string;
warning?: string;
loading?: string;
default?: string;
content?: string;
icon?: string;
}
interface ToastIcons {
success?: React.ReactNode;
info?: React.ReactNode;
warning?: React.ReactNode;
error?: React.ReactNode;
loading?: React.ReactNode;
close?: React.ReactNode;
}
interface Action {
label: React.ReactNode;
onClick: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
actionButtonStyle?: React.CSSProperties;
}
interface ToastT {
id: number | string;
title?: (() => React.ReactNode) | React.ReactNode;
type?: ToastTypes;
icon?: React.ReactNode;
jsx?: React.ReactNode;
richColors?: boolean;
invert?: boolean;
closeButton?: boolean;
dismissible?: boolean;
description?: (() => React.ReactNode) | React.ReactNode;
duration?: number;
delete?: boolean;
action?: Action | React.ReactNode;
cancel?: Action | React.ReactNode;
onDismiss?: (toast: ToastT) => void;
onAutoClose?: (toast: ToastT) => void;
promise?: PromiseT;
cancelButtonStyle?: React.CSSProperties;
actionButtonStyle?: React.CSSProperties;
style?: React.CSSProperties;
unstyled?: boolean;
className?: string;
classNames?: ToastClassnames;
descriptionClassName?: string;
position?: Position;
}
type Position = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'top-center' | 'bottom-center';
interface ToastOptions {
className?: string;
closeButton?: boolean;
descriptionClassName?: string;
style?: React.CSSProperties;
cancelButtonStyle?: React.CSSProperties;
actionButtonStyle?: React.CSSProperties;
duration?: number;
unstyled?: boolean;
classNames?: ToastClassnames;
closeButtonAriaLabel?: string;
}
type Offset = {
top?: string | number;
right?: string | number;
bottom?: string | number;
left?: string | number;
} | string | number;
interface ToasterProps {
invert?: boolean;
theme?: 'light' | 'dark' | 'system';
position?: Position;
hotkey?: string[];
richColors?: boolean;
expand?: boolean;
duration?: number;
gap?: number;
visibleToasts?: number;
closeButton?: boolean;
toastOptions?: ToastOptions;
className?: string;
style?: React.CSSProperties;
offset?: Offset;
mobileOffset?: Offset;
dir?: 'rtl' | 'ltr' | 'auto';
swipeDirections?: SwipeDirection[];
icons?: ToastIcons;
containerAriaLabel?: string;
}
type SwipeDirection = 'top' | 'right' | 'bottom' | 'left';
interface ToastToDismiss {
id: number | string;
dismiss: boolean;
}
type ExternalToast = Omit<ToastT, 'id' | 'type' | 'title' | 'jsx' | 'delete' | 'promise'> & {
id?: number | string;
};
type titleT = (() => React.ReactNode) | React.ReactNode;
declare const toast: ((message: titleT, data?: ExternalToast) => string | number) & {
success: (message: titleT | React.ReactNode, data?: ExternalToast) => string | number;
info: (message: titleT | React.ReactNode, data?: ExternalToast) => string | number;
warning: (message: titleT | React.ReactNode, data?: ExternalToast) => string | number;
error: (message: titleT | React.ReactNode, data?: ExternalToast) => string | number;
custom: (jsx: (id: number | string) => React.ReactElement, data?: ExternalToast) => string | number;
message: (message: titleT | React.ReactNode, data?: ExternalToast) => string | number;
promise: <ToastData>(promise: PromiseT<ToastData>, data?: PromiseData<ToastData>) => (string & {
unwrap: () => Promise<ToastData>;
}) | (number & {
unwrap: () => Promise<ToastData>;
}) | {
unwrap: () => Promise<ToastData>;
};
dismiss: (id?: number | string) => string | number;
loading: (message: titleT | React.ReactNode, data?: ExternalToast) => string | number;
} & {
getHistory: () => (ToastT | ToastToDismiss)[];
getToasts: () => (ToastT | ToastToDismiss)[];
};
declare function useSonner(): {
toasts: ToastT[];
};
declare const Toaster: React.ForwardRefExoticComponent<ToasterProps & React.RefAttributes<HTMLElement>>;
export { type Action, type ExternalToast, type ToastClassnames, type ToastT, type ToastToDismiss, Toaster, type ToasterProps, toast, useSonner };

1172
node_modules/sonner/dist/index.js generated vendored Normal file

File diff suppressed because one or more lines are too long

1163
node_modules/sonner/dist/index.mjs generated vendored Normal file

File diff suppressed because one or more lines are too long

728
node_modules/sonner/dist/styles.css generated vendored Normal file
View File

@@ -0,0 +1,728 @@
html[dir='ltr'],
[data-sonner-toaster][dir='ltr'] {
--toast-icon-margin-start: -3px;
--toast-icon-margin-end: 4px;
--toast-svg-margin-start: -1px;
--toast-svg-margin-end: 0px;
--toast-button-margin-start: auto;
--toast-button-margin-end: 0;
--toast-close-button-start: 0;
--toast-close-button-end: unset;
--toast-close-button-transform: translate(-35%, -35%);
}
html[dir='rtl'],
[data-sonner-toaster][dir='rtl'] {
--toast-icon-margin-start: 4px;
--toast-icon-margin-end: -3px;
--toast-svg-margin-start: 0px;
--toast-svg-margin-end: -1px;
--toast-button-margin-start: 0;
--toast-button-margin-end: auto;
--toast-close-button-start: unset;
--toast-close-button-end: 0;
--toast-close-button-transform: translate(35%, -35%);
}
[data-sonner-toaster] {
position: fixed;
width: var(--width);
font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial,
Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
--gray1: hsl(0, 0%, 99%);
--gray2: hsl(0, 0%, 97.3%);
--gray3: hsl(0, 0%, 95.1%);
--gray4: hsl(0, 0%, 93%);
--gray5: hsl(0, 0%, 90.9%);
--gray6: hsl(0, 0%, 88.7%);
--gray7: hsl(0, 0%, 85.8%);
--gray8: hsl(0, 0%, 78%);
--gray9: hsl(0, 0%, 56.1%);
--gray10: hsl(0, 0%, 52.3%);
--gray11: hsl(0, 0%, 43.5%);
--gray12: hsl(0, 0%, 9%);
--border-radius: 8px;
box-sizing: border-box;
padding: 0;
margin: 0;
list-style: none;
outline: none;
z-index: 999999999;
transition: transform 400ms ease;
}
[data-sonner-toaster][data-lifted='true'] {
transform: translateY(-8px);
}
@media (hover: none) and (pointer: coarse) {
[data-sonner-toaster][data-lifted='true'] {
transform: none;
}
}
[data-sonner-toaster][data-x-position='right'] {
right: var(--offset-right);
}
[data-sonner-toaster][data-x-position='left'] {
left: var(--offset-left);
}
[data-sonner-toaster][data-x-position='center'] {
left: 50%;
transform: translateX(-50%);
}
[data-sonner-toaster][data-y-position='top'] {
top: var(--offset-top);
}
[data-sonner-toaster][data-y-position='bottom'] {
bottom: var(--offset-bottom);
}
[data-sonner-toast] {
--y: translateY(100%);
--lift-amount: calc(var(--lift) * var(--gap));
z-index: var(--z-index);
position: absolute;
opacity: 0;
transform: var(--y);
touch-action: none;
transition: transform 400ms, opacity 400ms, height 400ms, box-shadow 200ms;
box-sizing: border-box;
outline: none;
overflow-wrap: anywhere;
}
[data-sonner-toast][data-styled='true'] {
padding: 16px;
background: var(--normal-bg);
border: 1px solid var(--normal-border);
color: var(--normal-text);
border-radius: var(--border-radius);
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
width: var(--width);
font-size: 13px;
display: flex;
align-items: center;
gap: 6px;
}
[data-sonner-toast]:focus-visible {
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1), 0 0 0 2px rgba(0, 0, 0, 0.2);
}
[data-sonner-toast][data-y-position='top'] {
top: 0;
--y: translateY(-100%);
--lift: 1;
--lift-amount: calc(1 * var(--gap));
}
[data-sonner-toast][data-y-position='bottom'] {
bottom: 0;
--y: translateY(100%);
--lift: -1;
--lift-amount: calc(var(--lift) * var(--gap));
}
[data-sonner-toast][data-styled='true'] [data-description] {
font-weight: 400;
line-height: 1.4;
color: #3f3f3f;
}
[data-rich-colors='true'][data-sonner-toast][data-styled='true'] [data-description] {
color: inherit;
}
[data-sonner-toaster][data-sonner-theme='dark'] [data-description] {
color: hsl(0, 0%, 91%);
}
[data-sonner-toast][data-styled='true'] [data-title] {
font-weight: 500;
line-height: 1.5;
color: inherit;
}
[data-sonner-toast][data-styled='true'] [data-icon] {
display: flex;
height: 16px;
width: 16px;
position: relative;
justify-content: flex-start;
align-items: center;
flex-shrink: 0;
margin-left: var(--toast-icon-margin-start);
margin-right: var(--toast-icon-margin-end);
}
[data-sonner-toast][data-promise='true'] [data-icon] > svg {
opacity: 0;
transform: scale(0.8);
transform-origin: center;
animation: sonner-fade-in 300ms ease forwards;
}
[data-sonner-toast][data-styled='true'] [data-icon] > * {
flex-shrink: 0;
}
[data-sonner-toast][data-styled='true'] [data-icon] svg {
margin-left: var(--toast-svg-margin-start);
margin-right: var(--toast-svg-margin-end);
}
[data-sonner-toast][data-styled='true'] [data-content] {
display: flex;
flex-direction: column;
gap: 2px;
}
[data-sonner-toast][data-styled='true'] [data-button] {
border-radius: 4px;
padding-left: 8px;
padding-right: 8px;
height: 24px;
font-size: 12px;
color: var(--normal-bg);
background: var(--normal-text);
margin-left: var(--toast-button-margin-start);
margin-right: var(--toast-button-margin-end);
border: none;
font-weight: 500;
cursor: pointer;
outline: none;
display: flex;
align-items: center;
flex-shrink: 0;
transition: opacity 400ms, box-shadow 200ms;
}
[data-sonner-toast][data-styled='true'] [data-button]:focus-visible {
box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.4);
}
[data-sonner-toast][data-styled='true'] [data-button]:first-of-type {
margin-left: var(--toast-button-margin-start);
margin-right: var(--toast-button-margin-end);
}
[data-sonner-toast][data-styled='true'] [data-cancel] {
color: var(--normal-text);
background: rgba(0, 0, 0, 0.08);
}
[data-sonner-toaster][data-sonner-theme='dark'] [data-sonner-toast][data-styled='true'] [data-cancel] {
background: rgba(255, 255, 255, 0.3);
}
[data-sonner-toast][data-styled='true'] [data-close-button] {
position: absolute;
left: var(--toast-close-button-start);
right: var(--toast-close-button-end);
top: 0;
height: 20px;
width: 20px;
display: flex;
justify-content: center;
align-items: center;
padding: 0;
color: var(--gray12);
background: var(--normal-bg);
border: 1px solid var(--gray4);
transform: var(--toast-close-button-transform);
border-radius: 50%;
cursor: pointer;
z-index: 1;
transition: opacity 100ms, background 200ms, border-color 200ms;
}
[data-sonner-toast][data-styled='true'] [data-close-button]:focus-visible {
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1), 0 0 0 2px rgba(0, 0, 0, 0.2);
}
[data-sonner-toast][data-styled='true'] [data-disabled='true'] {
cursor: not-allowed;
}
[data-sonner-toast][data-styled='true']:hover [data-close-button]:hover {
background: var(--gray2);
border-color: var(--gray5);
}
[data-sonner-toast][data-swiping='true']::before {
content: '';
position: absolute;
left: -100%;
right: -100%;
height: 100%;
z-index: -1;
}
[data-sonner-toast][data-y-position='top'][data-swiping='true']::before {
bottom: 50%;
transform: scaleY(3) translateY(50%);
}
[data-sonner-toast][data-y-position='bottom'][data-swiping='true']::before {
top: 50%;
transform: scaleY(3) translateY(-50%);
}
[data-sonner-toast][data-swiping='false'][data-removed='true']::before {
content: '';
position: absolute;
inset: 0;
transform: scaleY(2);
}
[data-sonner-toast][data-expanded='true']::after {
content: '';
position: absolute;
left: 0;
height: calc(var(--gap) + 1px);
bottom: 100%;
width: 100%;
}
[data-sonner-toast][data-mounted='true'] {
--y: translateY(0);
opacity: 1;
}
[data-sonner-toast][data-expanded='false'][data-front='false'] {
--scale: var(--toasts-before) * 0.05 + 1;
--y: translateY(calc(var(--lift-amount) * var(--toasts-before))) scale(calc(-1 * var(--scale)));
height: var(--front-toast-height);
}
[data-sonner-toast] > * {
transition: opacity 400ms;
}
[data-sonner-toast][data-x-position='right'] {
right: 0;
}
[data-sonner-toast][data-x-position='left'] {
left: 0;
}
[data-sonner-toast][data-expanded='false'][data-front='false'][data-styled='true'] > * {
opacity: 0;
}
[data-sonner-toast][data-visible='false'] {
opacity: 0;
pointer-events: none;
}
[data-sonner-toast][data-mounted='true'][data-expanded='true'] {
--y: translateY(calc(var(--lift) * var(--offset)));
height: var(--initial-height);
}
[data-sonner-toast][data-removed='true'][data-front='true'][data-swipe-out='false'] {
--y: translateY(calc(var(--lift) * -100%));
opacity: 0;
}
[data-sonner-toast][data-removed='true'][data-front='false'][data-swipe-out='false'][data-expanded='true'] {
--y: translateY(calc(var(--lift) * var(--offset) + var(--lift) * -100%));
opacity: 0;
}
[data-sonner-toast][data-removed='true'][data-front='false'][data-swipe-out='false'][data-expanded='false'] {
--y: translateY(40%);
opacity: 0;
transition: transform 500ms, opacity 200ms;
}
[data-sonner-toast][data-removed='true'][data-front='false']::before {
height: calc(var(--initial-height) + 20%);
}
[data-sonner-toast][data-swiping='true'] {
transform: var(--y) translateY(var(--swipe-amount-y, 0px)) translateX(var(--swipe-amount-x, 0px));
transition: none;
}
[data-sonner-toast][data-swiped='true'] {
user-select: none;
}
[data-sonner-toast][data-swipe-out='true'][data-y-position='bottom'],
[data-sonner-toast][data-swipe-out='true'][data-y-position='top'] {
animation-duration: 200ms;
animation-timing-function: ease-out;
animation-fill-mode: forwards;
}
[data-sonner-toast][data-swipe-out='true'][data-swipe-direction='left'] {
animation-name: swipe-out-left;
}
[data-sonner-toast][data-swipe-out='true'][data-swipe-direction='right'] {
animation-name: swipe-out-right;
}
[data-sonner-toast][data-swipe-out='true'][data-swipe-direction='up'] {
animation-name: swipe-out-up;
}
[data-sonner-toast][data-swipe-out='true'][data-swipe-direction='down'] {
animation-name: swipe-out-down;
}
@keyframes swipe-out-left {
from {
transform: var(--y) translateX(var(--swipe-amount-x));
opacity: 1;
}
to {
transform: var(--y) translateX(calc(var(--swipe-amount-x) - 100%));
opacity: 0;
}
}
@keyframes swipe-out-right {
from {
transform: var(--y) translateX(var(--swipe-amount-x));
opacity: 1;
}
to {
transform: var(--y) translateX(calc(var(--swipe-amount-x) + 100%));
opacity: 0;
}
}
@keyframes swipe-out-up {
from {
transform: var(--y) translateY(var(--swipe-amount-y));
opacity: 1;
}
to {
transform: var(--y) translateY(calc(var(--swipe-amount-y) - 100%));
opacity: 0;
}
}
@keyframes swipe-out-down {
from {
transform: var(--y) translateY(var(--swipe-amount-y));
opacity: 1;
}
to {
transform: var(--y) translateY(calc(var(--swipe-amount-y) + 100%));
opacity: 0;
}
}
@media (max-width: 600px) {
[data-sonner-toaster] {
position: fixed;
right: var(--mobile-offset-right);
left: var(--mobile-offset-left);
width: 100%;
}
[data-sonner-toaster][dir='rtl'] {
left: calc(var(--mobile-offset-left) * -1);
}
[data-sonner-toaster] [data-sonner-toast] {
left: 0;
right: 0;
width: calc(100% - var(--mobile-offset-left) * 2);
}
[data-sonner-toaster][data-x-position='left'] {
left: var(--mobile-offset-left);
}
[data-sonner-toaster][data-y-position='bottom'] {
bottom: var(--mobile-offset-bottom);
}
[data-sonner-toaster][data-y-position='top'] {
top: var(--mobile-offset-top);
}
[data-sonner-toaster][data-x-position='center'] {
left: var(--mobile-offset-left);
right: var(--mobile-offset-right);
transform: none;
}
}
[data-sonner-toaster][data-sonner-theme='light'] {
--normal-bg: #fff;
--normal-border: var(--gray4);
--normal-text: var(--gray12);
--success-bg: hsl(143, 85%, 96%);
--success-border: hsl(145, 92%, 87%);
--success-text: hsl(140, 100%, 27%);
--info-bg: hsl(208, 100%, 97%);
--info-border: hsl(221, 91%, 93%);
--info-text: hsl(210, 92%, 45%);
--warning-bg: hsl(49, 100%, 97%);
--warning-border: hsl(49, 91%, 84%);
--warning-text: hsl(31, 92%, 45%);
--error-bg: hsl(359, 100%, 97%);
--error-border: hsl(359, 100%, 94%);
--error-text: hsl(360, 100%, 45%);
}
[data-sonner-toaster][data-sonner-theme='light'] [data-sonner-toast][data-invert='true'] {
--normal-bg: #000;
--normal-border: hsl(0, 0%, 20%);
--normal-text: var(--gray1);
}
[data-sonner-toaster][data-sonner-theme='dark'] [data-sonner-toast][data-invert='true'] {
--normal-bg: #fff;
--normal-border: var(--gray3);
--normal-text: var(--gray12);
}
[data-sonner-toaster][data-sonner-theme='dark'] {
--normal-bg: #000;
--normal-bg-hover: hsl(0, 0%, 12%);
--normal-border: hsl(0, 0%, 20%);
--normal-border-hover: hsl(0, 0%, 25%);
--normal-text: var(--gray1);
--success-bg: hsl(150, 100%, 6%);
--success-border: hsl(147, 100%, 12%);
--success-text: hsl(150, 86%, 65%);
--info-bg: hsl(215, 100%, 6%);
--info-border: hsl(223, 43%, 17%);
--info-text: hsl(216, 87%, 65%);
--warning-bg: hsl(64, 100%, 6%);
--warning-border: hsl(60, 100%, 9%);
--warning-text: hsl(46, 87%, 65%);
--error-bg: hsl(358, 76%, 10%);
--error-border: hsl(357, 89%, 16%);
--error-text: hsl(358, 100%, 81%);
}
[data-sonner-toaster][data-sonner-theme='dark'] [data-sonner-toast] [data-close-button] {
background: var(--normal-bg);
border-color: var(--normal-border);
color: var(--normal-text);
}
[data-sonner-toaster][data-sonner-theme='dark'] [data-sonner-toast] [data-close-button]:hover {
background: var(--normal-bg-hover);
border-color: var(--normal-border-hover);
}
[data-rich-colors='true'][data-sonner-toast][data-type='success'] {
background: var(--success-bg);
border-color: var(--success-border);
color: var(--success-text);
}
[data-rich-colors='true'][data-sonner-toast][data-type='success'] [data-close-button] {
background: var(--success-bg);
border-color: var(--success-border);
color: var(--success-text);
}
[data-rich-colors='true'][data-sonner-toast][data-type='info'] {
background: var(--info-bg);
border-color: var(--info-border);
color: var(--info-text);
}
[data-rich-colors='true'][data-sonner-toast][data-type='info'] [data-close-button] {
background: var(--info-bg);
border-color: var(--info-border);
color: var(--info-text);
}
[data-rich-colors='true'][data-sonner-toast][data-type='warning'] {
background: var(--warning-bg);
border-color: var(--warning-border);
color: var(--warning-text);
}
[data-rich-colors='true'][data-sonner-toast][data-type='warning'] [data-close-button] {
background: var(--warning-bg);
border-color: var(--warning-border);
color: var(--warning-text);
}
[data-rich-colors='true'][data-sonner-toast][data-type='error'] {
background: var(--error-bg);
border-color: var(--error-border);
color: var(--error-text);
}
[data-rich-colors='true'][data-sonner-toast][data-type='error'] [data-close-button] {
background: var(--error-bg);
border-color: var(--error-border);
color: var(--error-text);
}
.sonner-loading-wrapper {
--size: 16px;
height: var(--size);
width: var(--size);
position: absolute;
inset: 0;
z-index: 10;
}
.sonner-loading-wrapper[data-visible='false'] {
transform-origin: center;
animation: sonner-fade-out 0.2s ease forwards;
}
.sonner-spinner {
position: relative;
top: 50%;
left: 50%;
height: var(--size);
width: var(--size);
}
.sonner-loading-bar {
animation: sonner-spin 1.2s linear infinite;
background: var(--gray11);
border-radius: 6px;
height: 8%;
left: -10%;
position: absolute;
top: -3.9%;
width: 24%;
}
.sonner-loading-bar:nth-child(1) {
animation-delay: -1.2s;
transform: rotate(0.0001deg) translate(146%);
}
.sonner-loading-bar:nth-child(2) {
animation-delay: -1.1s;
transform: rotate(30deg) translate(146%);
}
.sonner-loading-bar:nth-child(3) {
animation-delay: -1s;
transform: rotate(60deg) translate(146%);
}
.sonner-loading-bar:nth-child(4) {
animation-delay: -0.9s;
transform: rotate(90deg) translate(146%);
}
.sonner-loading-bar:nth-child(5) {
animation-delay: -0.8s;
transform: rotate(120deg) translate(146%);
}
.sonner-loading-bar:nth-child(6) {
animation-delay: -0.7s;
transform: rotate(150deg) translate(146%);
}
.sonner-loading-bar:nth-child(7) {
animation-delay: -0.6s;
transform: rotate(180deg) translate(146%);
}
.sonner-loading-bar:nth-child(8) {
animation-delay: -0.5s;
transform: rotate(210deg) translate(146%);
}
.sonner-loading-bar:nth-child(9) {
animation-delay: -0.4s;
transform: rotate(240deg) translate(146%);
}
.sonner-loading-bar:nth-child(10) {
animation-delay: -0.3s;
transform: rotate(270deg) translate(146%);
}
.sonner-loading-bar:nth-child(11) {
animation-delay: -0.2s;
transform: rotate(300deg) translate(146%);
}
.sonner-loading-bar:nth-child(12) {
animation-delay: -0.1s;
transform: rotate(330deg) translate(146%);
}
@keyframes sonner-fade-in {
0% {
opacity: 0;
transform: scale(0.8);
}
100% {
opacity: 1;
transform: scale(1);
}
}
@keyframes sonner-fade-out {
0% {
opacity: 1;
transform: scale(1);
}
100% {
opacity: 0;
transform: scale(0.8);
}
}
@keyframes sonner-spin {
0% {
opacity: 1;
}
100% {
opacity: 0.15;
}
}
@media (prefers-reduced-motion) {
[data-sonner-toast],
[data-sonner-toast] > *,
.sonner-loading-bar {
transition: none !important;
animation: none !important;
}
}
.sonner-loader {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
transform-origin: center;
transition: opacity 200ms, transform 200ms;
}
.sonner-loader[data-visible='false'] {
opacity: 0;
transform: scale(0.8) translate(-50%, -50%);
}

66
node_modules/sonner/package.json generated vendored Normal file
View File

@@ -0,0 +1,66 @@
{
"name": "sonner",
"version": "2.0.3",
"description": "An opinionated toast component for React.",
"exports": {
".": {
"import": {
"types": "./dist/index.d.mts",
"default": "./dist/index.mjs"
},
"require": {
"types": "./dist/index.d.ts",
"default": "./dist/index.js"
},
"default": "./dist/index.js"
},
"./dist/styles.css": "./dist/styles.css"
},
"main": "./dist/index.js",
"types": "./dist/index.d.ts",
"files": [
"dist"
],
"scripts": {
"dev": "bunchee --watch",
"build": "bunchee && cp src/styles.css dist/styles.css",
"type-check": "tsc --noEmit",
"dev:website": "turbo run dev --filter=website...",
"dev:test": "turbo run dev --filter=test...",
"format": "prettier --write .",
"test": "playwright test"
},
"keywords": [
"react",
"notifications",
"toast",
"snackbar",
"message"
],
"author": "Emil Kowalski <e@emilkowal.ski>",
"license": "MIT",
"homepage": "https://sonner.emilkowal.ski/",
"repository": {
"type": "git",
"url": "git+https://github.com/emilkowalski/sonner.git"
},
"bugs": {
"url": "https://github.com/emilkowalski/sonner/issues"
},
"devDependencies": {
"@playwright/test": "^1.49.1",
"@types/node": "^18.11.13",
"@types/react": "^18.0.26",
"bunchee": "^6.3.3",
"prettier": "^2.8.4",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"turbo": "1.6",
"typescript": "^4.8.4"
},
"peerDependencies": {
"react": "^18.0.0 || ^19.0.0 || ^19.0.0-rc",
"react-dom": "^18.0.0 || ^19.0.0 || ^19.0.0-rc"
},
"packageManager": "pnpm@8.12.1"
}