@andrilla/mado-ui 1.0.4 → 1.0.6

package/dist/css/theme.css

@@ -0,0 +1,66 @@
+@theme {
+	--animate-fade-in: fade-in var(--tw-animation-duration, 0.2s)
+		var(--tw-animation-timing-function, cubic-bezier(0.25, 0.5, 0, 0.99))
+		var(--tw-animation-fill-mode, forwards);
+
+	@keyframes fade-in {
+		from {
+			opacity: 0;
+		}
+		to {
+			opacity: 1;
+		}
+	}
+
+	--animate-wave: wave var(--tw-animation-duration, 3s)
+		var(--tw-animation-timing-function, ease-in-out)
+		var(--tw-animation-iteration-count, infinite);
+
+	@keyframes wave {
+		0%,
+		15%,
+		85%,
+		100% {
+			transform: translateY(0);
+		}
+		35% {
+			transform: translateY(-3px);
+		}
+		65% {
+			transform: translateY(3px);
+		}
+	}
+
+	--animation-direction-normal: normal;
+	--animation-direction-reverse: reverse;
+	--animation-direction-alternate: alternate;
+	--animation-direction-alternate-reverse: alternate-reverse;
+
+	--animation-fill-none: none;
+	--animation-fill-forwards: forwards;
+	--animation-fill-backwards: backwards;
+	--animation-fill-both: both;
+
+	--animation-iteration-infinite: infinite;
+
+	--animation-range-start-contain: contain;
+	--animation-range-start-cover: cover;
+	--animation-range-start-normal: normal;
+
+	--animation-state-paused: paused;
+	--animation-state-running: running;
+
+	--corner-shape-bevel: bevel;
+	--corner-shape-notch: notch;
+	--corner-shape-round: round;
+	--corner-shape-scoop: scoop;
+	--corner-shape-square: square;
+	--corner-shape-squircle: squircle;
+	--corner-shape-infinity: superellipse(infinity);
+
+	--ease-exponential: cubic-bezier(0.25, 0.5, 0, 0.99);
+	--ease-spring: cubic-bezier(0.35, 1.67, 0.44, 0.78);
+
+	--text-smaller: smaller;
+	--text-larger: larger;
+}

package/dist/css/utilities.css

@@ -0,0 +1,329 @@
+@utility animation-delay-* {
+	--tw-animation-delay: --value([*]);
+	/* prettier-ignore */
+	--tw-animation-delay: --value(integer)ms;
+	animation-delay: var(--tw-animation-delay);
+}
+
+@utility animation-direction-* {
+	--tw-animation-direction: --value(--animation-direction-*);
+	animation-direction: var(--tw-animation-direction);
+}
+
+@utility animation-duration-* {
+	--tw-animation-duration: --value([*]);
+	/* prettier-ignore */
+	--tw-animation-duration: --value(integer)ms;
+	animation-duration: var(--tw-animation-duration);
+}
+
+@utility animation-ease-* {
+	--tw-animation-timing-function: --value(--ease-*, [*]);
+	animation-timing-function: var(--tw-animation-timing-function);
+}
+
+@utility animation-fill-* {
+	--tw-animation-fill-mode: --value(--animation-fill-*);
+	animation-fill-mode: var(--tw-animation-fill-mode);
+}
+
+@utility animation-iteration-* {
+	--tw-animation-iteration-count: --value(--animation-iteration-*, integer);
+	animation-iteration-count: var(--tw-animation-iteration-count);
+}
+
+@utility animation-start-* {
+	--tw-animation-range-start: --value(--animation-range-start-*, [*]);
+	/* prettier-ignore */
+	--tw-animation-range-start: --value(number)px;
+	--tw-animation-range-start: --value(percentage);
+	animation-range-start: var(--tw-animation-range-start);
+}
+
+@utility animation-state-* {
+	--tw-animation-state: --value(--animation-state-*);
+	animation-play-state: var(--tw-animation-state);
+}
+
+@utility corner-* {
+	corner-shape: --value(--corner-shape-*, [*]);
+}
+
+@utility corner-s-* {
+	corner-start-start-shape: --value(--corner-shape-*, [*]);
+	corner-end-start-shape: --value(--corner-shape-*, [*]);
+}
+
+@utility corner-e-* {
+	corner-start-end-shape: --value(--corner-shape-*, [*]);
+	corner-end-end-shape: --value(--corner-shape-*, [*]);
+}
+
+@utility corner-t-* {
+	corner-top-left-shape: --value(--corner-shape-*, [*]);
+	corner-top-right-shape: --value(--corner-shape-*, [*]);
+}
+
+@utility corner-r-* {
+	corner-top-right-shape: --value(--corner-shape-*, [*]);
+	corner-bottom-right-shape: --value(--corner-shape-*, [*]);
+}
+
+@utility corner-b-* {
+	corner-bottom-left-shape: --value(--corner-shape-*, [*]);
+	corner-bottom-right-shape: --value(--corner-shape-*, [*]);
+}
+
+@utility corner-l-* {
+	corner-top-left-shape: --value(--corner-shape-*, [*]);
+	corner-bottom-left-shape: --value(--corner-shape-*, [*]);
+}
+
+@utility corner-ss-* {
+	corner-start-start-shape: --value(--corner-shape-*, [*]);
+}
+
+@utility corner-se-* {
+	corner-start-end-shape: --value(--corner-shape-*, [*]);
+}
+
+@utility corner-es-* {
+	corner-end-start-shape: --value(--corner-shape-*, [*]);
+}
+
+@utility corner-tl-* {
+	corner-top-left-shape: --value(--corner-shape-*, [*]);
+}
+
+@utility corner-tr-* {
+	corner-top-right-shape: --value(--corner-shape-*, [*]);
+}
+
+@utility corner-br-* {
+	corner-bottom-right-shape: --value(--corner-shape-*, [*]);
+}
+
+@utility corner-bl-* {
+	corner-bottom-left-shape: --value(--corner-shape-*, [*]);
+}
+
+@utility -corner-infinity {
+	corner-shape: superellipse(-infinity);
+}
+
+@utility -corner-s-infinity {
+	corner-start-start-shape: superellipse(-infinity);
+	corner-end-start-shape: superellipse(-infinity);
+}
+
+@utility -corner-e-infinity {
+	corner-start-end-shape: superellipse(-infinity);
+	corner-end-end-shape: superellipse(-infinity);
+}
+
+@utility -corner-t-infinity {
+	corner-top-left-shape: superellipse(-infinity);
+	corner-top-right-shape: superellipse(-infinity);
+}
+
+@utility -corner-r-infinity {
+	corner-top-right-shape: superellipse(-infinity);
+	corner-bottom-right-shape: superellipse(-infinity);
+}
+
+@utility -corner-b-infinity {
+	corner-bottom-left-shape: superellipse(-infinity);
+	corner-bottom-right-shape: superellipse(-infinity);
+}
+
+@utility -corner-l-infinity {
+	corner-top-left-shape: superellipse(-infinity);
+	corner-bottom-left-shape: superellipse(-infinity);
+}
+
+@utility -corner-ss-infinity {
+	corner-start-start-shape: superellipse(-infinity);
+}
+
+@utility -corner-se-infinity {
+	corner-start-end-shape: superellipse(-infinity);
+}
+
+@utility -corner-es-infinity {
+	corner-end-start-shape: superellipse(-infinity);
+}
+
+@utility -corner-tl-infinity {
+	corner-top-left-shape: superellipse(-infinity);
+}
+
+@utility -corner-tr-infinity {
+	corner-top-right-shape: superellipse(-infinity);
+}
+
+@utility -corner-br-infinity {
+	corner-bottom-right-shape: superellipse(-infinity);
+}
+
+@utility -corner-bl-infinity {
+	corner-bottom-left-shape: superellipse(-infinity);
+}
+
+@utility corner-super-* {
+	corner-shape: superellipse(--value(number));
+}
+
+@utility corner-s-super-* {
+	corner-start-start-shape: superellipse(--value(number));
+	corner-end-start-shape: superellipse(--value(number));
+}
+
+@utility corner-e-super-* {
+	corner-start-end-shape: superellipse(--value(number));
+	corner-end-end-shape: superellipse(--value(number));
+}
+
+@utility corner-t-super-* {
+	corner-top-left-shape: superellipse(--value(number));
+	corner-top-right-shape: superellipse(--value(number));
+}
+
+@utility corner-r-super-* {
+	corner-top-right-shape: superellipse(--value(number));
+	corner-bottom-right-shape: superellipse(--value(number));
+}
+
+@utility corner-b-super-* {
+	corner-bottom-left-shape: superellipse(--value(number));
+	corner-bottom-right-shape: superellipse(--value(number));
+}
+
+@utility corner-l-super-* {
+	corner-top-left-shape: superellipse(--value(number));
+	corner-bottom-left-shape: superellipse(--value(number));
+}
+
+@utility corner-ss-super-* {
+	corner-start-start-shape: superellipse(--value(number));
+}
+
+@utility corner-se-super-* {
+	corner-start-end-shape: superellipse(--value(number));
+}
+
+@utility corner-es-super-* {
+	corner-end-start-shape: superellipse(--value(number));
+}
+
+@utility corner-tl-super-* {
+	corner-top-left-shape: superellipse(--value(number));
+}
+
+@utility corner-tr-super-* {
+	corner-top-right-shape: superellipse(--value(number));
+}
+
+@utility corner-br-super-* {
+	corner-bottom-right-shape: superellipse(--value(number));
+}
+
+@utility corner-bl-super-* {
+	corner-bottom-left-shape: superellipse(--value(number));
+}
+
+@utility -corner-super-* {
+	corner-shape: superellipse(calc(--value(number) * -1));
+}
+
+@utility -corner-s-super-* {
+	corner-start-start-shape: superellipse(calc(--value(number) * -1));
+	corner-end-start-shape: superellipse(calc(--value(number) * -1));
+}
+
+@utility -corner-e-super-* {
+	corner-start-end-shape: superellipse(calc(--value(number) * -1));
+	corner-end-end-shape: superellipse(calc(--value(number) * -1));
+}
+
+@utility -corner-t-super-* {
+	corner-top-left-shape: superellipse(calc(--value(number) * -1));
+	corner-top-right-shape: superellipse(calc(--value(number) * -1));
+}
+
+@utility -corner-r-super-* {
+	corner-top-right-shape: superellipse(calc(--value(number) * -1));
+	corner-bottom-right-shape: superellipse(calc(--value(number) * -1));
+}
+
+@utility -corner-b-super-* {
+	corner-bottom-left-shape: superellipse(calc(--value(number) * -1));
+	corner-bottom-right-shape: superellipse(calc(--value(number) * -1));
+}
+
+@utility -corner-l-super-* {
+	corner-top-left-shape: superellipse(calc(--value(number) * -1));
+	corner-bottom-left-shape: superellipse(calc(--value(number) * -1));
+}
+
+@utility -corner-ss-super-* {
+	corner-start-start-shape: superellipse(calc(--value(number) * -1));
+}
+
+@utility -corner-se-super-* {
+	corner-start-end-shape: superellipse(calc(--value(number) * -1));
+}
+
+@utility -corner-es-super-* {
+	corner-end-start-shape: superellipse(calc(--value(number) * -1));
+}
+
+@utility -corner-tl-super-* {
+	corner-top-left-shape: superellipse(calc(--value(number) * -1));
+}
+
+@utility -corner-tr-super-* {
+	corner-top-right-shape: superellipse(calc(--value(number) * -1));
+}
+
+@utility -corner-br-super-* {
+	corner-bottom-right-shape: superellipse(calc(--value(number) * -1));
+}
+
+@utility -corner-bl-super-* {
+	corner-bottom-left-shape: superellipse(calc(--value(number) * -1));
+}
+
+@utility gap-* {
+	--tw-gap: --value([*]);
+	--tw-gap-x: --value([*]);
+	--tw-gap-y: --value([*]);
+	--tw-gap: calc(var(--spacing) * --value(number));
+	--tw-gap-x: var(--tw-gap, calc(var(--spacing) * --value(number)));
+	--tw-gap-y: var(--tw-gap, calc(var(--spacing) * --value(number)));
+}
+
+@utility gap-x-* {
+	--tw-gap-x: --value([*]);
+	--tw-gap-x: calc(var(--spacing) * --value(number));
+}
+
+@utility gap-y-* {
+	--tw-gap-y: --value([*]);
+	--tw-gap-y: calc(var(--spacing) * --value(number));
+}
+
+@utility grid-rows-0fr {
+	grid-template-rows: 0fr;
+}
+
+@utility grid-rows-1fr {
+	grid-template-rows: 1fr;
+}
+
+@utility transition-cols {
+	transition-property: grid-template-columns;
+}
+
+@utility transition-rows {
+	transition-property: grid-template-rows;
+}

package/dist/graphics/index.js

@@ -2,22 +2,21 @@ import { extendTailwindMerge } from "tailwind-merge";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/utils/custom-tailwind-merge.ts
-const integerList = Array.from({ length: 100 }, (_, i) => `${i + 1}`);
+const isInteger = (classPart) => /^\d+$/.test(classPart);
+const isFloat = (classPart) => /^\d+\.\d+$/.test(classPart);
+const isArbitraryValue = (classPart) => /^\[.+\]$/.test(classPart);
+const cornerShapeList = [
+	"bevel",
+	"notch",
+	"round",
+	"scoop",
+	"square",
+	"squircle",
+	"infinity",
+	isArbitraryValue
+];
 const twMerge = extendTailwindMerge({ extend: { classGroups: {
-	animate: [{ animate: [
-		"bounce",
-		"double-spin",
-		"drop-in",
-		"flip",
-		"flip-again",
-		"grid-rows",
-		"heartbeat",
-		"ping",
-		"pulse",
-		"slide-up",
-		"spin",
-		"wave"
-	] }],
+	animate: [{ animate: ["fade-in", "wave"] }],
 	"animation-direction": [{ "animation-direction": [
 		"normal",
 		"reverse",
@@ -30,11 +29,71 @@ const twMerge = extendTailwindMerge({ extend: { classGroups: {
 		"backwards",
 		"both"
 	] }],
-	"animation-iteration": [{ "animation-iteration": [...integerList, "infinite"] }],
+	"animation-iteration": [{ "animation-iteration": ["infinite", isInteger] }],
 	"animation-state": [{ "animation-state": ["running", "paused"] }],
+	corner: [{
+		corner: cornerShapeList,
+		"corner-super": [isFloat, isInteger],
+		"corner-s": cornerShapeList,
+		"corner-s-super": [isFloat, isInteger],
+		"corner-e": cornerShapeList,
+		"corner-e-super": [isFloat, isInteger],
+		"corner-t": cornerShapeList,
+		"corner-t-super": [isFloat, isInteger],
+		"corner-r": cornerShapeList,
+		"corner-r-super": [isFloat, isInteger],
+		"corner-b": cornerShapeList,
+		"corner-b-super": [isFloat, isInteger],
+		"corner-l": cornerShapeList,
+		"corner-l-super": [isFloat, isInteger],
+		"corner-ss": cornerShapeList,
+		"corner-ss-super": [isFloat, isInteger],
+		"corner-se": cornerShapeList,
+		"corner-se-super": [isFloat, isInteger],
+		"corner-es": cornerShapeList,
+		"corner-es-super": [isFloat, isInteger],
+		"corner-tl": cornerShapeList,
+		"corner-tl-super": [isFloat, isInteger],
+		"corner-tr": cornerShapeList,
+		"corner-tr-super": [isFloat, isInteger],
+		"corner-br": cornerShapeList,
+		"corner-br-super": [isFloat, isInteger],
+		"corner-bl": cornerShapeList,
+		"corner-bl-super": [isFloat, isInteger],
+		"-corner": ["infinity"],
+		"-corner-super": [isFloat, isInteger],
+		"-corner-s": ["infinity"],
+		"-corner-s-super": [isFloat, isInteger],
+		"-corner-e": ["infinity"],
+		"-corner-e-super": [isFloat, isInteger],
+		"-corner-t": ["infinity"],
+		"-corner-t-super": [isFloat, isInteger],
+		"-corner-r": ["infinity"],
+		"-corner-r-super": [isFloat, isInteger],
+		"-corner-b": ["infinity"],
+		"-corner-b-super": [isFloat, isInteger],
+		"-corner-l": ["infinity"],
+		"-corner-l-super": [isFloat, isInteger],
+		"-corner-ss": ["infinity"],
+		"-corner-ss-super": [isFloat, isInteger],
+		"-corner-se": ["infinity"],
+		"-corner-se-super": [isFloat, isInteger],
+		"-corner-es": ["infinity"],
+		"-corner-es-super": [isFloat, isInteger],
+		"-corner-tl": ["infinity"],
+		"-corner-tl-super": [isFloat, isInteger],
+		"-corner-tr": ["infinity"],
+		"-corner-tr-super": [isFloat, isInteger],
+		"-corner-br": ["infinity"],
+		"-corner-br-super": [isFloat, isInteger],
+		"-corner-bl": ["infinity"],
+		"-corner-bl-super": [isFloat, isInteger]
+	}],
+	ease: [{ ease: ["exponential", "spring"] }],
+	"font-size": [{ text: ["smaller", "larger"] }],
 	"grid-cols": [{ "grid-cols": ["0fr", "1fr"] }],
 	"grid-rows": [{ "grid-rows": ["0fr", "1fr"] }],
-	transition: ["transition-rows"]
+	transition: [{ transition: ["transition-cols", "transition-rows"] }]
 } } });
 
 //#endregion