@mohasinac/appkit 3.4.6 → 3.4.8
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/_internal/client/features/layout/SidebarCollapseToggle.js +2 -1
- package/dist/features/admin/components/AdminCouponEditorView.js +2 -2
- package/dist/features/admin/components/AdminSiteSettingsView.js +52 -24
- package/dist/features/auctions/components/AuctionBidsTable.js +2 -2
- package/dist/features/auctions/components/CollapsibleBidHistory.js +2 -2
- package/dist/styles.css +1 -1
- package/dist/tailwind-utilities.css +1 -1
- package/dist/ui/components/Typography.js +69 -8
- package/package.json +1 -1
|
@@ -79,17 +79,78 @@ function shapingClasses(opts) {
|
|
|
79
79
|
}
|
|
80
80
|
return out;
|
|
81
81
|
}
|
|
82
|
-
/**
|
|
83
|
-
|
|
82
|
+
/**
|
|
83
|
+
* Every responsive-prefix x themed-size class fully spelled out as a string
|
|
84
|
+
* literal. Tailwind's content scanner reads this source file as plain text —
|
|
85
|
+
* it does NOT evaluate JS — so building the class name by interpolating the
|
|
86
|
+
* size into an arbitrary-value bracket at runtime leaves the unresolved
|
|
87
|
+
* placeholder text sitting inside what still looks like a bracket-matched
|
|
88
|
+
* candidate to the scanner, which copies it verbatim into the generated CSS
|
|
89
|
+
* and produces an unparsable declaration. Every combination below appears as
|
|
90
|
+
* a complete literal so the scanner only ever sees real, generatable classes.
|
|
91
|
+
*/
|
|
92
|
+
const RESPONSIVE_TEXT_SIZE_CLASS = {
|
|
93
|
+
"sm:": {
|
|
94
|
+
xs: "sm:text-[length:var(--appkit-text-xs)]",
|
|
95
|
+
sm: "sm:text-[length:var(--appkit-text-sm)]",
|
|
96
|
+
base: "sm:text-[length:var(--appkit-text-base)]",
|
|
97
|
+
lg: "sm:text-[length:var(--appkit-text-lg)]",
|
|
98
|
+
xl: "sm:text-[length:var(--appkit-text-xl)]",
|
|
99
|
+
"2xl": "sm:text-[length:var(--appkit-text-2xl)]",
|
|
100
|
+
"3xl": "sm:text-[length:var(--appkit-text-3xl)]",
|
|
101
|
+
"4xl": "sm:text-[length:var(--appkit-text-4xl)]",
|
|
102
|
+
"5xl": "sm:text-[length:var(--appkit-text-5xl)]",
|
|
103
|
+
"6xl": "sm:text-6xl",
|
|
104
|
+
"7xl": "sm:text-7xl",
|
|
105
|
+
"8xl": "sm:text-8xl",
|
|
106
|
+
},
|
|
107
|
+
"md:": {
|
|
108
|
+
xs: "md:text-[length:var(--appkit-text-xs)]",
|
|
109
|
+
sm: "md:text-[length:var(--appkit-text-sm)]",
|
|
110
|
+
base: "md:text-[length:var(--appkit-text-base)]",
|
|
111
|
+
lg: "md:text-[length:var(--appkit-text-lg)]",
|
|
112
|
+
xl: "md:text-[length:var(--appkit-text-xl)]",
|
|
113
|
+
"2xl": "md:text-[length:var(--appkit-text-2xl)]",
|
|
114
|
+
"3xl": "md:text-[length:var(--appkit-text-3xl)]",
|
|
115
|
+
"4xl": "md:text-[length:var(--appkit-text-4xl)]",
|
|
116
|
+
"5xl": "md:text-[length:var(--appkit-text-5xl)]",
|
|
117
|
+
"6xl": "md:text-6xl",
|
|
118
|
+
"7xl": "md:text-7xl",
|
|
119
|
+
"8xl": "md:text-8xl",
|
|
120
|
+
},
|
|
121
|
+
"lg:": {
|
|
122
|
+
xs: "lg:text-[length:var(--appkit-text-xs)]",
|
|
123
|
+
sm: "lg:text-[length:var(--appkit-text-sm)]",
|
|
124
|
+
base: "lg:text-[length:var(--appkit-text-base)]",
|
|
125
|
+
lg: "lg:text-[length:var(--appkit-text-lg)]",
|
|
126
|
+
xl: "lg:text-[length:var(--appkit-text-xl)]",
|
|
127
|
+
"2xl": "lg:text-[length:var(--appkit-text-2xl)]",
|
|
128
|
+
"3xl": "lg:text-[length:var(--appkit-text-3xl)]",
|
|
129
|
+
"4xl": "lg:text-[length:var(--appkit-text-4xl)]",
|
|
130
|
+
"5xl": "lg:text-[length:var(--appkit-text-5xl)]",
|
|
131
|
+
"6xl": "lg:text-6xl",
|
|
132
|
+
"7xl": "lg:text-7xl",
|
|
133
|
+
"8xl": "lg:text-8xl",
|
|
134
|
+
},
|
|
135
|
+
"xl:": {
|
|
136
|
+
xs: "xl:text-[length:var(--appkit-text-xs)]",
|
|
137
|
+
sm: "xl:text-[length:var(--appkit-text-sm)]",
|
|
138
|
+
base: "xl:text-[length:var(--appkit-text-base)]",
|
|
139
|
+
lg: "xl:text-[length:var(--appkit-text-lg)]",
|
|
140
|
+
xl: "xl:text-[length:var(--appkit-text-xl)]",
|
|
141
|
+
"2xl": "xl:text-[length:var(--appkit-text-2xl)]",
|
|
142
|
+
"3xl": "xl:text-[length:var(--appkit-text-3xl)]",
|
|
143
|
+
"4xl": "xl:text-[length:var(--appkit-text-4xl)]",
|
|
144
|
+
"5xl": "xl:text-[length:var(--appkit-text-5xl)]",
|
|
145
|
+
"6xl": "xl:text-6xl",
|
|
146
|
+
"7xl": "xl:text-7xl",
|
|
147
|
+
"8xl": "xl:text-8xl",
|
|
148
|
+
},
|
|
149
|
+
};
|
|
84
150
|
function responsiveSizeClass(prefix, size) {
|
|
85
151
|
if (!size)
|
|
86
152
|
return "";
|
|
87
|
-
|
|
88
|
-
// stay theme-editable at every breakpoint via the CSS var; only the
|
|
89
|
-
// above-scale 6xl/7xl/8xl sizes (no token) fall back to the fixed utility.
|
|
90
|
-
return THEMED_TEXT_SIZES.has(size)
|
|
91
|
-
? `${prefix}text-[length:var(--appkit-text-${size})]`
|
|
92
|
-
: `${prefix}text-${size}`;
|
|
153
|
+
return RESPONSIVE_TEXT_SIZE_CLASS[prefix][size] ?? "";
|
|
93
154
|
}
|
|
94
155
|
export function Heading({ level = 1, variant = "primary", color, size, smSize, mdSize, lgSize, xlSize, weight, transform, truncate, numeric, italic, family, align, gradient, shadow, textShadow, className = "", children, ...props }) {
|
|
95
156
|
const Tag = `h${level}`;
|