flikkui 0.1.0-beta.11

package/dist/node_modules/motion-dom/dist/es/value/types/color/hex.js

@@ -0,0 +1,40 @@
+import { rgba } from './rgba.js';
+import { isColorString } from './utils.js';
+
+function parseHex(v) {
+    let r = "";
+    let g = "";
+    let b = "";
+    let a = "";
+    // If we have 6 characters, ie #FF0000
+    if (v.length > 5) {
+        r = v.substring(1, 3);
+        g = v.substring(3, 5);
+        b = v.substring(5, 7);
+        a = v.substring(7, 9);
+        // Or we have 3 characters, ie #F00
+    }
+    else {
+        r = v.substring(1, 2);
+        g = v.substring(2, 3);
+        b = v.substring(3, 4);
+        a = v.substring(4, 5);
+        r += r;
+        g += g;
+        b += b;
+        a += a;
+    }
+    return {
+        red: parseInt(r, 16),
+        green: parseInt(g, 16),
+        blue: parseInt(b, 16),
+        alpha: a ? parseInt(a, 16) / 255 : 1,
+    };
+}
+const hex = {
+    test: /*@__PURE__*/ isColorString("#"),
+    parse: parseHex,
+    transform: rgba.transform,
+};
+
+export { hex };

package/dist/node_modules/motion-dom/dist/es/value/types/color/hsla-to-rgba.js

@@ -0,0 +1,42 @@
+// Adapted from https://gist.github.com/mjackson/5311256
+function hueToRgb(p, q, t) {
+    if (t < 0)
+        t += 1;
+    if (t > 1)
+        t -= 1;
+    if (t < 1 / 6)
+        return p + (q - p) * 6 * t;
+    if (t < 1 / 2)
+        return q;
+    if (t < 2 / 3)
+        return p + (q - p) * (2 / 3 - t) * 6;
+    return p;
+}
+function hslaToRgba({ hue, saturation, lightness, alpha }) {
+    hue /= 360;
+    saturation /= 100;
+    lightness /= 100;
+    let red = 0;
+    let green = 0;
+    let blue = 0;
+    if (!saturation) {
+        red = green = blue = lightness;
+    }
+    else {
+        const q = lightness < 0.5
+            ? lightness * (1 + saturation)
+            : lightness + saturation - lightness * saturation;
+        const p = 2 * lightness - q;
+        red = hueToRgb(p, q, hue + 1 / 3);
+        green = hueToRgb(p, q, hue);
+        blue = hueToRgb(p, q, hue - 1 / 3);
+    }
+    return {
+        red: Math.round(red * 255),
+        green: Math.round(green * 255),
+        blue: Math.round(blue * 255),
+        alpha,
+    };
+}
+
+export { hslaToRgba };

package/dist/node_modules/motion-dom/dist/es/value/types/color/hsla.js

@@ -0,0 +1,22 @@
+import { alpha } from '../numbers/index.js';
+import { percent } from '../numbers/units.js';
+import { sanitize } from '../utils/sanitize.js';
+import { isColorString, splitColor } from './utils.js';
+
+const hsla = {
+    test: /*@__PURE__*/ isColorString("hsl", "hue"),
+    parse: /*@__PURE__*/ splitColor("hue", "saturation", "lightness"),
+    transform: ({ hue, saturation, lightness, alpha: alpha$1 = 1 }) => {
+        return ("hsla(" +
+            Math.round(hue) +
+            ", " +
+            percent.transform(sanitize(saturation)) +
+            ", " +
+            percent.transform(sanitize(lightness)) +
+            ", " +
+            sanitize(alpha.transform(alpha$1)) +
+            ")");
+    },
+};
+
+export { hsla };

package/dist/node_modules/motion-dom/dist/es/value/types/color/index.js

@@ -0,0 +1,32 @@
+import { hex } from './hex.js';
+import { hsla } from './hsla.js';
+import { rgba } from './rgba.js';
+
+const color = {
+    test: (v) => rgba.test(v) || hex.test(v) || hsla.test(v),
+    parse: (v) => {
+        if (rgba.test(v)) {
+            return rgba.parse(v);
+        }
+        else if (hsla.test(v)) {
+            return hsla.parse(v);
+        }
+        else {
+            return hex.parse(v);
+        }
+    },
+    transform: (v) => {
+        return typeof v === "string"
+            ? v
+            : v.hasOwnProperty("red")
+                ? rgba.transform(v)
+                : hsla.transform(v);
+    },
+    getAnimatableNone: (v) => {
+        const parsed = color.parse(v);
+        parsed.alpha = 0;
+        return color.transform(parsed);
+    },
+};
+
+export { color };

package/dist/node_modules/motion-dom/dist/es/value/types/color/rgba.js

@@ -0,0 +1,25 @@
+import { number, alpha } from '../numbers/index.js';
+import { sanitize } from '../utils/sanitize.js';
+import { isColorString, splitColor } from './utils.js';
+import { clamp } from '../../../../../../motion-utils/dist/es/clamp.js';
+
+const clampRgbUnit = (v) => clamp(0, 255, v);
+const rgbUnit = {
+    ...number,
+    transform: (v) => Math.round(clampRgbUnit(v)),
+};
+const rgba = {
+    test: /*@__PURE__*/ isColorString("rgb", "red"),
+    parse: /*@__PURE__*/ splitColor("red", "green", "blue"),
+    transform: ({ red, green, blue, alpha: alpha$1 = 1 }) => "rgba(" +
+        rgbUnit.transform(red) +
+        ", " +
+        rgbUnit.transform(green) +
+        ", " +
+        rgbUnit.transform(blue) +
+        ", " +
+        sanitize(alpha.transform(alpha$1)) +
+        ")",
+};
+
+export { rgbUnit, rgba };

package/dist/node_modules/motion-dom/dist/es/value/types/color/utils.js

@@ -0,0 +1,29 @@
+import { floatRegex } from '../utils/float-regex.js';
+import { isNullish } from '../utils/is-nullish.js';
+import { singleColorRegex } from '../utils/single-color-regex.js';
+
+/**
+ * Returns true if the provided string is a color, ie rgba(0,0,0,0) or #000,
+ * but false if a number or multiple colors
+ */
+const isColorString = (type, testProp) => (v) => {
+    return Boolean((typeof v === "string" &&
+        singleColorRegex.test(v) &&
+        v.startsWith(type)) ||
+        (testProp &&
+            !isNullish(v) &&
+            Object.prototype.hasOwnProperty.call(v, testProp)));
+};
+const splitColor = (aName, bName, cName) => (v) => {
+    if (typeof v !== "string")
+        return v;
+    const [a, b, c, alpha] = v.match(floatRegex);
+    return {
+        [aName]: parseFloat(a),
+        [bName]: parseFloat(b),
+        [cName]: parseFloat(c),
+        alpha: alpha !== undefined ? parseFloat(alpha) : 1,
+    };
+};
+
+export { isColorString, splitColor };

package/dist/node_modules/motion-dom/dist/es/value/types/complex/filter.js

@@ -0,0 +1,30 @@
+import { complex } from './index.js';
+import { floatRegex } from '../utils/float-regex.js';
+
+/**
+ * Properties that should default to 1 or 100%
+ */
+const maxDefaults = new Set(["brightness", "contrast", "saturate", "opacity"]);
+function applyDefaultFilter(v) {
+    const [name, value] = v.slice(0, -1).split("(");
+    if (name === "drop-shadow")
+        return v;
+    const [number] = value.match(floatRegex) || [];
+    if (!number)
+        return v;
+    const unit = value.replace(number, "");
+    let defaultValue = maxDefaults.has(name) ? 1 : 0;
+    if (number !== value)
+        defaultValue *= 100;
+    return name + "(" + defaultValue + unit + ")";
+}
+const functionRegex = /\b([a-z-]*)\(.*?\)/gu;
+const filter = {
+    ...complex,
+    getAnimatableNone: (v) => {
+        const functions = v.match(functionRegex);
+        return functions ? functions.map(applyDefaultFilter).join(" ") : v;
+    },
+};
+
+export { filter };

package/dist/node_modules/motion-dom/dist/es/value/types/complex/index.js

@@ -0,0 +1,91 @@
+import { color } from '../color/index.js';
+import { colorRegex } from '../utils/color-regex.js';
+import { floatRegex } from '../utils/float-regex.js';
+import { sanitize } from '../utils/sanitize.js';
+
+function test(v) {
+    return (isNaN(v) &&
+        typeof v === "string" &&
+        (v.match(floatRegex)?.length || 0) +
+            (v.match(colorRegex)?.length || 0) >
+            0);
+}
+const NUMBER_TOKEN = "number";
+const COLOR_TOKEN = "color";
+const VAR_TOKEN = "var";
+const VAR_FUNCTION_TOKEN = "var(";
+const SPLIT_TOKEN = "${}";
+// this regex consists of the `singleCssVariableRegex|rgbHSLValueRegex|digitRegex`
+const complexRegex = /var\s*\(\s*--(?:[\w-]+\s*|[\w-]+\s*,(?:\s*[^)(\s]|\s*\((?:[^)(]|\([^)(]*\))*\))+\s*)\)|#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\)|-?(?:\d+(?:\.\d+)?|\.\d+)/giu;
+function analyseComplexValue(value) {
+    const originalValue = value.toString();
+    const values = [];
+    const indexes = {
+        color: [],
+        number: [],
+        var: [],
+    };
+    const types = [];
+    let i = 0;
+    const tokenised = originalValue.replace(complexRegex, (parsedValue) => {
+        if (color.test(parsedValue)) {
+            indexes.color.push(i);
+            types.push(COLOR_TOKEN);
+            values.push(color.parse(parsedValue));
+        }
+        else if (parsedValue.startsWith(VAR_FUNCTION_TOKEN)) {
+            indexes.var.push(i);
+            types.push(VAR_TOKEN);
+            values.push(parsedValue);
+        }
+        else {
+            indexes.number.push(i);
+            types.push(NUMBER_TOKEN);
+            values.push(parseFloat(parsedValue));
+        }
+        ++i;
+        return SPLIT_TOKEN;
+    });
+    const split = tokenised.split(SPLIT_TOKEN);
+    return { values, split, indexes, types };
+}
+function parseComplexValue(v) {
+    return analyseComplexValue(v).values;
+}
+function createTransformer(source) {
+    const { split, types } = analyseComplexValue(source);
+    const numSections = split.length;
+    return (v) => {
+        let output = "";
+        for (let i = 0; i < numSections; i++) {
+            output += split[i];
+            if (v[i] !== undefined) {
+                const type = types[i];
+                if (type === NUMBER_TOKEN) {
+                    output += sanitize(v[i]);
+                }
+                else if (type === COLOR_TOKEN) {
+                    output += color.transform(v[i]);
+                }
+                else {
+                    output += v[i];
+                }
+            }
+        }
+        return output;
+    };
+}
+const convertNumbersToZero = (v) => typeof v === "number" ? 0 : color.test(v) ? color.getAnimatableNone(v) : v;
+function getAnimatableNone(v) {
+    const parsed = parseComplexValue(v);
+    const transformer = createTransformer(v);
+    return transformer(parsed.map(convertNumbersToZero));
+}
+const complex = {
+    test,
+    parse: parseComplexValue,
+    createTransformer,
+    getAnimatableNone,
+};
+
+export { analyseComplexValue, complex };

package/dist/node_modules/motion-dom/dist/es/value/types/dimensions.js

@@ -0,0 +1,15 @@
+import { auto } from './auto.js';
+import { number } from './numbers/index.js';
+import { px, percent, degrees, vw, vh } from './numbers/units.js';
+import { testValueType } from './test.js';
+
+/**
+ * A list of value types commonly used for dimensions
+ */
+const dimensionValueTypes = [number, px, percent, degrees, vw, vh, auto];
+/**
+ * Tests a dimensional value against the list of dimension ValueTypes
+ */
+const findDimensionValueType = (v) => dimensionValueTypes.find(testValueType(v));
+
+export { dimensionValueTypes, findDimensionValueType };

package/dist/node_modules/motion-dom/dist/es/value/types/int.js

@@ -0,0 +1,8 @@
+import { number } from './numbers/index.js';
+
+const int = {
+    ...number,
+    transform: Math.round,
+};
+
+export { int };

package/dist/node_modules/motion-dom/dist/es/value/types/maps/defaults.js

@@ -0,0 +1,30 @@
+import { color } from '../color/index.js';
+import { filter } from '../complex/filter.js';
+import { numberValueTypes } from './number.js';
+
+/**
+ * A map of default value types for common values
+ */
+const defaultValueTypes = {
+    ...numberValueTypes,
+    // Color props
+    color,
+    backgroundColor: color,
+    outlineColor: color,
+    fill: color,
+    stroke: color,
+    // Border props
+    borderColor: color,
+    borderTopColor: color,
+    borderRightColor: color,
+    borderBottomColor: color,
+    borderLeftColor: color,
+    filter,
+    WebkitFilter: filter,
+};
+/**
+ * Gets the default ValueType for the provided value key
+ */
+const getDefaultValueType = (key) => defaultValueTypes[key];
+
+export { defaultValueTypes, getDefaultValueType };

package/dist/node_modules/motion-dom/dist/es/value/types/maps/number.js

@@ -0,0 +1,50 @@
+import { int } from '../int.js';
+import { alpha } from '../numbers/index.js';
+import { px } from '../numbers/units.js';
+import { transformValueTypes } from './transform.js';
+
+const numberValueTypes = {
+    // Border props
+    borderWidth: px,
+    borderTopWidth: px,
+    borderRightWidth: px,
+    borderBottomWidth: px,
+    borderLeftWidth: px,
+    borderRadius: px,
+    radius: px,
+    borderTopLeftRadius: px,
+    borderTopRightRadius: px,
+    borderBottomRightRadius: px,
+    borderBottomLeftRadius: px,
+    // Positioning props
+    width: px,
+    maxWidth: px,
+    height: px,
+    maxHeight: px,
+    top: px,
+    right: px,
+    bottom: px,
+    left: px,
+    // Spacing props
+    padding: px,
+    paddingTop: px,
+    paddingRight: px,
+    paddingBottom: px,
+    paddingLeft: px,
+    margin: px,
+    marginTop: px,
+    marginRight: px,
+    marginBottom: px,
+    marginLeft: px,
+    // Misc
+    backgroundPositionX: px,
+    backgroundPositionY: px,
+    ...transformValueTypes,
+    zIndex: int,
+    // SVG
+    fillOpacity: alpha,
+    strokeOpacity: alpha,
+    numOctaves: int,
+};
+
+export { numberValueTypes };

package/dist/node_modules/motion-dom/dist/es/value/types/maps/transform.js

@@ -0,0 +1,31 @@
+import { alpha, scale } from '../numbers/index.js';
+import { px, progressPercentage, degrees } from '../numbers/units.js';
+
+const transformValueTypes = {
+    rotate: degrees,
+    rotateX: degrees,
+    rotateY: degrees,
+    rotateZ: degrees,
+    scale,
+    scaleX: scale,
+    scaleY: scale,
+    scaleZ: scale,
+    skew: degrees,
+    skewX: degrees,
+    skewY: degrees,
+    distance: px,
+    translateX: px,
+    translateY: px,
+    translateZ: px,
+    x: px,
+    y: px,
+    z: px,
+    perspective: px,
+    transformPerspective: px,
+    opacity: alpha,
+    originX: progressPercentage,
+    originY: progressPercentage,
+    originZ: px,
+};
+
+export { transformValueTypes };

package/dist/node_modules/motion-dom/dist/es/value/types/numbers/index.js

@@ -0,0 +1,17 @@
+import { clamp } from '../../../../../../motion-utils/dist/es/clamp.js';
+
+const number = {
+    test: (v) => typeof v === "number",
+    parse: parseFloat,
+    transform: (v) => v,
+};
+const alpha = {
+    ...number,
+    transform: (v) => clamp(0, 1, v),
+};
+const scale = {
+    ...number,
+    default: 1,
+};
+
+export { alpha, number, scale };

package/dist/node_modules/motion-dom/dist/es/value/types/numbers/units.js

@@ -0,0 +1,18 @@
+/*#__NO_SIDE_EFFECTS__*/
+const createUnitType = (unit) => ({
+    test: (v) => typeof v === "string" && v.endsWith(unit) && v.split(" ").length === 1,
+    parse: parseFloat,
+    transform: (v) => `${v}${unit}`,
+});
+const degrees = /*@__PURE__*/ createUnitType("deg");
+const percent = /*@__PURE__*/ createUnitType("%");
+const px = /*@__PURE__*/ createUnitType("px");
+const vh = /*@__PURE__*/ createUnitType("vh");
+const vw = /*@__PURE__*/ createUnitType("vw");
+const progressPercentage = /*@__PURE__*/ (() => ({
+    ...percent,
+    parse: (v) => percent.parse(v) / 100,
+    transform: (v) => percent.transform(v * 100),
+}))();
+
+export { degrees, percent, progressPercentage, px, vh, vw };

package/dist/node_modules/motion-dom/dist/es/value/types/test.js

@@ -0,0 +1,6 @@
+/**
+ * Tests a provided value against a ValueType
+ */
+const testValueType = (v) => (type) => type.test(v);
+
+export { testValueType };

package/dist/node_modules/motion-dom/dist/es/value/types/utils/animatable-none.js

@@ -0,0 +1,15 @@
+import { complex } from '../complex/index.js';
+import { filter } from '../complex/filter.js';
+import { getDefaultValueType } from '../maps/defaults.js';
+
+function getAnimatableNone(key, value) {
+    let defaultValueType = getDefaultValueType(key);
+    if (defaultValueType !== filter)
+        defaultValueType = complex;
+    // If value is not recognised as animatable, ie "none", create an animatable version origin based on the target
+    return defaultValueType.getAnimatableNone
+        ? defaultValueType.getAnimatableNone(value)
+        : undefined;
+}
+
+export { getAnimatableNone };

package/dist/node_modules/motion-dom/dist/es/value/types/utils/color-regex.js

@@ -0,0 +1,3 @@
+const colorRegex = /(?:#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\))/giu;
+
+export { colorRegex };

package/dist/node_modules/motion-dom/dist/es/value/types/utils/find.js

@@ -0,0 +1,15 @@
+import { color } from '../color/index.js';
+import { complex } from '../complex/index.js';
+import { dimensionValueTypes } from '../dimensions.js';
+import { testValueType } from '../test.js';
+
+/**
+ * A list of all ValueTypes
+ */
+const valueTypes = [...dimensionValueTypes, color, complex];
+/**
+ * Tests a value against the list of ValueTypes
+ */
+const findValueType = (v) => valueTypes.find(testValueType(v));
+
+export { findValueType };

package/dist/node_modules/motion-dom/dist/es/value/types/utils/float-regex.js

@@ -0,0 +1,3 @@
+const floatRegex = /-?(?:\d+(?:\.\d+)?|\.\d+)/gu;
+
+export { floatRegex };

package/dist/node_modules/motion-dom/dist/es/value/types/utils/get-as-type.js

@@ -0,0 +1,10 @@
+/**
+ * Provided a value and a ValueType, returns the value as that value type.
+ */
+const getValueAsType = (value, type) => {
+    return type && typeof value === "number"
+        ? type.transform(value)
+        : value;
+};
+
+export { getValueAsType };

package/dist/node_modules/motion-dom/dist/es/value/types/utils/is-nullish.js

@@ -0,0 +1,5 @@
+function isNullish(v) {
+    return v == null;
+}
+
+export { isNullish };

package/dist/node_modules/motion-dom/dist/es/value/types/utils/sanitize.js

@@ -0,0 +1,5 @@
+// If this number is a decimal, make it just five decimal places
+// to avoid exponents
+const sanitize = (v) => Math.round(v * 100000) / 100000;
+
+export { sanitize };

package/dist/node_modules/motion-dom/dist/es/value/types/utils/single-color-regex.js

@@ -0,0 +1,3 @@
+const singleColorRegex = /^(?:#[\da-f]{3,8}|(?:rgb|hsl)a?\((?:-?[\d.]+%?[,\s]+){2}-?[\d.]+%?\s*(?:[,/]\s*)?(?:\b\d+(?:\.\d+)?|\.\d+)?%?\))$/iu;
+
+export { singleColorRegex };

package/dist/node_modules/motion-dom/dist/es/value/utils/is-motion-value.js

@@ -0,0 +1,3 @@
+const isMotionValue = (value) => Boolean(value && value.getVelocity);
+
+export { isMotionValue };

package/dist/node_modules/motion-utils/dist/es/array.js

@@ -0,0 +1,21 @@
+function addUniqueItem(arr, item) {
+    if (arr.indexOf(item) === -1)
+        arr.push(item);
+}
+function removeItem(arr, item) {
+    const index = arr.indexOf(item);
+    if (index > -1)
+        arr.splice(index, 1);
+}
+// Adapted from array-move
+function moveItem([...arr], fromIndex, toIndex) {
+    const startIndex = fromIndex < 0 ? arr.length + fromIndex : fromIndex;
+    if (startIndex >= 0 && startIndex < arr.length) {
+        const endIndex = toIndex < 0 ? arr.length + toIndex : toIndex;
+        const [item] = arr.splice(fromIndex, 1);
+        arr.splice(endIndex, 0, item);
+    }
+    return arr;
+}
+
+export { addUniqueItem, moveItem, removeItem };

package/dist/node_modules/motion-utils/dist/es/clamp.js

@@ -0,0 +1,9 @@
+const clamp = (min, max, v) => {
+    if (v > max)
+        return max;
+    if (v < min)
+        return min;
+    return v;
+};
+
+export { clamp };

package/dist/node_modules/motion-utils/dist/es/easing/anticipate.js

@@ -0,0 +1,5 @@
+import { backIn } from './back.js';
+
+const anticipate = (p) => (p *= 2) < 1 ? 0.5 * backIn(p) : 0.5 * (2 - Math.pow(2, -10 * (p - 1)));
+
+export { anticipate };

package/dist/node_modules/motion-utils/dist/es/easing/back.js

@@ -0,0 +1,9 @@
+import { cubicBezier } from './cubic-bezier.js';
+import { mirrorEasing } from './modifiers/mirror.js';
+import { reverseEasing } from './modifiers/reverse.js';
+
+const backOut = /*@__PURE__*/ cubicBezier(0.33, 1.53, 0.69, 0.99);
+const backIn = /*@__PURE__*/ reverseEasing(backOut);
+const backInOut = /*@__PURE__*/ mirrorEasing(backIn);
+
+export { backIn, backInOut, backOut };

package/dist/node_modules/motion-utils/dist/es/easing/circ.js

@@ -0,0 +1,8 @@
+import { mirrorEasing } from './modifiers/mirror.js';
+import { reverseEasing } from './modifiers/reverse.js';
+
+const circIn = (p) => 1 - Math.sin(Math.acos(p));
+const circOut = reverseEasing(circIn);
+const circInOut = mirrorEasing(circIn);
+
+export { circIn, circInOut, circOut };