@ndla/preset-panda 0.0.1

package/lib/animations.js

@@ -0,0 +1,233 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.keyframes = exports.easings = exports.durations = exports.animations = void 0;
+var _dev = require("@pandacss/dev");
+/**
+ * Copyright (c) 2024-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+const animations = exports.animations = _dev.defineTokens.animations({
+  spin: {
+    value: "spin 700ms infinite linear"
+  },
+  "collapse-in": {
+    value: "collapse-in 250ms {easings.emphasized-in}"
+  },
+  "collapse-out": {
+    value: "collapse-out 200ms {easings.emphasized-out}"
+  },
+  "fade-shift-in": {
+    value: "fade-shift-in 200ms {easings.emphasized-in}"
+  },
+  "fade-shift-out": {
+    value: "fade-shift-in 200ms {easings.emphasized-in}"
+  },
+  "backdrop-in": {
+    value: "fade-in 250ms {easings.emphasized-in}"
+  },
+  "backdrop-out": {
+    value: "fade-out 200ms {easings.emphasized-out}"
+  },
+  "dialog-in": {
+    value: "fade-in 400ms {easings.emphasized-in}"
+  },
+  "dialog-out": {
+    value: "fade-out 200ms {easings.emphasized-out}"
+  },
+  "drawer-in-left": {
+    value: "slide-in-left 400ms {easings.emphasized-in}"
+  },
+  "drawer-out-left": {
+    value: "slide-out-left 200ms {easings.emphasized-out}"
+  },
+  "drawer-in-right": {
+    value: "slide-in-right 400ms {easings.emphasized-in}"
+  },
+  "drawer-out-right": {
+    value: "slide-out-right 200ms {easings.emphasized-out}"
+  },
+  "drawer-in-bottom": {
+    value: "slide-in-bottom 400ms {easings.emphasized-in}"
+  },
+  "drawer-out-bottom": {
+    value: "slide-out-bottom 200ms {easings.emphasized-out}"
+  },
+  "drawer-in-top": {
+    value: "slide-in-top 400ms {easings.emphasized-in}"
+  },
+  "drawer-out-top": {
+    value: "slide-out-top 200ms {easings.emphasized-out}"
+  },
+  "skeleton-pulse": {
+    value: "skeleton-pulse 2s {easings.pulse} infinite"
+  }
+});
+const easings = exports.easings = _dev.defineTokens.easings({
+  default: {
+    value: "cubic-bezier(0.17, 0.04, 0.03, 0.94)"
+  },
+  "emphasized-in": {
+    value: "cubic-bezier(0.05, 0.7, 0.1, 1.0)"
+  },
+  "emphasized-out": {
+    value: "cubic-bezier(0.3, 0.0, 0.8, 0.15)"
+  },
+  pulse: {
+    value: "cubic-bezier(0.4, 0.0, 0.6, 1.0)"
+  }
+});
+const durations = exports.durations = _dev.defineTokens.durations({
+  superFast: {
+    value: "100ms"
+  },
+  fast: {
+    value: "200ms"
+  },
+  normal: {
+    value: "400ms"
+  },
+  slow: {
+    value: "600ms"
+  },
+  infinite: {
+    value: "infinite"
+  }
+});
+const keyframes = exports.keyframes = {
+  spin: {
+    from: {
+      transform: "rotate(0deg)"
+    },
+    to: {
+      transform: "rotate(360deg)"
+    }
+  },
+  "fade-shift-in": {
+    "0%": {
+      opacity: "0",
+      transform: "translateY(-4px)"
+    },
+    "100%": {
+      opacity: "1",
+      transform: "translateY(0)"
+    }
+  },
+  "fade-shift-out": {
+    "0%": {
+      opacity: "1",
+      transform: "translateY(0)"
+    },
+    "100%": {
+      opacity: "0",
+      transform: "translateY(-4px)"
+    }
+  },
+  "collapse-in": {
+    "0%": {
+      height: "0"
+    },
+    "100%": {
+      height: "var(--height)"
+    }
+  },
+  "collapse-out": {
+    "0%": {
+      height: "var(--height)"
+    },
+    "100%": {
+      height: "0"
+    }
+  },
+  "fade-in": {
+    from: {
+      opacity: "0"
+    },
+    to: {
+      opacity: "1"
+    }
+  },
+  "fade-out": {
+    from: {
+      opacity: "1"
+    },
+    to: {
+      opacity: "0"
+    }
+  },
+  "slide-in-left": {
+    "0%": {
+      transform: "translateX(-100%)"
+    },
+    "100%": {
+      transform: "translateX(0%)"
+    }
+  },
+  "slide-out-left": {
+    "0%": {
+      transform: "translateX(0%)"
+    },
+    "100%": {
+      transform: "translateX(-100%)"
+    }
+  },
+  "slide-in-right": {
+    "0%": {
+      transform: "translateX(100%)"
+    },
+    "100%": {
+      transform: "translateX(0%)"
+    }
+  },
+  "slide-out-right": {
+    "0%": {
+      transform: "translateX(0%)"
+    },
+    "100%": {
+      transform: "translateX(100%)"
+    }
+  },
+  "slide-in-top": {
+    "0%": {
+      transform: "translateY(-100%)"
+    },
+    "100%": {
+      transform: "translateY(0%)"
+    }
+  },
+  "slide-out-top": {
+    "0%": {
+      transform: "translateY(0%)"
+    },
+    "100%": {
+      transform: "translateY(-100%)"
+    }
+  },
+  "slide-in-bottom": {
+    "0%": {
+      transform: "translateY(100%)"
+    },
+    "100%": {
+      transform: "translateY(0%)"
+    }
+  },
+  "slide-out-bottom": {
+    "0%": {
+      transform: "translateY(0%)"
+    },
+    "100%": {
+      transform: "translateY(100%)"
+    }
+  },
+  "skeleton-pulse": {
+    "50%": {
+      opacity: "0.5"
+    }
+  }
+};

package/lib/boxShadows.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Copyright (c) 2024-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+export declare const boxShadows: {
+    xxsmall: {
+        value: string[];
+    };
+    xsmall: {
+        value: string[];
+    };
+    medium: {
+        value: string[];
+    };
+    large: {
+        value: string[];
+    };
+    xlarge: {
+        value: string[];
+    };
+};

package/lib/boxShadows.js

@@ -0,0 +1,32 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.boxShadows = void 0;
+var _dev = require("@pandacss/dev");
+/**
+ * Copyright (c) 2024-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+const boxShadows = exports.boxShadows = _dev.defineTokens.shadows({
+  xxsmall: {
+    value: ["0px 1px 3px 0px rgba(0, 0, 0, 0.15)", "0px 0px 0.5px 0px rgba(0, 0, 0, 0.18)"]
+  },
+  xsmall: {
+    value: ["0px 3px 8px 0px rgba(0, 0, 0, 0.10)", "0px 1px 3px 0px rgba(0, 0, 0, 0.10)", "0px 0px 0.5px 0px rgba(0, 0, 0, 0.18)"]
+  },
+  medium: {
+    value: ["0px 5px 12px 0px rgba(0, 0, 0, 0.13)", "0px 1px 3px 0px rgba(0, 0, 0, 0.10)", "0px 0px 0.5px 0px rgba(0, 0, 0, 0.15)"]
+  },
+  large: {
+    value: ["0px 10px 16px 0px rgba(0, 0, 0, 0.12)", "0px 2px 5px 0px rgba(0, 0, 0, 0.15)", "0px 0px 0.5px 0px rgba(0, 0, 0, 0.12)"]
+  },
+  xlarge: {
+    value: ["0px 10px 24px 0px rgba(0, 0, 0, 0.18)", "0px 2px 5px 0px rgba(0, 0, 0, 0.15)", "0px 0px 0.5px 0px rgba(0, 0, 0, 0.08)"]
+  }
+});

package/lib/breakpoints.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Copyright (c) 2024-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+export declare const breakpoints: {
+    mobile: string;
+    mobileWide: string;
+    tablet: string;
+    tabletWide: string;
+    desktop: string;
+    wide: string;
+    ultraWide: string;
+};

package/lib/breakpoints.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.breakpoints = void 0;
+/**
+ * Copyright (c) 2024-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+const breakpoints = exports.breakpoints = {
+  mobile: "20em",
+  mobileWide: "29.75em",
+  tablet: "37.5625em",
+  tabletWide: "48em",
+  desktop: "61.3125em",
+  wide: "81.3125em",
+  ultraWide: "100.0625em"
+};

package/lib/colors.d.ts

@@ -0,0 +1,240 @@
+/**
+ * Copyright (c) 2024-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+export declare const colors: {
+    grey: {
+        50: {
+            value: string;
+        };
+        100: {
+            value: string;
+        };
+        200: {
+            value: string;
+        };
+        300: {
+            value: string;
+        };
+        400: {
+            value: string;
+        };
+        500: {
+            value: string;
+        };
+        600: {
+            value: string;
+        };
+        700: {
+            value: string;
+        };
+        800: {
+            value: string;
+        };
+        900: {
+            value: string;
+        };
+        950: {
+            value: string;
+        };
+    };
+    blue: {
+        50: {
+            value: string;
+        };
+        100: {
+            value: string;
+        };
+        200: {
+            value: string;
+        };
+        300: {
+            value: string;
+        };
+        400: {
+            value: string;
+        };
+        500: {
+            value: string;
+        };
+        600: {
+            value: string;
+        };
+        700: {
+            value: string;
+        };
+        800: {
+            value: string;
+        };
+        900: {
+            value: string;
+        };
+        950: {
+            value: string;
+        };
+    };
+    purple: {
+        50: {
+            value: string;
+        };
+        100: {
+            value: string;
+        };
+        200: {
+            value: string;
+        };
+        300: {
+            value: string;
+        };
+        400: {
+            value: string;
+        };
+        500: {
+            value: string;
+        };
+        600: {
+            value: string;
+        };
+        700: {
+            value: string;
+        };
+        800: {
+            value: string;
+        };
+        900: {
+            value: string;
+        };
+        950: {
+            value: string;
+        };
+    };
+    yellow: {
+        50: {
+            value: string;
+        };
+        100: {
+            value: string;
+        };
+        200: {
+            value: string;
+        };
+        300: {
+            value: string;
+        };
+        400: {
+            value: string;
+        };
+        500: {
+            value: string;
+        };
+        600: {
+            value: string;
+        };
+        700: {
+            value: string;
+        };
+        800: {
+            value: string;
+        };
+        900: {
+            value: string;
+        };
+        950: {
+            value: string;
+        };
+        1000: {
+            value: string;
+        };
+        1100: {
+            value: string;
+        };
+        1200: {
+            value: string;
+        };
+        1300: {
+            value: string;
+        };
+        1400: {
+            value: string;
+        };
+    };
+    green: {
+        50: {
+            value: string;
+        };
+        100: {
+            value: string;
+        };
+        200: {
+            value: string;
+        };
+        300: {
+            value: string;
+        };
+        400: {
+            value: string;
+        };
+        500: {
+            value: string;
+        };
+        600: {
+            value: string;
+        };
+        700: {
+            value: string;
+        };
+        800: {
+            value: string;
+        };
+        900: {
+            value: string;
+        };
+        950: {
+            value: string;
+        };
+    };
+    pink: {
+        50: {
+            value: string;
+        };
+        100: {
+            value: string;
+        };
+        200: {
+            value: string;
+        };
+        300: {
+            value: string;
+        };
+        400: {
+            value: string;
+        };
+        500: {
+            value: string;
+        };
+        600: {
+            value: string;
+        };
+        700: {
+            value: string;
+        };
+        800: {
+            value: string;
+        };
+        900: {
+            value: string;
+        };
+        950: {
+            value: string;
+        };
+    };
+    white: {
+        value: string;
+    };
+    primary: {
+        value: string;
+    };
+};