UNPKG

@seidhr/sanity-plugin-timespan-input

Version:

Make it easier to add timespan information with the help of Extended Date Time Format (EDTF).

1,644 lines 71.9 kB
import { set, unset, MemberField, defineType, defineField, definePlugin } from "sanity";
import { jsxs, Fragment, jsx } from "react/jsx-runtime";
import edtf, { parse as parse$1 } from "edtf";
import { useTheme, Stack, Box, Flex, Card } from "@sanity/ui";
import r, { useRef, useEffect, useCallback, useDebugValue, createElement, useContext } from "react";
import { ArrowLeftIcon, ArrowRightIcon } from "@sanity/icons";
import { format, fromUnixTime } from "date-fns";
import { TZDate } from "@date-fns/tz";
const Period = ({
  start,
  end,
  name,
  variant = "fuzzy"
}) => {
  let bg;
  const mode = useTheme().sanity.color.dark ? "dark" : "light", boxColorScheme = mode === "light" ? { backgroundColor: "#ffffff", color: "#000000" } : { backgroundColor: "#000000", color: "#ffffff" };
  switch (variant) {
    case "fuzzy":
      bg = {
        light: {
          backgroundImage: "repeating-linear-gradient(45deg, #000000 0, #000000 0.5px, transparent 0, transparent 50%)",
          backgroundSize: "5px 5px",
          backgroundColor: "#ffffff",
          borderBlockStart: "1px solid #444",
          borderBlockEnd: "1px solid #444",
          color: "#000000"
        },
        dark: {
          backgroundImage: "repeating-linear-gradient(45deg, #dddddd 0, #dddddd 0.5px, transparent 0, transparent 50%)",
          backgroundSize: "5px 5px",
          backgroundColor: "#000000",
          borderBlockStart: "1px solid #ccc",
          borderBlockEnd: "1px solid #ccc",
          color: "#ffffff"
        }
      };
      break;
    case "certain":
      bg = {
        light: {
          backgroundImage: "repeating-linear-gradient(45deg, #000000 0, #000000 0.5px, transparent 0, transparent 50%), repeating-linear-gradient(-45deg, #000000 0, #000000 0.5px, transparent 0, transparent 50%)",
          backgroundSize: "5px 5px",
          backgroundColor: "#ffffff",
          borderBlockStart: "1px solid #444",
          borderBlockEnd: "1px solid #444",
          color: "#000000"
        },
        dark: {
          backgroundImage: "repeating-linear-gradient(45deg, #dddddd 0, #dddddd 0.5px, transparent 0, transparent 50%), repeating-linear-gradient(-45deg, #dddddd 0, #dddddd 0.5px, transparent 0, transparent 50%)",
          backgroundSize: "5px 5px",
          backgroundColor: "#000000",
          borderBlockStart: "1px solid #ccc",
          borderBlockEnd: "1px solid #ccc",
          color: "#ffffff"
        }
      };
      break;
    case "unknown":
      bg = {
        light: {
          borderBlockStart: "1px solid #444",
          borderBlockEnd: "1px solid #444",
          color: "#000000"
        },
        dark: {
          borderBlockStart: "1px solid #ccc",
          borderBlockEnd: "1px solid #ccc",
          color: "#ffffff"
        }
      };
      break;
    case "infinity":
      bg = {
        light: {
          borderBlockStart: "1px solid #444",
          borderBlockEnd: "1px solid #444",
          color: "#000000"
        },
        dark: {
          borderBlockStart: "1px solid #ccc",
          borderBlockEnd: "1px solid #ccc",
          color: "#ffffff"
        }
      };
      break;
    default:
      bg = {
        light: {},
        dark: {}
      };
      break;
  }
  return /* @__PURE__ */ jsxs(Stack, { flex: 1, children: [
    /* @__PURE__ */ jsxs(
      Box,
      {
        flex: 1,
        style: {
          position: "relative",
          height: "15px"
        },
        children: [
          start && /* @__PURE__ */ jsxs(Fragment, { children: [
            /* @__PURE__ */ jsx(
              ArrowLeftIcon,
              {
                style: { position: "absolute", top: "-8px", left: "-3px", fontSize: 18 }
              }
            ),
            /* @__PURE__ */ jsx("span", { style: { position: "absolute", top: "-7px", left: "16px" }, children: format(new Date(start), "yyyy.MM.dd") })
          ] }),
          variant === "infinity" && /* @__PURE__ */ jsxs(Fragment, { children: [
            /* @__PURE__ */ jsx(
              ArrowLeftIcon,
              {
                style: { position: "absolute", top: "-8px", left: "-3px", fontSize: 18 }
              }
            ),
            /* @__PURE__ */ jsx("span", { style: { position: "absolute", top: "-7px", left: "16px" }, children: "\u221E" })
          ] })
        ]
      }
    ),
    /* @__PURE__ */ jsx(Flex, { flex: 1, justify: "center", paddingY: 1, style: bg[mode], children: /* @__PURE__ */ jsx(Box, { padding: 1, style: { ...boxColorScheme, borderRadius: "5px" }, children: name }) }),
    /* @__PURE__ */ jsxs(
      Box,
      {
        flex: 1,
        style: {
          position: "relative",
          height: "15px"
        },
        children: [
          end && /* @__PURE__ */ jsxs(Fragment, { children: [
            /* @__PURE__ */ jsx(
              ArrowRightIcon,
              {
                style: { position: "absolute", bottom: "-8px", right: "-3px", fontSize: 18 }
              }
            ),
            /* @__PURE__ */ jsx(
              "span",
              {
                style: {
                  position: "absolute",
                  bottom: "-8px",
                  right: "16px"
                },
                children: format(new Date(end), "yyyy.MM.dd")
              }
            )
          ] }),
          variant === "infinity" && /* @__PURE__ */ jsxs(Fragment, { children: [
            /* @__PURE__ */ jsx(
              ArrowRightIcon,
              {
                style: { position: "absolute", bottom: "-8px", right: "-3px", fontSize: 18 }
              }
            ),
            /* @__PURE__ */ jsx(
              "span",
              {
                style: {
                  position: "absolute",
                  bottom: "-8px",
                  right: "16px"
                },
                children: "\u221E"
              }
            )
          ] })
        ]
      }
    )
  ] });
};
function getDateLabel(date) {
  return date ? date === "Infinity" ? "infinity" : typeof date.uncertain == "number" && date.uncertain > 0 && typeof date.approximate == "number" && date.approximate !== 0 ? "approximate and uncertain" : date.uncertain === !0 || typeof date.uncertain == "number" && date.uncertain !== 0 ? "uncertain" : typeof date.approximate == "number" && date.approximate !== 0 ? "approximate" : "certain" : "unknown";
}
function getIntervalLabel(interval) {
  if (!interval?.values?.length) return ["unknown"];
  const [start, end] = interval.values, startLabel = getDateLabel(start), endLabel = getDateLabel(end);
  return [startLabel, endLabel];
}
function Preview({ value }) {
  const { beginOfTheBegin, endOfTheBegin, beginOfTheEnd, endOfTheEnd, date, edtf: edtf2 } = value;
  let boxLabel, intervalLabel = [];
  try {
    const edtfValue = parse$1(edtf2);
    boxLabel = edtfValue.type === "Date" ? getDateLabel(edtfValue) : void 0, intervalLabel = edtfValue.type === "Interval" ? getIntervalLabel(edtfValue) : [];
  } catch {
    boxLabel = "invalid";
  }
  const boxColorScheme = (useTheme().sanity.color.dark ? "dark" : "light") == "light" ? { backgroundColor: "#ffffff", color: "#000000" } : { backgroundColor: "#000000", color: "#ffffff" };
  return /* @__PURE__ */ jsx(Fragment, { children: beginOfTheBegin || endOfTheBegin || beginOfTheEnd || endOfTheEnd || date ? /* @__PURE__ */ jsxs(
    Flex,
    {
      direction: "row",
      justify: "center",
      align: "center",
      marginTop: 4,
      width: "100%",
      style: { fontSize: "12px" },
      children: [
        date && !beginOfTheBegin && !endOfTheBegin && !endOfTheEnd && !beginOfTheEnd && /* @__PURE__ */ jsx(Fragment, {}),
        !beginOfTheBegin && !endOfTheBegin && endOfTheEnd && beginOfTheEnd && /* @__PURE__ */ jsx(Period, { name: intervalLabel[0], variant: "unknown" }),
        endOfTheBegin && /* @__PURE__ */ jsx(
          Period,
          {
            start: beginOfTheBegin,
            end: endOfTheBegin,
            name: `${intervalLabel[0]} start`
          }
        ),
        beginOfTheBegin && endOfTheEnd && !endOfTheBegin && !beginOfTheEnd && /* @__PURE__ */ jsx(
          Period,
          {
            start: beginOfTheBegin,
            end: endOfTheEnd,
            name: boxLabel ?? "certain",
            variant: "certain"
          }
        ),
        beginOfTheBegin && endOfTheBegin && beginOfTheEnd && endOfTheEnd && /* @__PURE__ */ jsx(Period, { name: boxLabel ?? "certain", variant: "certain" }),
        beginOfTheEnd && /* @__PURE__ */ jsx(Period, { start: beginOfTheEnd, end: endOfTheEnd, name: `${intervalLabel[1]} end` }),
        beginOfTheBegin && endOfTheBegin && !endOfTheEnd && !beginOfTheEnd && /* @__PURE__ */ jsx(Period, { name: intervalLabel[1], variant: "unknown" })
      ]
    }
  ) : /* @__PURE__ */ jsx(
    Flex,
    {
      direction: "row",
      justify: "center",
      align: "center",
      marginTop: 1,
      width: "100%",
      style: {
        fontSize: "12px",
        borderBlockEnd: "1px dashed #aaa",
        position: "relative",
        height: "15px"
      },
      children: /* @__PURE__ */ jsx(
        Box,
        {
          padding: 2,
          style: {
            ...boxColorScheme,
            borderRadius: "5px",
            position: "absolute",
            top: "-1px"
          },
          children: "No EDTF value or invalid value"
        }
      )
    }
  ) });
}
const getDateFromDateTime = (unix) => format(
  new TZDate(fromUnixTime(unix / 1e3), "UTC"),
  "yyyy-MM-dd'T'HH:mm:ss.SSS'Z'"
), getDateFromDate = (unix) => format(fromUnixTime(unix / 1e3), "yyyy-MM-dd'T'HH:mm:ss.SSS'Z'"), mapEDTF = (edtf2) => {
  const intervalBeginOfTheBegin = edtf2.lower?.min ? {
    value: getDateFromDateTime(edtf2.lower?.min),
    path: ["beginOfTheBegin"]
  } : null, intervalEndOfTheBegin = edtf2.lower?.max ? {
    value: getDateFromDateTime(edtf2.lower?.max),
    path: ["endOfTheBegin"]
  } : null, intervalBeginOfTheEnd = edtf2.upper?.min ? {
    value: getDateFromDateTime(edtf2.upper?.min),
    path: ["beginOfTheEnd"]
  } : null, intervalEndOfTheEnd = edtf2.upper?.max ? {
    value: getDateFromDateTime(edtf2.upper?.max),
    path: ["endOfTheEnd"]
  } : null, beginOfTheBegin = edtf2.min && edtf2.min != edtf2.max ? {
    value: getDateFromDateTime(edtf2.min),
    path: ["beginOfTheBegin"]
  } : null, date = edtf2.min && edtf2.min === edtf2.max ? {
    value: getDateFromDate(edtf2.min),
    path: ["date"]
  } : null, endOfTheEnd = edtf2.max && edtf2.min != edtf2.max ? {
    value: getDateFromDateTime(edtf2.max),
    path: ["endOfTheEnd"]
  } : null;
  return [
    intervalBeginOfTheBegin ?? beginOfTheBegin,
    intervalEndOfTheBegin,
    date,
    intervalBeginOfTheEnd,
    intervalEndOfTheEnd ?? endOfTheEnd
  ].filter(Boolean);
};
function TimespanInput(props) {
  const { value, members, onChange, renderField, renderInput, renderItem, renderPreview } = props, previousEdtf = useRef(value?.edtf), edtfMember = members.find(
    (member) => member.kind === "field" && member.name === "edtf"
  );
  useEffect(
    () => {
      if (value?.edtf) {
        if (value.edtf !== previousEdtf.current) {
          let edtfValue;
          try {
            edtfValue = edtf(value.edtf);
            const timespanPatches = mapEDTF(edtfValue)?.map((e) => set(e.value, e.path));
            if (edtfValue.isEDTF) {
              const patches = [
                unset(["beginOfTheBegin"]),
                unset(["endOfTheBegin"]),
                unset(["beginOfTheEnd"]),
                unset(["endOfTheEnd"]),
                unset(["date"]),
                set(value.edtf, ["edtf"]),
                ...timespanPatches
              ];
              value._type || patches.unshift(set("Timespan", ["_type"])), onChange(patches);
            }
          } catch {
            value._type && onChange([
              unset(["beginOfTheBegin"]),
              unset(["endOfTheBegin"]),
              unset(["beginOfTheEnd"]),
              unset(["endOfTheEnd"]),
              unset(["date"])
            ]);
          }
        }
        previousEdtf.current = value?.edtf;
      }
    },
    // eslint-disable-next-line react-hooks/exhaustive-deps
    [value?._type, value?.edtf]
  ), useEffect(
    () => {
      value?._type && !value?.edtf && onChange([unset()]);
    },
    // eslint-disable-next-line react-hooks/exhaustive-deps
    [value]
  );
  const customRenderInput = useCallback(
    (renderInputCallbackProps) => /* @__PURE__ */ jsxs(Stack, { children: [
      /* @__PURE__ */ jsx(Card, { children: renderInput(renderInputCallbackProps) }),
      value && /* @__PURE__ */ jsx(Preview, { value })
    ] }),
    [renderInput, value]
  );
  return /* @__PURE__ */ jsx(Stack, { space: 2, children: edtfMember && /* @__PURE__ */ jsx(
    MemberField,
    {
      member: edtfMember,
      renderInput: customRenderInput,
      renderField,
      renderItem,
      renderPreview
    }
  ) });
}
var __assign = function() {
  return __assign = Object.assign || function(t) {
    for (var s, i = 1, n = arguments.length; i < n; i++) {
      s = arguments[i];
      for (var p in s) Object.prototype.hasOwnProperty.call(s, p) && (t[p] = s[p]);
    }
    return t;
  }, __assign.apply(this, arguments);
};
function __spreadArray(to, from2, pack) {
  if (pack || arguments.length === 2) for (var i = 0, l = from2.length, ar; i < l; i++)
    (ar || !(i in from2)) && (ar || (ar = Array.prototype.slice.call(from2, 0, i)), ar[i] = from2[i]);
  return to.concat(ar || Array.prototype.slice.call(from2));
}
function memoize(fn) {
  var cache = /* @__PURE__ */ Object.create(null);
  return function(arg) {
    return cache[arg] === void 0 && (cache[arg] = fn(arg)), cache[arg];
  };
}
var reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|disableRemotePlayback|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/, isPropValid = /* @__PURE__ */ memoize(
  function(prop) {
    return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111 && prop.charCodeAt(1) === 110 && prop.charCodeAt(2) < 91;
  }
  /* Z+1 */
), MS = "-ms-", MOZ = "-moz-", WEBKIT = "-webkit-", COMMENT = "comm", RULESET = "rule", DECLARATION = "decl", IMPORT = "@import", KEYFRAMES = "@keyframes", LAYER = "@layer", abs = Math.abs, from = String.fromCharCode, assign = Object.assign;
function hash(value, length2) {
  return charat(value, 0) ^ 45 ? (((length2 << 2 ^ charat(value, 0)) << 2 ^ charat(value, 1)) << 2 ^ charat(value, 2)) << 2 ^ charat(value, 3) : 0;
}
function trim(value) {
  return value.trim();
}
function match(value, pattern) {
  return (value = pattern.exec(value)) ? value[0] : value;
}
function replace(value, pattern, replacement) {
  return value.replace(pattern, replacement);
}
function indexof(value, search, position2) {
  return value.indexOf(search, position2);
}
function charat(value, index) {
  return value.charCodeAt(index) | 0;
}
function substr(value, begin, end) {
  return value.slice(begin, end);
}
function strlen(value) {
  return value.length;
}
function sizeof(value) {
  return value.length;
}
function append(value, array) {
  return array.push(value), value;
}
function combine(array, callback) {
  return array.map(callback).join("");
}
function filter(array, pattern) {
  return array.filter(function(value) {
    return !match(value, pattern);
  });
}
var line = 1, column = 1, length = 0, position = 0, character = 0, characters = "";
function node(value, root, parent, type, props, children, length2, siblings) {
  return { value, root, parent, type, props, children, line, column, length: length2, return: "", siblings };
}
function copy(root, props) {
  return assign(node("", null, null, "", null, null, 0, root.siblings), root, { length: -root.length }, props);
}
function lift(root) {
  for (; root.root; )
    root = copy(root.root, { children: [root] });
  append(root, root.siblings);
}
function char() {
  return character;
}
function prev() {
  return character = position > 0 ? charat(characters, --position) : 0, column--, character === 10 && (column = 1, line--), character;
}
function next() {
  return character = position < length ? charat(characters, position++) : 0, column++, character === 10 && (column = 1, line++), character;
}
function peek() {
  return charat(characters, position);
}
function caret() {
  return position;
}
function slice(begin, end) {
  return substr(characters, begin, end);
}
function token(type) {
  switch (type) {
    // \0 \t \n \r \s whitespace token
    case 0:
    case 9:
    case 10:
    case 13:
    case 32:
      return 5;
    // ! + , / > @ ~ isolate token
    case 33:
    case 43:
    case 44:
    case 47:
    case 62:
    case 64:
    case 126:
    // ; { } breakpoint token
    case 59:
    case 123:
    case 125:
      return 4;
    // : accompanied token
    case 58:
      return 3;
    // " ' ( [ opening delimit token
    case 34:
    case 39:
    case 40:
    case 91:
      return 2;
    // ) ] closing delimit token
    case 41:
    case 93:
      return 1;
  }
  return 0;
}
function alloc(value) {
  return line = column = 1, length = strlen(characters = value), position = 0, [];
}
function dealloc(value) {
  return characters = "", value;
}
function delimit(type) {
  return trim(slice(position - 1, delimiter(type === 91 ? type + 2 : type === 40 ? type + 1 : type)));
}
function whitespace(type) {
  for (; (character = peek()) && character < 33; )
    next();
  return token(type) > 2 || token(character) > 3 ? "" : " ";
}
function escaping(index, count) {
  for (; --count && next() && !(character < 48 || character > 102 || character > 57 && character < 65 || character > 70 && character < 97); )
    ;
  return slice(index, caret() + (count < 6 && peek() == 32 && next() == 32));
}
function delimiter(type) {
  for (; next(); )
    switch (character) {
      // ] ) " '
      case type:
        return position;
      // " '
      case 34:
      case 39:
        type !== 34 && type !== 39 && delimiter(character);
        break;
      // (
      case 40:
        type === 41 && delimiter(type);
        break;
      // \
      case 92:
        next();
        break;
    }
  return position;
}
function commenter(type, index) {
  for (; next() && type + character !== 57; )
    if (type + character === 84 && peek() === 47)
      break;
  return "/*" + slice(index, position - 1) + "*" + from(type === 47 ? type : next());
}
function identifier(index) {
  for (; !token(peek()); )
    next();
  return slice(index, position);
}
function compile(value) {
  return dealloc(parse("", null, null, null, [""], value = alloc(value), 0, [0], value));
}
function parse(value, root, parent, rule, rules, rulesets, pseudo, points, declarations) {
  for (var index = 0, offset = 0, length2 = pseudo, atrule = 0, property = 0, previous = 0, variable = 1, scanning = 1, ampersand = 1, character2 = 0, type = "", props = rules, children = rulesets, reference = rule, characters2 = type; scanning; )
    switch (previous = character2, character2 = next()) {
      // (
      case 40:
        if (previous != 108 && charat(characters2, length2 - 1) == 58) {
          indexof(characters2 += replace(delimit(character2), "&", "&\f"), "&\f", abs(index ? points[index - 1] : 0)) != -1 && (ampersand = -1);
          break;
        }
      // " ' [
      case 34:
      case 39:
      case 91:
        characters2 += delimit(character2);
        break;
      // \t \n \r \s
      case 9:
      case 10:
      case 13:
      case 32:
        characters2 += whitespace(previous);
        break;
      // \
      case 92:
        characters2 += escaping(caret() - 1, 7);
        continue;
      // /
      case 47:
        switch (peek()) {
          case 42:
          case 47:
            append(comment(commenter(next(), caret()), root, parent, declarations), declarations);
            break;
          default:
            characters2 += "/";
        }
        break;
      // {
      case 123 * variable:
        points[index++] = strlen(characters2) * ampersand;
      // } ; \0
      case 125 * variable:
      case 59:
      case 0:
        switch (character2) {
          // \0 }
          case 0:
          case 125:
            scanning = 0;
          // ;
          case 59 + offset:
            ampersand == -1 && (characters2 = replace(characters2, /\f/g, "")), property > 0 && strlen(characters2) - length2 && append(property > 32 ? declaration(characters2 + ";", rule, parent, length2 - 1, declarations) : declaration(replace(characters2, " ", "") + ";", rule, parent, length2 - 2, declarations), declarations);
            break;
          // @ ;
          case 59:
            characters2 += ";";
          // { rule/at-rule
          default:
            if (append(reference = ruleset(characters2, root, parent, index, offset, rules, points, type, props = [], children = [], length2, rulesets), rulesets), character2 === 123)
              if (offset === 0)
                parse(characters2, root, reference, reference, props, rulesets, length2, points, children);
              else
                switch (atrule === 99 && charat(characters2, 3) === 110 ? 100 : atrule) {
                  // d l m s
                  case 100:
                  case 108:
                  case 109:
                  case 115:
                    parse(value, reference, reference, rule && append(ruleset(value, reference, reference, 0, 0, rules, points, type, rules, props = [], length2, children), children), rules, children, length2, points, rule ? props : children);
                    break;
                  default:
                    parse(characters2, reference, reference, reference, [""], children, 0, points, children);
                }
        }
        index = offset = property = 0, variable = ampersand = 1, type = characters2 = "", length2 = pseudo;
        break;
      // :
      case 58:
        length2 = 1 + strlen(characters2), property = previous;
      default:
        if (variable < 1) {
          if (character2 == 123)
            --variable;
          else if (character2 == 125 && variable++ == 0 && prev() == 125)
            continue;
        }
        switch (characters2 += from(character2), character2 * variable) {
          // &
          case 38:
            ampersand = offset > 0 ? 1 : (characters2 += "\f", -1);
            break;
          // ,
          case 44:
            points[index++] = (strlen(characters2) - 1) * ampersand, ampersand = 1;
            break;
          // @
          case 64:
            peek() === 45 && (characters2 += delimit(next())), atrule = peek(), offset = length2 = strlen(type = characters2 += identifier(caret())), character2++;
            break;
          // -
          case 45:
            previous === 45 && strlen(characters2) == 2 && (variable = 0);
        }
    }
  return rulesets;
}
function ruleset(value, root, parent, index, offset, rules, points, type, props, children, length2, siblings) {
  for (var post = offset - 1, rule = offset === 0 ? rules : [""], size = sizeof(rule), i = 0, j2 = 0, k2 = 0; i < index; ++i)
    for (var x2 = 0, y2 = substr(value, post + 1, post = abs(j2 = points[i])), z2 = value; x2 < size; ++x2)
      (z2 = trim(j2 > 0 ? rule[x2] + " " + y2 : replace(y2, /&\f/g, rule[x2]))) && (props[k2++] = z2);
  return node(value, root, parent, offset === 0 ? RULESET : type, props, children, length2, siblings);
}
function comment(value, root, parent, siblings) {
  return node(value, root, parent, COMMENT, from(char()), substr(value, 2, -2), 0, siblings);
}
function declaration(value, root, parent, length2, siblings) {
  return node(value, root, parent, DECLARATION, substr(value, 0, length2), substr(value, length2 + 1, -1), length2, siblings);
}
function prefix(value, length2, children) {
  switch (hash(value, length2)) {
    // color-adjust
    case 5103:
      return WEBKIT + "print-" + value + value;
    // animation, animation-(delay|direction|duration|fill-mode|iteration-count|name|play-state|timing-function)
    case 5737:
    case 4201:
    case 3177:
    case 3433:
    case 1641:
    case 4457:
    case 2921:
    // text-decoration, filter, clip-path, backface-visibility, column, box-decoration-break
    case 5572:
    case 6356:
    case 5844:
    case 3191:
    case 6645:
    case 3005:
    // mask, mask-image, mask-(mode|clip|size), mask-(repeat|origin), mask-position, mask-composite,
    case 6391:
    case 5879:
    case 5623:
    case 6135:
    case 4599:
    case 4855:
    // background-clip, columns, column-(count|fill|gap|rule|rule-color|rule-style|rule-width|span|width)
    case 4215:
    case 6389:
    case 5109:
    case 5365:
    case 5621:
    case 3829:
      return WEBKIT + value + value;
    // tab-size
    case 4789:
      return MOZ + value + value;
    // appearance, user-select, transform, hyphens, text-size-adjust
    case 5349:
    case 4246:
    case 4810:
    case 6968:
    case 2756:
      return WEBKIT + value + MOZ + value + MS + value + value;
    // writing-mode
    case 5936:
      switch (charat(value, length2 + 11)) {
        // vertical-l(r)
        case 114:
          return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, "tb") + value;
        // vertical-r(l)
        case 108:
          return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, "tb-rl") + value;
        // horizontal(-)tb
        case 45:
          return WEBKIT + value + MS + replace(value, /[svh]\w+-[tblr]{2}/, "lr") + value;
      }
    // flex, flex-direction, scroll-snap-type, writing-mode
    case 6828:
    case 4268:
    case 2903:
      return WEBKIT + value + MS + value + value;
    // order
    case 6165:
      return WEBKIT + value + MS + "flex-" + value + value;
    // align-items
    case 5187:
      return WEBKIT + value + replace(value, /(\w+).+(:[^]+)/, WEBKIT + "box-$1$2" + MS + "flex-$1$2") + value;
    // align-self
    case 5443:
      return WEBKIT + value + MS + "flex-item-" + replace(value, /flex-|-self/g, "") + (match(value, /flex-|baseline/) ? "" : MS + "grid-row-" + replace(value, /flex-|-self/g, "")) + value;
    // align-content
    case 4675:
      return WEBKIT + value + MS + "flex-line-pack" + replace(value, /align-content|flex-|-self/g, "") + value;
    // flex-shrink
    case 5548:
      return WEBKIT + value + MS + replace(value, "shrink", "negative") + value;
    // flex-basis
    case 5292:
      return WEBKIT + value + MS + replace(value, "basis", "preferred-size") + value;
    // flex-grow
    case 6060:
      return WEBKIT + "box-" + replace(value, "-grow", "") + WEBKIT + value + MS + replace(value, "grow", "positive") + value;
    // transition
    case 4554:
      return WEBKIT + replace(value, /([^-])(transform)/g, "$1" + WEBKIT + "$2") + value;
    // cursor
    case 6187:
      return replace(replace(replace(value, /(zoom-|grab)/, WEBKIT + "$1"), /(image-set)/, WEBKIT + "$1"), value, "") + value;
    // background, background-image
    case 5495:
    case 3959:
      return replace(value, /(image-set\([^]*)/, WEBKIT + "$1$`$1");
    // justify-content
    case 4968:
      return replace(replace(value, /(.+:)(flex-)?(.*)/, WEBKIT + "box-pack:$3" + MS + "flex-pack:$3"), /s.+-b[^;]+/, "justify") + WEBKIT + value + value;
    // justify-self
    case 4200:
      if (!match(value, /flex-|baseline/)) return MS + "grid-column-align" + substr(value, length2) + value;
      break;
    // grid-template-(columns|rows)
    case 2592:
    case 3360:
      return MS + replace(value, "template-", "") + value;
    // grid-(row|column)-start
    case 4384:
    case 3616:
      return children && children.some(function(element, index) {
        return length2 = index, match(element.props, /grid-\w+-end/);
      }) ? ~indexof(value + (children = children[length2].value), "span", 0) ? value : MS + replace(value, "-start", "") + value + MS + "grid-row-span:" + (~indexof(children, "span", 0) ? match(children, /\d+/) : +match(children, /\d+/) - +match(value, /\d+/)) + ";" : MS + replace(value, "-start", "") + value;
    // grid-(row|column)-end
    case 4896:
    case 4128:
      return children && children.some(function(element) {
        return match(element.props, /grid-\w+-start/);
      }) ? value : MS + replace(replace(value, "-end", "-span"), "span ", "") + value;
    // (margin|padding)-inline-(start|end)
    case 4095:
    case 3583:
    case 4068:
    case 2532:
      return replace(value, /(.+)-inline(.+)/, WEBKIT + "$1$2") + value;
    // (min|max)?(width|height|inline-size|block-size)
    case 8116:
    case 7059:
    case 5753:
    case 5535:
    case 5445:
    case 5701:
    case 4933:
    case 4677:
    case 5533:
    case 5789:
    case 5021:
    case 4765:
      if (strlen(value) - 1 - length2 > 6)
        switch (charat(value, length2 + 1)) {
          // (m)ax-content, (m)in-content
          case 109:
            if (charat(value, length2 + 4) !== 45)
              break;
          // (f)ill-available, (f)it-content
          case 102:
            return replace(value, /(.+:)(.+)-([^]+)/, "$1" + WEBKIT + "$2-$3$1" + MOZ + (charat(value, length2 + 3) == 108 ? "$3" : "$2-$3")) + value;
          // (s)tretch
          case 115:
            return ~indexof(value, "stretch", 0) ? prefix(replace(value, "stretch", "fill-available"), length2, children) + value : value;
        }
      break;
    // grid-(column|row)
    case 5152:
    case 5920:
      return replace(value, /(.+?):(\d+)(\s*\/\s*(span)?\s*(\d+))?(.*)/, function(_2, a, b, c, d, e, f2) {
        return MS + a + ":" + b + f2 + (c ? MS + a + "-span:" + (d ? e : +e - +b) + f2 : "") + value;
      });
    // position: sticky
    case 4949:
      if (charat(value, length2 + 6) === 121)
        return replace(value, ":", ":" + WEBKIT) + value;
      break;
    // display: (flex|inline-flex|grid|inline-grid)
    case 6444:
      switch (charat(value, charat(value, 14) === 45 ? 18 : 11)) {
        // (inline-)?fle(x)
        case 120:
          return replace(value, /(.+:)([^;\s!]+)(;|(\s+)?!.+)?/, "$1" + WEBKIT + (charat(value, 14) === 45 ? "inline-" : "") + "box$3$1" + WEBKIT + "$2$3$1" + MS + "$2box$3") + value;
        // (inline-)?gri(d)
        case 100:
          return replace(value, ":", ":" + MS) + value;
      }
      break;
    // scroll-margin, scroll-margin-(top|right|bottom|left)
    case 5719:
    case 2647:
    case 2135:
    case 3927:
    case 2391:
      return replace(value, "scroll-", "scroll-snap-") + value;
  }
  return value;
}
function serialize(children, callback) {
  for (var output = "", i = 0; i < children.length; i++)
    output += callback(children[i], i, children, callback) || "";
  return output;
}
function stringify(element, index, children, callback) {
  switch (element.type) {
    case LAYER:
      if (element.children.length) break;
    case IMPORT:
    case DECLARATION:
      return element.return = element.return || element.value;
    case COMMENT:
      return "";
    case KEYFRAMES:
      return element.return = element.value + "{" + serialize(element.children, callback) + "}";
    case RULESET:
      if (!strlen(element.value = element.props.join(","))) return "";
  }
  return strlen(children = serialize(element.children, callback)) ? element.return = element.value + "{" + children + "}" : "";
}
function middleware(collection) {
  var length2 = sizeof(collection);
  return function(element, index, children, callback) {
    for (var output = "", i = 0; i < length2; i++)
      output += collection[i](element, index, children, callback) || "";
    return output;
  };
}
function rulesheet(callback) {
  return function(element) {
    element.root || (element = element.return) && callback(element);
  };
}
function prefixer(element, index, children, callback) {
  if (element.length > -1 && !element.return)
    switch (element.type) {
      case DECLARATION:
        element.return = prefix(element.value, element.length, children);
        return;
      case KEYFRAMES:
        return serialize([copy(element, { value: replace(element.value, "@", "@" + WEBKIT) })], callback);
      case RULESET:
        if (element.length)
          return combine(children = element.props, function(value) {
            switch (match(value, callback = /(::plac\w+|:read-\w+)/)) {
              // :read-(only|write)
              case ":read-only":
              case ":read-write":
                lift(copy(element, { props: [replace(value, /:(read-\w+)/, ":" + MOZ + "$1")] })), lift(copy(element, { props: [value] })), assign(element, { props: filter(children, callback) });
                break;
              // :placeholder
              case "::placeholder":
                lift(copy(element, { props: [replace(value, /:(plac\w+)/, ":" + WEBKIT + "input-$1")] })), lift(copy(element, { props: [replace(value, /:(plac\w+)/, ":" + MOZ + "$1")] })), lift(copy(element, { props: [replace(value, /:(plac\w+)/, MS + "input-$1")] })), lift(copy(element, { props: [value] })), assign(element, { props: filter(children, callback) });
                break;
            }
            return "";
          });
    }
}
var unitlessKeys = {
  animationIterationCount: 1,
  aspectRatio: 1,
  borderImageOutset: 1,
  borderImageSlice: 1,
  borderImageWidth: 1,
  boxFlex: 1,
  boxFlexGroup: 1,
  boxOrdinalGroup: 1,
  columnCount: 1,
  columns: 1,
  flex: 1,
  flexGrow: 1,
  flexPositive: 1,
  flexShrink: 1,
  flexNegative: 1,
  flexOrder: 1,
  gridRow: 1,
  gridRowEnd: 1,
  gridRowSpan: 1,
  gridRowStart: 1,
  gridColumn: 1,
  gridColumnEnd: 1,
  gridColumnSpan: 1,
  gridColumnStart: 1,
  msGridRow: 1,
  msGridRowSpan: 1,
  msGridColumn: 1,
  msGridColumnSpan: 1,
  fontWeight: 1,
  lineHeight: 1,
  opacity: 1,
  order: 1,
  orphans: 1,
  tabSize: 1,
  widows: 1,
  zIndex: 1,
  zoom: 1,
  WebkitLineClamp: 1,
  // SVG-related properties
  fillOpacity: 1,
  floodOpacity: 1,
  stopOpacity: 1,
  strokeDasharray: 1,
  strokeDashoffset: 1,
  strokeMiterlimit: 1,
  strokeOpacity: 1,
  strokeWidth: 1
}, f = typeof process < "u" && process.env !== void 0 && (process.env.REACT_APP_SC_ATTR || process.env.SC_ATTR) || "data-styled", m = "active", y = "data-styled-version", v = "6.1.13", g = `/*!sc*/
`, S = typeof window < "u" && "HTMLElement" in window, w = !!(typeof SC_DISABLE_SPEEDY == "boolean" ? SC_DISABLE_SPEEDY : typeof process < "u" && process.env !== void 0 && process.env.REACT_APP_SC_DISABLE_SPEEDY !== void 0 && process.env.REACT_APP_SC_DISABLE_SPEEDY !== "" ? process.env.REACT_APP_SC_DISABLE_SPEEDY !== "false" && process.env.REACT_APP_SC_DISABLE_SPEEDY : typeof process < "u" && process.env !== void 0 && process.env.SC_DISABLE_SPEEDY !== void 0 && process.env.SC_DISABLE_SPEEDY !== "" ? process.env.SC_DISABLE_SPEEDY !== "false" && process.env.SC_DISABLE_SPEEDY : process.env.NODE_ENV !== "production"), E = /invalid hook call/i, N = /* @__PURE__ */ new Set(), P = function(t, n) {
  if (process.env.NODE_ENV !== "production") {
    var r2 = n ? ' with the id of "'.concat(n, '"') : "", s = "The component ".concat(t).concat(r2, ` has been created dynamically.
`) + `You may see this warning because you've called styled inside another component.
To resolve this only create new StyledComponents outside of any render method and function component.`, i = console.error;
    try {
      var a = !0;
      console.error = function(t2) {
        for (var n2 = [], r3 = 1; r3 < arguments.length; r3++) n2[r3 - 1] = arguments[r3];
        E.test(t2) ? (a = !1, N.delete(s)) : i.apply(void 0, __spreadArray([t2], n2, !1));
      }, useRef(), a && !N.has(s) && (console.warn(s), N.add(s));
    } catch (e) {
      E.test(e.message) && N.delete(s);
    } finally {
      console.error = i;
    }
  }
}, _ = Object.freeze([]), C = Object.freeze({});
function I(e, t, n) {
  return n === void 0 && (n = C), e.theme !== n.theme && e.theme || t || n.theme;
}
var A = /* @__PURE__ */ new Set(["a", "abbr", "address", "area", "article", "aside", "audio", "b", "base", "bdi", "bdo", "big", "blockquote", "body", "br", "button", "canvas", "caption", "cite", "code", "col", "colgroup", "data", "datalist", "dd", "del", "details", "dfn", "dialog", "div", "dl", "dt", "em", "embed", "fieldset", "figcaption", "figure", "footer", "form", "h1", "h2", "h3", "h4", "h5", "h6", "header", "hgroup", "hr", "html", "i", "iframe", "img", "input", "ins", "kbd", "keygen", "label", "legend", "li", "link", "main", "map", "mark", "menu", "menuitem", "meta", "meter", "nav", "noscript", "object", "ol", "optgroup", "option", "output", "p", "param", "picture", "pre", "progress", "q", "rp", "rt", "ruby", "s", "samp", "script", "section", "select", "small", "source", "span", "strong", "style", "sub", "summary", "sup", "table", "tbody", "td", "textarea", "tfoot", "th", "thead", "time", "tr", "track", "u", "ul", "use", "var", "video", "wbr", "circle", "clipPath", "defs", "ellipse", "foreignObject", "g", "image", "line", "linearGradient", "marker", "mask", "path", "pattern", "polygon", "polyline", "radialGradient", "rect", "stop", "svg", "text", "tspan"]), O = /[!"#$%&'()*+,./:;<=>?@[\\\]^`{|}~-]+/g, D = /(^-|-$)/g;
function R(e) {
  return e.replace(O, "-").replace(D, "");
}
var T = /(a)(d)/gi, k = 52, j = function(e) {
  return String.fromCharCode(e + (e > 25 ? 39 : 97));
};
function x(e) {
  var t, n = "";
  for (t = Math.abs(e); t > k; t = t / k | 0) n = j(t % k) + n;
  return (j(t % k) + n).replace(T, "$1-$2");
}
var V, F = 5381, M = function(e, t) {
  for (var n = t.length; n; ) e = 33 * e ^ t.charCodeAt(--n);
  return e;
}, z = function(e) {
  return M(F, e);
};
function $(e) {
  return x(z(e) >>> 0);
}
function B(e) {
  return process.env.NODE_ENV !== "production" && typeof e == "string" && e || e.displayName || e.name || "Component";
}
function L(e) {
  return typeof e == "string" && (process.env.NODE_ENV === "production" || e.charAt(0) === e.charAt(0).toLowerCase());
}
var G = typeof Symbol == "function" && Symbol.for, Y = G ? Symbol.for("react.memo") : 60115, q = G ? Symbol.for("react.forward_ref") : 60112, W = { childContextTypes: !0, contextType: !0, contextTypes: !0, defaultProps: !0, displayName: !0, getDefaultProps: !0, getDerivedStateFromError: !0, getDerivedStateFromProps: !0, mixins: !0, propTypes: !0, type: !0 }, H = { name: !0, length: !0, prototype: !0, caller: !0, callee: !0, arguments: !0, arity: !0 }, U = { $$typeof: !0, compare: !0, defaultProps: !0, displayName: !0, propTypes: !0, type: !0 }, J = ((V = {})[q] = { $$typeof: !0, render: !0, defaultProps: !0, displayName: !0, propTypes: !0 }, V[Y] = U, V);
function X(e) {
  return ("type" in (t = e) && t.type.$$typeof) === Y ? U : "$$typeof" in e ? J[e.$$typeof] : W;
  var t;
}
var Z = Object.defineProperty, K = Object.getOwnPropertyNames, Q = Object.getOwnPropertySymbols, ee = Object.getOwnPropertyDescriptor, te = Object.getPrototypeOf, ne = Object.prototype;
function re(e, t, n) {
  if (typeof t != "string") {
    if (ne) {
      var r2 = te(t);
      r2 && r2 !== ne && re(e, r2, n);
    }
    var o = K(t);
    Q && (o = o.concat(Q(t)));
    for (var s = X(e), i = X(t), a = 0; a < o.length; ++a) {
      var c = o[a];
      if (!(c in H || n && n[c] || i && c in i || s && c in s)) {
        var l = ee(t, c);
        try {
          Z(e, c, l);
        } catch {
        }
      }
    }
  }
  return e;
}
function oe(e) {
  return typeof e == "function";
}
function se(e) {
  return typeof e == "object" && "styledComponentId" in e;
}
function ie(e, t) {
  return e && t ? "".concat(e, " ").concat(t) : e || t || "";
}
function ae(e, t) {
  if (e.length === 0) return "";
  for (var n = e[0], r2 = 1; r2 < e.length; r2++) n += e[r2];
  return n;
}
function ce(e) {
  return e !== null && typeof e == "object" && e.constructor.name === Object.name && !("props" in e && e.$$typeof);
}
function le(e, t, n) {
  if (n === void 0 && (n = !1), !n && !ce(e) && !Array.isArray(e)) return t;
  if (Array.isArray(t)) for (var r2 = 0; r2 < t.length; r2++) e[r2] = le(e[r2], t[r2]);
  else if (ce(t)) for (var r2 in t) e[r2] = le(e[r2], t[r2]);
  return e;
}
function ue(e, t) {
  Object.defineProperty(e, "toString", { value: t });
}
var pe = process.env.NODE_ENV !== "production" ? { 1: `Cannot create styled-component for component: %s.

`, 2: `Can't collect styles once you've consumed a \`ServerStyleSheet\`'s styles! \`ServerStyleSheet\` is a one off instance for each server-side render cycle.

- Are you trying to reuse it across renders?
- Are you accidentally calling collectStyles twice?

`, 3: `Streaming SSR is only supported in a Node.js environment; Please do not try to call this method in the browser.

`, 4: `The \`StyleSheetManager\` expects a valid target or sheet prop!

- Does this error occur on the client and is your target falsy?
- Does this error occur on the server and is the sheet falsy?

`, 5: `The clone method cannot be used on the client!

- Are you running in a client-like environment on the server?
- Are you trying to run SSR on the client?

`, 6: `Trying to insert a new style tag, but the given Node is unmounted!

- Are you using a custom target that isn't mounted?
- Does your document not have a valid head element?
- Have you accidentally removed a style tag manually?

`, 7: 'ThemeProvider: Please return an object from your "theme" prop function, e.g.\n\n```js\ntheme={() => ({})}\n```\n\n', 8: `ThemeProvider: Please make your "theme" prop an object.

`, 9: "Missing document `<head>`\n\n", 10: `Cannot find a StyleSheet instance. Usually this happens if there are multiple copies of styled-components loaded at once. Check out this issue for how to troubleshoot and fix the common cases where this situation can happen: https://github.com/styled-components/styled-components/issues/1941#issuecomment-417862021

`, 11: `_This error was replaced with a dev-time warning, it will be deleted for v4 final._ [createGlobalStyle] received children which will not be rendered. Please use the component without passing children elements.

`, 12: "It seems you are interpolating a keyframe declaration (%s) into an untagged string. This was supported in styled-components v3, but is not longer supported in v4 as keyframes are now injected on-demand. Please wrap your string in the css\\`\\` helper which ensures the styles are injected correctly. See https://www.styled-components.com/docs/api#css\n\n", 13: `%s is not a styled component and cannot be referred to via component selector. See https://www.styled-components.com/docs/advanced#referring-to-other-components for more details.

`, 14: `ThemeProvider: "theme" prop is required.

`, 15: "A stylis plugin has been supplied that is not named. We need a name for each plugin to be able to prevent styling collisions between different stylis configurations within the same app. Before you pass your plugin to `<StyleSheetManager stylisPlugins={[]}>`, please make sure each plugin is uniquely-named, e.g.\n\n```js\nObject.defineProperty(importedPlugin, 'name', { value: 'some-unique-name' });\n```\n\n", 16: `Reached the limit of how many styled components may be created at group %s.
You may only create up to 1,073,741,824 components. If you're creating components dynamically,
as for instance in your render method then you may be running into this limitation.

`, 17: `CSSStyleSheet could not be found on HTMLStyleElement.
Has styled-components' style tag been unmounted or altered by another script?
`, 18: "ThemeProvider: Please make sure your useTheme hook is within a `<ThemeProvider>`" } : {};
function de() {
  for (var e = [], t = 0; t < arguments.length; t++) e[t] = arguments[t];
  for (var n = e[0], r2 = [], o = 1, s = e.length; o < s; o += 1) r2.push(e[o]);
  return r2.forEach(function(e2) {
    n = n.replace(/%[a-z]/, e2);
  }), n;
}
function he(t) {
  for (var n = [], r2 = 1; r2 < arguments.length; r2++) n[r2 - 1] = arguments[r2];
  return process.env.NODE_ENV === "production" ? new Error("An error occurred. See https://github.com/styled-components/styled-components/blob/main/packages/styled-components/src/utils/errors.md#".concat(t, " for more information.").concat(n.length > 0 ? " Args: ".concat(n.join(", ")) : "")) : new Error(de.apply(void 0, __spreadArray([pe[t]], n, !1)).trim());
}
var fe = function() {
  function e(e2) {
    this.groupSizes = new Uint32Array(512), this.length = 512, this.tag = e2;
  }
  return e.prototype.indexOfGroup = function(e2) {
    for (var t = 0, n = 0; n < e2; n++) t += this.groupSizes[n];
    return t;
  }, e.prototype.insertRules = function(e2, t) {
    if (e2 >= this.groupSizes.length) {
      for (var n = this.groupSizes, r2 = n.length, o = r2; e2 >= o; ) if ((o <<= 1) < 0) throw he(16, "".concat(e2));
      this.groupSizes = new Uint32Array(o), this.groupSizes.set(n), this.length = o;
      for (var s = r2; s < o; s++) this.groupSizes[s] = 0;
    }
    for (var i = this.indexOfGroup(e2 + 1), a = (s = 0, t.length); s < a; s++) this.tag.insertRule(i, t[s]) && (this.groupSizes[e2]++, i++);
  }, e.prototype.clearGroup = function(e2) {
    if (e2 < this.length) {
      var t = this.groupSizes[e2], n = this.indexOfGroup(e2), r2 = n + t;
      this.groupSizes[e2] = 0;
      for (var o = n; o < r2; o++) this.tag.deleteRule(n);
    }
  }, e.prototype.getGroup = function(e2) {
    var t = "";
    if (e2 >= this.length || this.groupSizes[e2] === 0) return t;
    for (var n = this.groupSizes[e2], r2 = this.indexOfGroup(e2), o = r2 + n, s = r2; s < o; s++) t += "".concat(this.tag.getRule(s)).concat(g);
    return t;
  }, e;
}(), me = 1 << 30, ye = /* @__PURE__ */ new Map(), ve = /* @__PURE__ */ new Map(), ge = 1, Se = function(e) {
  if (ye.has(e)) return ye.get(e);
  for (; ve.has(ge); ) ge++;
  var t = ge++;
  if (process.env.NODE_ENV !== "production" && ((0 | t) < 0 || t > me)) throw he(16, "".concat(t));
  return ye.set(e, t), ve.set(t, e), t;
}, we = function(e, t) {
  ge = t + 1, ye.set(e, t), ve.set(t, e);
}, be = "style[".concat(f, "][").concat(y, '="').concat(v, '"]'), Ee = new RegExp("^".concat(f, '\\.g(\\d+)\\[id="([\\w\\d-]+)"\\].*?"([^"]*)')), Ne = function(e, t, n) {
  for (var r2, o = n.split(","), s = 0, i = o.length; s < i; s++) (r2 = o[s]) && e.registerName(t, r2);
}, Pe = function(e, t) {
  for (var n, r2 = ((n = t.textContent) !== null && n !== void 0 ? n : "").split(g), o = [], s = 0, i = r2.length; s < i; s++) {
    var a = r2[s].trim();
    if (a) {
      var c = a.match(Ee);
      if (c) {
        var l = 0 | parseInt(c[1], 10), u = c[2];
        l !== 0 && (we(u, l), Ne(e, u, c[3]), e.getTag().insertRules(l, o)), o.length = 0;
      } else o.push(a);
    }
  }
}, _e = function(e) {
  for (var t = document.querySelectorAll(be), n = 0, r2 = t.length; n < r2; n++) {
    var o = t[n];
    o && o.getAttribute(f) !== m && (Pe(e, o), o.parentNode && o.parentNode.removeChild(o));
  }
};
function Ce() {
  return typeof __webpack_nonce__ < "u" ? __webpack_nonce__ : null;
}
var Ie = function(e) {
  var t = document.head, n = e || t, r2 = document.createElement("style"), o = function(e2) {
    var t2 = Array.from(e2.querySelectorAll("style[".concat(f, "]")));
    return t2[t2.length - 1];
  }(n), s = o !== void 0 ? o.nextSibling : null;
  r2.setAttribute(f, m), r2.setAttribute(y, v);
  var i = Ce();
  return i && r2.setAttribute("nonce", i), n.insertBefore(r2, s), r2;
}, Ae = function() {
  function e(e2) {
    this.element = Ie(e2), this.element.appendChild(document.createTextNode("")), this.sheet = function(e3) {
      if (e3.sheet) return e3.sheet;
      for (var t = document.styleSheets, n = 0, r2 = t.length; n < r2; n++) {
        var o = t[n];
        if (o.ownerNode === e3) return o;
      }
      throw he(17);
    }(this.element), this.length = 0;
  }
  return e.prototype.insertRule = function(e2, t) {
    try {
      return this.sheet.insertRule(t, e2), this.length++, !0;
    } catch {
      return !1;
    }
  }, e.prototype.deleteRule = function(e2) {
    this.sheet.deleteRule(e2), this.length--;
  }, e.prototype.getRule = function(e2) {
    var t = this.sheet.cssRules[e2];
    return t && t.cssText ? t.cssText : "";
  }, e;
}(), Oe = function() {
  function e(e2) {
    this.element = Ie(e2), this.nodes = this.element.childNodes, this.length = 0;
  }
  return e.prototype.insertRule = function(e2, t) {
    if (e2 <= this.length && e2 >= 0) {
      var n = document.createTextNode(t);
      return this.element.insertBefore(n, this.nodes[e2] || null), this.length++, !0;
    }
    return !1;
  }, e.prototype.deleteRule = function(e2) {
    this.element.removeChild(this.nodes[e2]), this.length--;
  }, e.prototype.getRule = function(e2) {
    return e2 < this.length ? this.nodes[e2].textContent : "";
  }, e;
}(), De = function() {
  function e(e2) {
    this.rules = [], this.length = 0;
  }
  return e.prototype.insertRule = function(e2, t) {
    return e2 <= this.length && (this.rules.splice(e2, 0, t), this.length++, !0);
  }, e.prototype.deleteRule = function(e2) {
    this.rules.splice(e2, 1), this.length--;
  }, e.prototype.getRule = function(e2) {
    return e2 < this.length ? this.rules[e2] : "";
  }, e;
}(), Re = S, Te = { isServer: !S, useCSSOMInjection: !w }, ke = function() {
  function e(e2, n, r2) {
    e2 === void 0 && (e2 = C), n === void 0 && (n = {});
    var o = this;
    this.options = __assign(__assign({}, Te), e2), this.gs = n, this.names = new Map(r2), this.server = !!e2.isServer, !this.server && S && Re && (Re = !1, _e(this)), ue(this, function() {
      return function(e3) {
        for (var t = e3.getTag(), n2 = t.length, r3 = "", o2 = function(n3) {
          var o3 = function(e4) {
            return ve.get(e4);
          }(n3);
          if (o3 === void 0) return "continue";
          var s2 = e3.names.get(o3), i = t.getGroup(n3);
          if (s2 === void 0 || !s2.size || i.length === 0) return "continue";
          var a = "".concat(f, ".g").concat(n3, '[id="').concat(o3, '"]'), c = "";
          s2 !== void 0 && s2.forEach(function(e4) {
            e4.length > 0 && (c += "".concat(e4, ","));
          }), r3 += "".concat(i).concat(a, '{content:"').concat(c, '"}').concat(g);
        }, s = 0; s < n2; s++) o2(s);
        return r3;
      }(o);
    });
  }
  return e.registerId = function(e2) {
    return Se(e2);
  }, e.prototype.rehydrate = function() {
    !this.server && S && _e(this);
  }, e.prototype.reconstructWithOptions = function(n, r2) {
    return r2 === void 0 && (r2 = !0), new e(__assign(__assign({}, this.options), n), this.gs, r2 && this.names || void 0);
  }, e.prototype.allocateGSInstance = function(e2) {
    return this.gs[e2] = (this.gs[e2] || 0) + 1;
  }, e.prototype.getTag = function() {
    return this.tag || (this.tag = (e2 = function(e3) {
      var t = e3.useCSSOMInjection, n = e3.target;
      return e3.isServer ? new De(n) : t ? new Ae(n) : new Oe(n);
    }(this.options), new fe(e2)));
    var e2;
  }, e.prototype.hasNameForId = function(e2, t) {
    return this.names.has(e2) && this.names.get(e2).has(t);
  }, e.prototype.registerName = function(e2, t) {
    if (Se(e2), this.names.has(e2)) this.names.get(e2).add(t);
    else {
      var n = /* @__PURE__ */ new Set();
      n.add(t), this.names.set(e2, n);
    }
  }, e.prototype.insertRules = function(e2, t, n) {
    this.registerName(e2, t), this.getTag().insertRules(Se(e2), n);
  }, e.prototype.clearNames = function(e2) {
    this.names.has(e2) && this.names.get(e2).clear();
  }, e.prototype.clearRules = function(e2) {
    this.getTag().clearGroup(Se(e2)), this.clearNames(e2);
  }, e.prototype.clearTag = function() {
    this.tag = void 0;
  }, e;
}(), je = /&/g, xe = /^\s*\/\/.*$/gm;
function Ve(e, t) {
  return e.map(function(e2) {
    return e2.type === "rule" && (e2.value = "".concat(t, " ").concat(e2.value), e2.value = e2.value.replaceAll(",", ",".concat(t, " ")), e2.props = e2.props.map(function(e3) {
      return "".concat(t, " ").concat(e3);
    })), Array.isArray(e2.children) && e2.type !== "@keyframes" && (e2.children = Ve(e2.children, t)), e2;
  });
}
function Fe(e) {
  var t, n, r2, o = C, s = o.options, i = s === void 0 ? C : s, a = o.plugins, c = a === void 0 ? _ : a, l = function(e2, r3, o2) {
    return o2.startsWith(n) && o2.endsWith(n) && o2.replaceAll(n, "").length > 0 ? ".".concat(t) : e2;
  }, u = c.slice();
  u.push(function(e2) {
    e2.type === RULESET && e2.value.includes("&") && (e2.props[0] = e2.props[0].replace(je, n).replace(r2, l));
  }), i.prefix && u.push(prefixer), u.push(stringify);
  var p = function(e2, o2, s2, a2) {
    o2 === void 0 && (o2 = ""), s2 === void 0 && (s2 = ""), a2 === void 0 && (a2 = "&"), t = a2, n = o2, r2 = new RegExp("\\".concat(n, "\\b"), "g");
    var c2 = e2.replace(xe, ""), l2 = compile(s2 || o2 ? "".concat(s2, " ").concat(o2, " { ").concat(c2, " }") : c2);
    i.namespace && (l2 = Ve(l2, i.namespace));
    var p2 = [];
    return serialize(l2, middleware(u.concat(rulesheet(function(e3) {
      return p2.push(e3);
    })))), p2;
  };
  return p.hash = c.length ? c.reduce(function(e2, t2) {
    return t2.name || he(15), M(e2, t2.name);
  }, F).toString() : "", p;
}
var Me = new ke(), ze = Fe(), $e = r.createContext({ shouldForwardProp: void 0, styleSheet: Me, stylis: ze });
r.createContext(void 0);
function Ge() {
  return useContext($e);
}
var qe = function() {
  function e(e2, t) {
    var n = this;
    this.inject = function(e3, t2) {
      t2 === void 0 && (t2 = ze);
      var r2 = n.name + t2.hash;
      e3.hasNameForId(n.id, r2) || e3.insertRules(n.id, r2, t2(n.rules, r2, "@keyframes"));
    }, this.name = e2, this.id = "sc-keyframes-".concat(e2), this.rules = t, ue(this, function() {
      throw he(12, String(n.name));
    });
  }
  return e.prototype.getName = function(e2) {
    return e2 === void 0 && (e2 = ze), this.name + e2.hash;
  }, e;
}(), We = function(e) {
  return e >= "A" && e <= "Z";
};
function He(e) {
  for (var t = "", n = 0; n < e.length; n++) {
    var r2 = e[n];
    if (n === 1 && r2 === "-" && e[0] === "-") return e;
    We(r2) ? t += "-" + r2.toLowerCase() : t += r2;
  }
  return t.startsWith("ms-") ? "-" + t : t;
}
var Ue = function(e) {
  return e == null || e === !1 || e === "";
}, Je = function(t) {
  var n, r2, o = [];
  for (var s in t) {
    var i = t[s];
    t.hasOwnProperty(s) && !Ue(i) && (Array.isArray(i) && i.isCss || oe(i) ? o.push("".concat(He(s), ":"), i, ";") : ce(i) ? o.push.apply(o, __spreadArray(__spreadArray(["".concat(s, " {")], Je(i), !1), ["}"], !1)) : o.push("".concat(He(s), ": ").concat((n = s, (r2 = i) == null || typeof r2 == "boolean" || r2 === "" ? "" : typeof r2 != "number" || r2 === 0 || n in unitlessKeys || n.startsWith("--") ? String(r2).trim() : "".concat(r2, "px")), ";")));
  }
  return o;
};
function Xe(e, t, n, r2) {
  if (Ue(e)) return [];
  if (se(e)) return [".".concat(e.styledComponentId)];
  if (oe(e)) {
    if (!oe(s = e) || s.prototype && s.prototype.isReactComponent || !t) return [e];
    var o = e(t);
    return process.env.NODE_ENV === "production" || typeof o != "object" || Array.isArray(o) || o instanceof qe || ce(o) || o === null || console.error("".concat(B(e), " is not a styled component and cannot be referred to via component selector. See https://www.styled-components.com/docs/advanced#referring-to-other-components for more details.")), Xe(o, t, n, r2);
  }
  var s;
  return e instanceof qe ? n ? (e.inject(n, r2), [e.getName(r2)]) : [e] : ce(e) ? Je(e) : Array.isArray(e) ? Array.prototype.concat.apply(_, e.map(function(e2) {
    return Xe(e2, t, n, r2);
  })) : [e.toString()];
}
function Ze(e) {
  for (var t = 0; t < e.length; t += 1) {
    var n = e[t];
    if (oe(n) && !se(n)) return !1;
  }
  return !0;
}
var Ke = z(v), Qe = function() {
  function e(e2, t, n) {
    this.rules = e2, this.staticRulesId = "", this.isStatic = process.env.NODE_ENV === "production" && (n === void 0 || n.isStatic) && Ze(e2), this.componentId = t, this.baseHash = M(Ke, t), this.baseStyle = n, ke.registerId(t);
  }
  return e.prototype.generateAndInjectStyles = function(e2, t, n) {
    var r2 = this.baseStyle ? this.baseStyle.generateAndInjectStyles(e2, t, n) : "";
    if (this.isStatic && !n.hash) if (this.staticRulesId && t.hasNameForId(this.componentId, this.staticRulesId)) r2 = ie(r2, this.staticRulesId);
    else {
      var o = ae(Xe(this.rules, e2, t, n)), s = x(M(this.baseHash, o) >>> 0);
      if (!t.hasNameForId(this.componentId, s)) {
        var i = n(o, ".".concat(s), void 0, this.componentId);
        t.insertRules(this.componentId, s, i);
      }
      r2 = ie(r2, s), this.staticRulesId = s;
    }
    else {
      for (var a = M(this.baseHash, n.hash), c = "", l = 0; l < this.rules.length; l++) {
        var u = this.rules[l];
        if (typeof u == "string") c += u, process.env.NODE_ENV !== "production" && (a = M(a, u));
        else if (u) {
          var p = ae(Xe(u, e2, t, n));
          a = M(a, p + l), c += p;
        }
      }
      if (c) {
        var d = x(a >>> 0);
        t.hasNameForId(this.componentId, d) || t.insertRules(this.componentId, d, n(c, ".".concat(d), void 0, this.componentId)), r2 = ie(r2, d);
      }
    }
    return r2;
  }, e;
}(), et = r.createContext(void 0), ot = {}, st = /* @__PURE__ */ new Set();
function it(e, o, s) {
  var i = se(e), a = e, c = !L(e), p = o.attrs, d = p === void 0 ? _ : p, h = o.componentId, f2 = h === void 0 ? function(e2, t) {
    var n = typeof e2 != "string" ? "sc" : R(e2);
    ot[n] = (ot[n] || 0) + 1;
    var r2 = "".concat(n, "-").concat($(v + n + ot[n]));
    return t ? "".concat(t, "-").concat(r2) : r2;
  }(o.displayName, o.parentComponentId) : h, m2 = o.displayName, y2 = m2 === void 0 ? function(e2) {
    return L(e2) ? "styled.".concat(e2) : "Styled(".concat(B(e2), ")");
  }(e) : m2, g2 = o.displayName && o.componentId ? "".concat(R(o.displayName), "-").concat(o.componentId) : o.componentId || f2, S2 = i && a.attrs ? a.attrs.concat(d).filter(Boolean) : d, w2 = o.shouldForwardProp;
  if (i && a.shouldForwardProp) {
    var b = a.shouldForwardProp;
    if (o.shouldForwardProp) {
      var E2 = o.shouldForwardProp;
      w2 = function(e2, t) {
        return b(e2, t) && E2(e2, t);
      };
    } else w2 = b;
  }
  var N2 = new Qe(s, g2, i ? a.componentStyle : void 0);
  function O2(e2, o2) {
    return function(e3, o3, s2) {
      var i2 = e3.attrs, a2 = e3.componentStyle, c2 = e3.defaultProps, p2 = e3.foldedComponentIds, d2 = e3.styledComponentId, h2 = e3.target, f3 = r.useContext(et), m3 = Ge(), y3 = e3.shouldForwardProp || m3.shouldForwardProp;
      process.env.NODE_ENV !== "production" && useDebugValue(d2);
      var v2 = I(o3, f3, c2) || C, g3 = function(e4, n, r2) {
        for (var o4, s3 = __assign(__assign({}, n), { className: void 0, theme: r2 }), i3 = 0; i3 < e4.length; i3 += 1) {
          var a3 = oe(o4 = e4[i3]) ? o4(s3) : o4;
          for (var c3 in a3) s3[c3] = c3 === "className" ? ie(s3[c3], a3[c3]) : c3 === "style" ? __assign(__assign({}, s3[c3]), a3[c3]) : a3[c3];
        }
        return n.className && (s3.className = ie(s3.className, n.className)), s3;
      }(i2, o3, v2), S3 = g3.as || h2, w3 = {};
      for (var b2 in g3) g3[b2] === void 0 || b2[0] === "$" || b2 === "as" || b2 === "theme" && g3.theme === v2 || (b2 === "forwardedAs" ? w3.as = g3.forwardedAs : y3 && !y3(b2, S3) || (w3[b2] = g3[b2], y3 || process.env.NODE_ENV !== "development" || isPropValid(b2) || st.has(b2) || !A.has(S3) || (st.add(b2), console.warn('styled-components: it looks like an unknown prop "'.concat(b2, '" is being sent through to the DOM, which will likely trigger a React console error. If you would like automatic filtering of unknown props, you can opt-into that behavior via `<StyleSheetManager shouldForwardProp={...}>` (connect an API like `@emotion/is-prop-valid`) or consider using transient props (`$` prefix for automatic filtering.)')))));
      var E3 = function(e4, t) {
        var n = Ge(), r2 = e4.generateAndInjectStyles(t, n.styleSheet, n.stylis);
        return process.env.NODE_ENV !== "production" && useDebugValue(r2), r2;
      }(a2, g3);
      process.env.NODE_ENV !== "production" && e3.warnTooManyClasses && e3.warnTooManyClasses(E3);
      var N3 = ie(p2, d2);
      return E3 && (N3 += " " + E3), g3.className && (N3 += " " + g3.className), w3[L(S3) && !A.has(S3) ? "class" : "className"] = N3, w3.ref = s2, createElement(S3, w3);
    }(D2, e2, o2);
  }
  O2.displayName = y2;
  var D2 = r.forwardRef(O2);
  return D2.attrs = S2, D2.componentStyle = N2, D2.displayName = y2, D2.shouldForwardProp = w2, D2.foldedComponentIds = i ? ie(a.foldedComponentIds, a.styledComponentId) : "", D2.styledComponentId = g2, D2.target = i ? a.target : e, Object.defineProperty(D2, "defaultProps", { get: function() {
    return this._foldedDefaultProps;
  }, set: function(e2) {
    this._foldedDefaultProps = i ? function(e3) {
      for (var t = [], n = 1; n < arguments.length; n++) t[n - 1] = arguments[n];
      for (var r2 = 0, o2 = t; r2 < o2.length; r2++) le(e3, o2[r2], !0);
      return e3;
    }({}, a.defaultProps, e2) : e2;
  } }), process.env.NODE_ENV !== "production" && (P(y2, g2), D2.warnTooManyClasses = /* @__PURE__ */ function(e2, t) {
    var n = {}, r2 = !1;
    return function(o2) {
      if (!r2 && (n[o2] = !0, Object.keys(n).length >= 200)) {
        var s2 = t ? ' with the id of "'.concat(t, '"') : "";
        console.warn("Over ".concat(200, " classes were generated for component ").concat(e2).concat(s2, `.
`) + `Consider using the attrs method, together with a style object for frequently changed styles.
Example:
  const Component = styled.div.attrs(props => ({
    style: {
      background: props.background,
    },
  }))\`width: 100%;\`

  <Component />`), r2 = !0, n = {};
      }
    };
  }(y2, g2)), ue(D2, function() {
    return ".".concat(D2.styledComponentId);
  }), c && re(D2, e, { attrs: !0, componentStyle: !0, displayName: !0, foldedComponentIds: !0, shouldForwardProp: !0, styledComponentId: !0, target: !0 }), D2;
}
function at(e, t) {
  for (var n = [e[0]], r2 = 0, o = t.length; r2 < o; r2 += 1) n.push(t[r2], e[r2 + 1]);
  return n;
}
var ct = function(e) {
  return Object.assign(e, { isCss: !0 });
};
function lt(t) {
  for (var n = [], r2 = 1; r2 < arguments.length; r2++) n[r2 - 1] = arguments[r2];
  if (oe(t) || ce(t)) return ct(Xe(at(_, __spreadArray([t], n, !0))));
  var o = t;
  return n.length === 0 && o.length === 1 && typeof o[0] == "string" ? Xe(o) : ct(Xe(at(o, n)));
}
function ut(n, r2, o) {
  if (o === void 0 && (o = C), !r2) throw he(1, r2);
  var s = function(t) {
    for (var s2 = [], i = 1; i < arguments.length; i++) s2[i - 1] = arguments[i];
    return n(r2, o, lt.apply(void 0, __spreadArray([t], s2, !1)));
  };
  return s.attrs = function(e) {
    return ut(n, r2, __assign(__assign({}, o), { attrs: Array.prototype.concat(o.attrs, e).filter(Boolean) }));
  }, s.withConfig = function(e) {
    return ut(n, r2, __assign(__assign({}, o), e));
  }, s;
}
var pt = function(e) {
  return ut(it, e);
}, dt = pt;
A.forEach(function(e) {
  dt[e] = pt(e);
});
process.env.NODE_ENV !== "production" && typeof navigator < "u" && navigator.product === "ReactNative" && console.warn(`It looks like you've imported 'styled-components' on React Native.
Perhaps you're looking to import 'styled-components/native'?
Read more about this at https://www.styled-components.com/docs/basics#react-native`);
var wt = "__sc-".concat(f, "__");
process.env.NODE_ENV !== "production" && process.env.NODE_ENV !== "test" && typeof window < "u" && (window[wt] || (window[wt] = 0), window[wt] === 1 && console.warn(`It looks like there are several instances of 'styled-components' initialized in this application. This may cause dynamic styles to not render properly, errors during the rehydration process, a missing theme prop, and makes your application bigger without good reason.

See https://s-c.sh/2BAXzed for more info.`), window[wt] += 1);
const StyledDescription = dt.details`
  summary {
    cursor: pointer;
  }
  div {
    margin-top: 0.5rem;
    margin-left: 0.75rem;
    svg {
      padding-right: 0.25rem;
    }
  }
`;
dt.div`
  margin-top: 2rem;
`;
const timespanTypeName = "Timespan", timespan = defineType({
  name: timespanTypeName,
  type: "object",
  title: "Tidsspenn",
  components: {
    input: TimespanInput
  },
  fields: [
    defineField({
      name: "edtf",
      title: "EDTF",
      type: "string",
      description: /* @__PURE__ */ jsxs(StyledDescription, { children: [
        /* @__PURE__ */ jsx("summary", { children: "Write EDTF dates, for example \u201C0900/1200?\u201D. Click for explanation." }),
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsxs("div", { children: [
            "Extended Date/Time Format (EDTF) is a way to write dates and times in a way that can express",
            " ",
            /* @__PURE__ */ jsx("a", { href: "https://www.loc.gov/standards/datetime/background.html", children: "uncertainty and approximations." })
          ] }),
          /* @__PURE__ */ jsxs("div", { children: [
            /* @__PURE__ */ jsxs("ul", { children: [
              /* @__PURE__ */ jsxs("li", { children: [
                "Intervals: ",
                /* @__PURE__ */ jsx("kbd", { children: "1880/1900-01" }),
                "."
              ] }),
              /* @__PURE__ */ jsxs("li", { children: [
                "Unknown start: ",
                /* @__PURE__ */ jsx("kbd", { children: "/1900-01" }),
                "."
              ] }),
              /* @__PURE__ */ jsxs("li", { children: [
                "Unknown end: ",
                /* @__PURE__ */ jsx("kbd", { children: "2021/" }),
                "."
              ] }),
              /* @__PURE__ */ jsxs("li", { children: [
                "Uncertainty: ",
                /* @__PURE__ */ jsx("kbd", { children: "1900-01-12?" }),
                "."
              ] }),
              /* @__PURE__ */ jsxs("li", { children: [
                "Approximation: ",
                /* @__PURE__ */ jsx("kbd", { children: "~1900" }),
                "."
              ] }),
              /* @__PURE__ */ jsxs("li", { children: [
                "Exact dates: ",
                /* @__PURE__ */ jsx("kbd", { children: "2020-01-01T12:12:12" }),
                "."
              ] })
            ] }),
            /* @__PURE__ */ jsxs("div", { children: [
              "Read about the ",
              /* @__PURE__ */ jsx("a", { href: "https://github.com/inukshuk/edtf.js", children: "syntax" }),
              " and",
              " ",
              /* @__PURE__ */ jsx("a", { href: "https://www.loc.gov/standards/datetime/", children: "specification" }),
              " for more details."
            ] })
          ] })
        ] })
      ] }),
      // Custom validation
      validation: (Rule) => Rule.custom((value) => {
        if (typeof value > "u")
          return !0;
        try {
          return edtf(value).isEDTF ? !0 : "Invalid EDTF";
        } catch {
          return "Invalid EDTF";
        }
      })
    }),
    defineField({
      name: "beginOfTheBegin",
      title: "Begynnelsen av begynnelsen",
      type: "datetime",
      readOnly: !0
    }),
    defineField({
      name: "endOfTheBegin",
      title: "Slutten p\xE5 begynnelsen",
      type: "datetime",
      readOnly: !0
    }),
    defineField({
      name: "date",
      title: "Dato",
      type: "datetime",
      readOnly: !0
    }),
    defineField({
      name: "beginOfTheEnd",
      title: "Begynnelsen av slutten",
      type: "datetime",
      readOnly: !0
    }),
    defineField({
      name: "endOfTheEnd",
      title: "Slutten av slutten",
      type: "datetime",
      readOnly: !0
    })
  ],
  preview: {
    select: {
      timespanTitle: "edtf"
    },
    prepare({ timespanTitle }) {
      return {
        title: timespanTitle
      };
    }
  }
}), timespanInput = definePlugin({
  name: "@seidhr/sanity-plugin-timespan-input",
  schema: {
    types: [timespan]
  }
});
export {
  timespan,
  timespanInput
};
//# sourceMappingURL=index.esm.js.map