azeriand-library 1.14.2 → 1.14.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/card/card.d.ts +2 -1
- package/dist/index.esm.js +6 -5
- package/dist/index.esm.js.map +1 -1
- package/dist/index.umd.js +6 -5
- package/dist/index.umd.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +1 -1
|
@@ -5,6 +5,7 @@ export type CardProps<T extends ElementType = 'article'> = {
|
|
|
5
5
|
noPadding?: boolean;
|
|
6
6
|
noBlur?: boolean;
|
|
7
7
|
appearance?: string;
|
|
8
|
+
blur?: number;
|
|
8
9
|
color?: string;
|
|
9
10
|
intensity?: number;
|
|
10
11
|
dark?: boolean;
|
|
@@ -12,4 +13,4 @@ export type CardProps<T extends ElementType = 'article'> = {
|
|
|
12
13
|
className?: string;
|
|
13
14
|
style?: React.CSSProperties;
|
|
14
15
|
} & React.ComponentPropsWithoutRef<T>;
|
|
15
|
-
export declare function Card<T extends ElementType = 'article'>({ as, children, noPadding, noBlur, appearance, color, intensity, dark, onClick, className, style, ...rest }: CardProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export declare function Card<T extends ElementType = 'article'>({ as, children, noPadding, noBlur, appearance, blur, color, intensity, dark, onClick, className, style, ...rest }: CardProps<T>): import("react/jsx-runtime").JSX.Element;
|
package/dist/index.esm.js
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
try {
|
|
4
4
|
if (typeof document != "undefined") {
|
|
5
5
|
var elementStyle = document.createElement("style");
|
|
6
|
-
elementStyle.appendChild(document.createTextNode('.card{\n /* border-radius: 20px; */\n color: var(--card-text-color, white);\n}\n\n.card.glass{\n background-color: color-mix(in oklch, var(--glass-color), transparent 80%);\n
|
|
6
|
+
elementStyle.appendChild(document.createTextNode('.card{\n /* border-radius: 20px; */\n color: var(--card-text-color, white);\n}\n\n.card.glass{\n background-color: color-mix(in oklch, var(--glass-color), transparent 80%);\n -webkit-backface-visibility: hidden;\n -webkit-perspective: 1000;\n -webkit-transform: translate3d(0,0,0);\n -webkit-transform: translateZ(0);\n backface-visibility: hidden;\n perspective: 1000;\n transform: translate3d(0,0,0);\n transform: translateZ(0);\n}\n\n.card.mate{\n background-color: var(--glass-color);\n}\n\n.card.outlined{\n border: 2px solid color-mix(in oklch, var(--glass-color), transparent 40%);\n}\n\nbutton .card.ghost:hover, button .card.outlined:hover{\n background: color-mix(in oklch, var(--glass-color), transparent 80%);\n}\n\nbutton .card.glass:hover{\n box-shadow: 0 4px 10px color-mix(in oklch, var(--glass-color), transparent 85%);\n}\n\nbutton .card.mate:hover{\n background-color: color-mix(in oklch, var(--glass-color), white 10%) \n}\nbutton{\n background: none;\n color: inherit;\n border: none;\n padding: 0;\n font: inherit;\n cursor: pointer;\n outline: inherit;\n font-weight: bold;\n}\n\nbutton:focus {\n outline: revert;\n}\n.section-name{\n color: hsla(0, 0%, 100%, 0.7);\n}input:disabled{\n color: hsla(0, 0%, 100%, 0.5);\n font-weight: bold;\n}\n\ninput::-moz-placeholder{\n color: hsla(0, 0%, 100%, 0.5);\n \n}\n\ninput::placeholder{\n color: hsla(0, 0%, 100%, 0.5);\n \n}\n\ninput::-webkit-outer-spin-button,\ninput::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\n\ninput:focus{\n outline: none;\n}.MuiDateCalendar-root{\n color: white;\n}.dropdown-content{\n box-shadow: rgba(149, 157, 165, 0.2)\n 0px 8px 24px;\n max-height: 40%vh;\n scrollbar-width: none;\n -ms-overflow-style: none;\n z-index: 10;\n}\n\n.dropdown-content::-webkit-scrollbar{\n width: 0;\n height: 0;\n}\n\n.dropdown-item:hover{\n background-color: rgb(240, 249, 255);\n}.button-open{\n border: rgb(147, 197, 253) 2px solid;\n border-radius: 7px;\n}.vertical-line::before {\n content: "";\n position: absolute;\n width: 1.5px;\n height: 100%;\n background-color: white;\n left: 0;\n top: 0;\n transform: translateX(5.1px);\n}'));
|
|
7
7
|
document.head.appendChild(elementStyle);
|
|
8
8
|
}
|
|
9
9
|
} catch (e) {
|
|
@@ -15751,6 +15751,7 @@ function Card({
|
|
|
15751
15751
|
noPadding,
|
|
15752
15752
|
noBlur = false,
|
|
15753
15753
|
appearance = "glass",
|
|
15754
|
+
blur = 10,
|
|
15754
15755
|
color: color2 = "neutral",
|
|
15755
15756
|
intensity,
|
|
15756
15757
|
dark: dark2 = true,
|
|
@@ -15771,7 +15772,7 @@ function Card({
|
|
|
15771
15772
|
setCardStyle({
|
|
15772
15773
|
"--glass-color": `var(--color-${color2}-${intensityValue})`,
|
|
15773
15774
|
"--card-text-color": `var(--color-${color2}-${dark2 ? "100" : "800"})`,
|
|
15774
|
-
backdropFilter: appearance === "glass" && !noBlur ?
|
|
15775
|
+
backdropFilter: appearance === "glass" && !noBlur ? `blur(${blur}px)` : void 0,
|
|
15775
15776
|
...style2
|
|
15776
15777
|
});
|
|
15777
15778
|
let rounded = "rounded-md";
|
|
@@ -15787,9 +15788,9 @@ function Card({
|
|
|
15787
15788
|
}
|
|
15788
15789
|
function Button({ children, label, icon, position: position2 = "left", onClick, size, className, ...cardProps }) {
|
|
15789
15790
|
let defaultCardClassNames = "flex justify-center items-center gap-x-[0.40rem] box-border cursor-pointer w-fit ";
|
|
15790
|
-
let specificCardClassNames = "min-w-[2.5rem] px-
|
|
15791
|
+
let specificCardClassNames = "min-w-[2.5rem] px-4 py-2.5";
|
|
15791
15792
|
if (size === "sm") {
|
|
15792
|
-
specificCardClassNames = "min-w-auto text-xs px-
|
|
15793
|
+
specificCardClassNames = "min-w-auto text-xs px-2.5 py-1.5";
|
|
15793
15794
|
className = `${className}`;
|
|
15794
15795
|
}
|
|
15795
15796
|
if (icon && !label) {
|
|
@@ -16019,7 +16020,7 @@ function Calendar({ selectedDates, ...cardProps }) {
|
|
|
16019
16020
|
mode: "dark"
|
|
16020
16021
|
}
|
|
16021
16022
|
});
|
|
16022
|
-
return /* @__PURE__ */ jsx$1(Card, { appearance: cardProps.appearance ?? "ghost", noPadding: true, ...cardProps, children: /* @__PURE__ */ jsx$1(ThemeProvider, { theme, children: /* @__PURE__ */ jsx$1(
|
|
16023
|
+
return /* @__PURE__ */ jsx$1(Card, { appearance: cardProps.appearance ?? "ghost", noPadding: true, ...cardProps, className: "w-fit px-5 pt-7", children: /* @__PURE__ */ jsx$1(ThemeProvider, { theme, children: /* @__PURE__ */ jsx$1(
|
|
16023
16024
|
DateCalendar,
|
|
16024
16025
|
{
|
|
16025
16026
|
slots: { day: CustomDay },
|