UNPKG

@nurl/panda-preset

Version:

Official Panda-CSS preset for the Ganglion Design System.

89 lines (88 loc) 2.66 kB
"use strict"; var __defProp = Object.defineProperty; var __getOwnPropDesc = Object.getOwnPropertyDescriptor; var __getOwnPropNames = Object.getOwnPropertyNames; var __hasOwnProp = Object.prototype.hasOwnProperty; var __export = (target, all) => { for (var name in all) __defProp(target, name, { get: all[name], enumerable: true }); }; var __copyProps = (to, from, except, desc) => { if (from && typeof from === "object" || typeof from === "function") { for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); } return to; }; var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); // src/patterns.ts var patterns_exports = {}; __export(patterns_exports, { definePattern: () => definePattern, patterns: () => patterns }); module.exports = __toCommonJS(patterns_exports); function definePattern(config) { return config; } var scrollable = definePattern({ description: "A container that allows for scrolling", properties: { // The direction of the scroll direction: { type: "enum", value: ["horizontal", "vertical"] }, // Whether to hide the scrollbar hideScrollbar: { type: "boolean" } }, // disallow the `overflow` property (in TypeScript) blocklist: ["overflow"], transform(props) { const { direction, hideScrollbar, ...rest } = props; return { overflow: "auto", height: direction === "horizontal" ? "100%" : "auto", width: direction === "vertical" ? "100%" : "auto", scrollbarWidth: hideScrollbar ? "none" : "auto", WebkitOverflowScrolling: "touch", "&::-webkit-scrollbar": { display: hideScrollbar ? "none" : "auto" }, ...rest }; } }); var animateIn = definePattern({ description: "A container that fades in the content", properties: { // The delay of the animation delay: { type: "string" } }, // disallow the `overflow` property (in TypeScript) blocklist: ["overflow"], transform(props) { const { delay, ...rest } = props; return { animationName: "fadeIn", animationDuration: "2s", animationFillMode: "forwards", animationDelay: delay ?? "200ms", opacity: "0", ...rest, _motionReduce: { animationName: "none" } }; } }); var patterns = { extend: { animateIn, scrollable } }; // Annotate the CommonJS export names for ESM import in node: 0 && (module.exports = { definePattern, patterns }); //# sourceMappingURL=patterns.cjs.map