UNPKG

sanity

Version:

Sanity is a real-time content infrastructure with a scalable, hosted backend featuring a Graph Oriented Query Language (GROQ), asset pipelines and fast edge caches

1,047 lines • 72.1 kB
import { jsx, jsxs } from "react/jsx-runtime"; import { c } from "react/compiler-runtime"; import { useRouter, StateLink } from "sanity/router"; import { Autocomplete, Stack, Flex, Box, Text, TextInput, TextArea, useToast, Card, Menu, Badge, Container, rem, Skeleton } from "@sanity/ui"; import { useId, useState, memo, forwardRef } from "react"; import { Button, Dialog, MenuButton, MenuItem } from "./index.js"; import { getVariantId, variantsClient, useClient, VARIANTS_STUDIO_CLIENT_OPTIONS, VARIANT_DOCUMENTS_PATH, useTranslation, variantsLocaleNamespace, useAllVariants, TextWithTone, useBundleDocuments, ContextMenuButton, RelativeTime, useSchema, useReleasesStore, SanityDefaultPreview, getReleaseTitleDetails, getReleaseIdFromReleaseDocumentId, getReleaseTone, decodeVariantIdFromRoute, LoadingBlock, getVariantDescription, getVariantConditionsText, getVariantTitle, filterVariantsForSearch } from "./index2.js"; import "history"; import "sanity/_singletons"; import "@sanity/icons/ArrowLeft"; import "@sanity/icons/Launch"; import "styled-components"; import "react-i18next"; import "rxjs/operators"; import { useObservable } from "react-rx"; import "rxjs"; import "@sanity/client/csm"; import "quick-lru"; import "lodash-es/throttle.js"; import "lodash-es/isEqual.js"; import "@sanity/logos"; import "@sanity/icons/ChevronRight"; import "@sanity/client"; import "./version.js"; import "@sanity/icons/Checkmark"; import "react-is"; import "@sanity/icons/Document"; import "@sanity/icons/Image"; import "@sanity/uuid"; import "@sanity/color"; import "color2k"; import "lodash-es/isString.js"; import "@sanity/icons/Copy"; import "@sanity/icons/Clipboard"; import "./createAgentBundlesStore.js"; import "@sanity/telemetry/react"; import "@portabletext/editor"; import "@sanity/util/paths"; import "@sanity/types"; import "@sanity/icons/Revert"; import "@sanity/ui/theme"; import "date-fns/differenceInDays"; import "date-fns/differenceInHours"; import "date-fns/differenceInMinutes"; import "date-fns/differenceInMonths"; import "date-fns/differenceInSeconds"; import "date-fns/differenceInWeeks"; import "date-fns/differenceInYears"; import "@sanity/icons/AddCircle"; import "@sanity/icons/Calendar"; import "@sanity/icons/Circle"; import "@sanity/icons/Close"; import "@sanity/icons/Edit"; import "@sanity/icons/Publish"; import "@sanity/icons/Timeline"; import { TrashIcon } from "@sanity/icons/Trash"; import "@sanity/icons/Unpublish"; import "@sanity/icons/ArrowDown"; import "@sanity/icons/ArrowRight"; import "@sanity/util/legacyDateFormat"; import "@sanity/diff-patch"; import "@sanity/icons/ErrorOutline"; import "@sanity/diff"; import "mendoza"; import "@sanity/icons/InfoOutline"; import "@sanity/icons/WarningOutline"; import "@portabletext/sanity-bridge"; import "@sanity/id-utils"; import "@sanity/icons/ChevronDown"; import "date-fns/addHours"; import "date-fns/startOfHour"; import "@sanity/icons/Bolt"; import "@sanity/icons/Clock"; import "@sanity/icons/Dot"; import "@sanity/icons/EarthGlobe"; import "date-fns/format"; import "date-fns/isValid"; import "date-fns/parse"; import "lodash-es/flatten.js"; import "date-fns/getMinutes"; import "date-fns/parseISO"; import "date-fns/setMinutes"; import "react-fast-compare"; import "clsx"; import "@sanity/icons/EarthAmericas"; import "lodash-es/noop.js"; import { SearchIcon } from "@sanity/icons/Search"; import "motion/react"; import "lodash-es/pick.js"; import "lodash-es/get.js"; import "@algorithm.ts/lcs"; import "lodash-es/intersection.js"; import "json-stable-stringify"; import "shallow-equals"; import "scroll-into-view-if-needed"; import "@sanity/schema/_internal"; import "lodash-es/groupBy.js"; import "lodash-es/sortBy.js"; import "lodash-es/compact.js"; import "lodash-es/keyBy.js"; import "lodash-es/partition.js"; import "lodash-es/toLower.js"; import "lodash-es/union.js"; import "lodash-es/uniq.js"; import "lodash-es/words.js"; import "lodash-es/isFinite.js"; import { AddIcon } from "@sanity/icons/Add"; import "observable-callback"; import { randomKey } from "@sanity/util/content"; import "@sanity/icons/BulbOutline"; import "@sanity/icons/Unknown"; import "@sanity/icons/ToggleArrowRight"; import "lodash-es/isPlainObject.js"; import "@sanity/insert-menu"; import "@dnd-kit/sortable"; import "@sanity/icons/DragHandle"; import "@sanity/icons/AddDocument"; import "@sanity/icons/InsertAbove"; import "@sanity/icons/InsertBelow"; import "@tanstack/react-virtual"; import "lodash-es/startCase.js"; import "speakingurl"; import "@portabletext/react"; import "@sanity/icons/LinkRemoved"; import "@sanity/asset-utils"; import "@sanity/icons/AccessDenied"; import "@sanity/icons/HelpCircle"; import "@sanity/image-url"; import { customAlphabet } from "nanoid"; import "lodash-es/castArray.js"; import "rxjs-mergemap-array"; import "@sanity/mutator"; import "lodash-es/findIndex.js"; import "@sanity/diff-match-patch"; import "@sanity/icons"; import "@sanity/icons/Link"; import "@sanity/icons/ChevronUp"; import "@sanity/icons/EyeOpen"; import "@sanity/icons/Feedback"; import "@xstate/react"; import "xstate"; import "@sanity/icons/FaceHappy"; import "@sanity/icons/FaceIndifferent"; import "@sanity/icons/FaceSad"; import "@sentry/react"; import "@sanity/schema"; import "@sanity/util/client"; import "@sanity/util/concurrency-limiter"; import "lodash-es/uniqBy.js"; import "json-reduce"; import "rxjs-exhaustmap-with-trailing"; import "date-fns/isBefore"; import "date-fns/startOfMinute"; import "@sanity/icons/Documents"; import "lodash-es/debounce.js"; import "@sanity/icons/User"; import "@sanity/icons/CheckmarkCircle"; import "lodash-es/deburr.js"; import "react-focus-lock"; import "@sanity/icons/ChevronLeft"; import "@sanity/icons/Reset"; import "@sanity/icons/Sync"; import "lodash-es/pickBy.js"; import "swr"; import "@sanity/icons/Download"; import "@sanity/icons/Upload"; import "@sanity/icons/BinaryDocument"; import "@sanity/icons/Lock"; import "use-hot-module-reload"; import "@sanity/icons/EllipsisHorizontal"; import "lodash-es/memoize.js"; import "lodash-es/sortedIndex.js"; import "lodash-es/difference.js"; import "lodash-es/identity.js"; import "lodash-es/values.js"; import "@sanity/comlink"; import "lodash-es/omit.js"; import "@isaacs/ttlcache"; import "dataloader"; import "raf"; import "groq-js"; import "use-sync-external-store/with-selector"; import "is-network-error"; import "lodash-es/escapeRegExp.js"; import "@sanity/icons/Desktop"; import "@sanity/icons/Moon"; import "@sanity/icons/Sun"; import "lodash-es/isEmpty.js"; import "react-dom/server"; import "@sanity/icons/Controls"; import "@sanity/icons/Sort"; import "lodash-es/capitalize.js"; import "@sanity/icons/Undo"; import "@sanity/icons/Menu"; import "@sanity/icons/AddUser"; import "@sanity/icons/Cog"; import "@sanity/icons/Users"; import "semver"; import "@sanity/icons/Github"; import "@sanity/icons/Refresh"; import "@sanity/icons/Leave"; import "lodash-es/last.js"; import "react-dom/client"; import "date-fns/addWeeks"; import "date-fns/isAfter"; import { isPortableTextBlock, toPlainText } from "@portabletext/toolkit"; import { at, set } from "@sanity/mutate"; import { applyPatches } from "@sanity/mutate/_unstable_apply"; import { DiamondIcon } from "@sanity/icons/Diamond"; import { Table, Headers } from "./Table.js"; function createVariantOperationsStore(options) { const client = variantsClient(options.client); return { createVariant: async (variant) => { const action = { actionType: "sanity.action.variant.definition.create", variantId: getVariantId(variant._id), conditions: variant.conditions, priority: variant.priority, ...variant.metadata ? { metadata: variant.metadata } : {} }; return await client.action(action, { tag: "variants.create" }); }, updateVariant: async (variant) => { const variantId = getVariantId(variant._id), setPayload = { conditions: variant.conditions, priority: variant.priority }; variant.metadata && (setPayload.metadata = variant.metadata); const patch = { set: setPayload }; variant.metadata || (patch.unset = ["metadata"]); const action = { actionType: "sanity.action.variant.definition.edit", variantId, patch }; return await client.action(action, { tag: "variants.edit" }); }, deleteVariant: async (variantIdOrDocumentId) => { const action = { actionType: "sanity.action.variant.definition.delete", variantId: getVariantId(variantIdOrDocumentId) }; return await client.action(action, { tag: "variants.delete" }); } }; } function useVariantOperations() { const $ = c(2), studioClient = useClient(VARIANTS_STUDIO_CLIENT_OPTIONS); let t0; return $[0] !== studioClient ? (t0 = createVariantOperationsStore({ client: studioClient }), $[0] = studioClient, $[1] = t0) : t0 = $[1], t0; } function getVariantTitleValue(variant) { const title = variant.metadata?.title; return typeof title == "string" ? title.trim() : ""; } function getIsVariantInvalid(variant) { return !getVariantTitleValue(variant) || !getHasValidConditions(variant.conditions); } function getHasValidConditions(conditions) { const entries = Object.entries(conditions); return entries.length > 0 && entries.every(([key, value]) => !!(key.trim() && value.trim())); } const CONDITION_KEY_REGEX = /^[a-z][a-z0-9_-]{0,63}$/, RESERVED_KEY_PREFIXES = ["_", "$"]; function getConditionKeyValidationError(key) { const trimmedKey = key.trim(); if (trimmedKey) { for (const prefix of RESERVED_KEY_PREFIXES) if (trimmedKey.startsWith(prefix)) return "reserved"; if (trimmedKey.includes(":") || !CONDITION_KEY_REGEX.test(trimmedKey)) return "invalid"; } } function getConditionValueValidationError(value) { if (!value.trim()) return "empty"; if (value.includes(":")) return "invalid"; } const createVariantIdSuffix = customAlphabet("abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789", 8); function createVariantId() { return `${VARIANT_DOCUMENTS_PATH}.${createVariantIdSuffix()}`; } function getVariantDefaults() { return { _id: createVariantId(), _type: "system.variant", conditions: {}, priority: 0, metadata: { title: "", description: [] } }; } function createPortableTextDescription(text) { return text.trim() ? [{ _key: randomKey(12), _type: "block", children: [{ _key: randomKey(12), _type: "span", marks: [], text }], markDefs: [], style: "normal" }] : []; } function sortValues(values) { return Array.from(values).filter(Boolean).toSorted((a, b) => a.localeCompare(b)); } function buildConditionSuggestionIndex(variants) { const keys = /* @__PURE__ */ new Set(), valuesByKey = /* @__PURE__ */ new Map(); return variants.forEach((variant) => { Object.entries(variant.conditions).forEach(([rawKey, rawValue]) => { const key = rawKey.trim(); if (!key) return; keys.add(key); const value = rawValue?.trim(); if (!value) return; let values = valuesByKey.get(key); values || (values = /* @__PURE__ */ new Set(), valuesByKey.set(key, values)), values.add(value); }); }), { keys: sortValues(keys), valuesByKey: new Map(Array.from(valuesByKey, ([key, values]) => [key, sortValues(values)])) }; } function getConditionKeyOptions(index, rows, currentRowIndex) { const usedKeys = new Set(rows.filter((_, rowIndex) => rowIndex !== currentRowIndex).map((row) => row.key.trim()).filter(Boolean)); return index.keys.filter((key) => !usedKeys.has(key)).map((value) => ({ value })); } function getConditionValueOptions(index, conditionKey) { const key = conditionKey.trim(); return key ? index.valuesByKey.get(key)?.map((value) => ({ value })) ?? [] : []; } function filterConditionOption(query, option) { return option.value.toLowerCase().includes(query.trim().toLowerCase()); } function ConditionAutocompleteInput(props) { const $ = c(16), { ariaLabel, autoFocus, customValidity, invalid, onChange, options, placeholder, testId, value } = props, id = useId(), [focused, setFocused] = useState(!1); let t0; $[0] !== onChange ? (t0 = (nextValue) => { nextValue !== null && onChange(nextValue); }, $[0] = onChange, $[1] = t0) : t0 = $[1]; const handleQueryChange = t0, t1 = invalid ? "true" : void 0; let t2; $[2] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t2 = () => setFocused(!1), $[2] = t2) : t2 = $[2]; let t3; $[3] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t3 = () => setFocused(!0), $[3] = t3) : t3 = $[3]; const t4 = focused ? void 0 : value; let t5; return $[4] !== ariaLabel || $[5] !== autoFocus || $[6] !== customValidity || $[7] !== handleQueryChange || $[8] !== id || $[9] !== onChange || $[10] !== options || $[11] !== placeholder || $[12] !== t1 || $[13] !== t4 || $[14] !== testId ? (t5 = /* @__PURE__ */ jsx(Autocomplete, { id, "aria-invalid": t1, "aria-label": ariaLabel, autoFocus, customValidity, "data-testid": testId, filterOption: filterConditionOption, fontSize: 1, onBlur: t2, onChange, onFocus: t3, onQueryChange: handleQueryChange, openButton: !0, options, placeholder, value: t4 }), $[4] = ariaLabel, $[5] = autoFocus, $[6] = customValidity, $[7] = handleQueryChange, $[8] = id, $[9] = onChange, $[10] = options, $[11] = placeholder, $[12] = t1, $[13] = t4, $[14] = testId, $[15] = t5) : t5 = $[15], t5; } function getConditionRows(conditions) { const rows = Object.entries(conditions).map(([key, value]) => ({ id: randomKey(12), key, value })); return rows.length ? rows : [{ id: randomKey(12), key: "", value: "" }]; } function getConditionsFromRows(rows) { return rows.reduce((conditions, row) => { const key = row.key.trim(), value = row.value.trim(); return key && value && (conditions[key] = value), conditions; }, {}); } function isConditionRowEmpty(row) { return !row.key.trim() && !row.value.trim(); } function getEmptyConditionRowValidation() { return { key: null, value: null }; } function getConditionRowsValidation(rows) { const conditionRowsValidation = /* @__PURE__ */ new Map(), seenKeys = /* @__PURE__ */ new Set(); return rows.forEach((row, index) => { const validation = { key: null, value: null }, key = row.key.trim(), value = row.value.trim(); if (key) { seenKeys.has(key) ? validation.key = "dialog.create.condition-key.duplicate" : seenKeys.add(key); const keyError = getConditionKeyValidationError(row.key); !validation.key && keyError === "reserved" ? validation.key = "dialog.create.condition-key.reserved" : !validation.key && keyError === "invalid" && (validation.key = "dialog.create.condition-key.invalid"); } else value && (validation.key = "dialog.create.condition-key.required"); const valueError = getConditionValueValidationError(row.value); (key || isConditionRowEmpty(row)) && valueError === "empty" ? validation.value = "dialog.create.condition-value.required" : valueError === "invalid" && (validation.value = "dialog.create.condition-value.invalid"), conditionRowsValidation.set(index, validation); }), conditionRowsValidation; } function hasConditionRowsValidationErrors(validation) { return Array.from(validation.values()).some(({ key, value }) => key || value); } function getPortableTextDescriptionValue(description) { return !Array.isArray(description) || !description.every(isPortableTextBlock) ? "" : toPlainText(description); } function VariantForm(props) { const $ = c(108), { onChange, onConditionValidityChange, showValidation: t0, value } = props, showValidation = t0 === void 0 ? !1 : t0, { t } = useTranslation(variantsLocaleNamespace), { data: variants } = useAllVariants(); let t1; $[0] !== variants ? (t1 = buildConditionSuggestionIndex(variants), $[0] = variants, $[1] = t1) : t1 = $[1]; const suggestionIndex = t1, titleId = useId(), descriptionId = useId(); let t2; $[2] !== value.conditions ? (t2 = () => getConditionRows(value.conditions), $[2] = value.conditions, $[3] = t2) : t2 = $[3]; const [conditionRows, setConditionRows] = useState(t2); let t3; $[4] !== conditionRows ? (t3 = getConditionRowsValidation(conditionRows), $[4] = conditionRows, $[5] = t3) : t3 = $[5]; const conditionsValidation = t3; let t4; $[6] !== value ? (t4 = getVariantTitleValue(value), $[6] = value, $[7] = t4) : t4 = $[7]; const showTitleError = showValidation && !t4, lastConditionRow = conditionRows[conditionRows.length - 1]; let t5; $[8] !== conditionsValidation || $[9] !== lastConditionRow ? (t5 = lastConditionRow && !hasConditionRowsValidationErrors(conditionsValidation), $[8] = conditionsValidation, $[9] = lastConditionRow, $[10] = t5) : t5 = $[10]; const canAddCondition = !!t5; let t6; $[11] !== onChange || $[12] !== onConditionValidityChange ? (t6 = (nextRows) => { const rows = nextRows.length ? nextRows : getConditionRows({}); setConditionRows(rows); const nextRowsValidation = getConditionRowsValidation(rows), nextRowsInvalid = hasConditionRowsValidationErrors(nextRowsValidation); onConditionValidityChange?.(nextRowsInvalid), (nextRows.length === 0 || !nextRowsInvalid) && onChange(["conditions"], getConditionsFromRows(nextRows)); }, $[11] = onChange, $[12] = onConditionValidityChange, $[13] = t6) : t6 = $[13]; const updateConditionRows = t6; let t7; $[14] !== onChange ? (t7 = (event) => { onChange(["metadata", "title"], event.currentTarget.value); }, $[14] = onChange, $[15] = t7) : t7 = $[15]; const handleTitleChange = t7; let t8; $[16] !== onChange ? (t8 = (event_0) => { onChange(["metadata", "description"], createPortableTextDescription(event_0.currentTarget.value)); }, $[16] = onChange, $[17] = t8) : t8 = $[17]; const handleDescriptionChange = t8; let t9; $[18] !== conditionRows || $[19] !== updateConditionRows ? (t9 = (index, field, nextValue) => { const nextRows_0 = conditionRows.map((row, rowIndex) => rowIndex === index ? { ...row, [field]: nextValue } : row); updateConditionRows(nextRows_0); }, $[18] = conditionRows, $[19] = updateConditionRows, $[20] = t9) : t9 = $[20]; const handleConditionChange = t9; let t10; $[21] !== canAddCondition || $[22] !== conditionRows || $[23] !== updateConditionRows ? (t10 = () => { canAddCondition && updateConditionRows([...conditionRows, { id: randomKey(12), key: "", value: "" }]); }, $[21] = canAddCondition, $[22] = conditionRows, $[23] = updateConditionRows, $[24] = t10) : t10 = $[24]; const handleAddCondition = t10; let t11; $[25] !== conditionRows || $[26] !== updateConditionRows ? (t11 = (index_0) => { const nextRows_1 = conditionRows.filter((_, rowIndex_0) => rowIndex_0 !== index_0); updateConditionRows(nextRows_1); }, $[25] = conditionRows, $[26] = updateConditionRows, $[27] = t11) : t11 = $[27]; const handleRemoveCondition = t11; let t12; $[28] !== t ? (t12 = t("dialog.create.variant-title.label"), $[28] = t, $[29] = t12) : t12 = $[29]; let t13; $[30] !== t12 || $[31] !== titleId ? (t13 = /* @__PURE__ */ jsx(Text, { as: "label", htmlFor: titleId, size: 1, weight: "medium", children: t12 }), $[30] = t12, $[31] = titleId, $[32] = t13) : t13 = $[32]; const t14 = showTitleError ? "true" : void 0; let t15; $[33] !== showTitleError || $[34] !== t ? (t15 = showTitleError ? t("dialog.create.variant-title.required") : void 0, $[33] = showTitleError, $[34] = t, $[35] = t15) : t15 = $[35]; let t16; $[36] !== t ? (t16 = t("dialog.create.variant-title.placeholder"), $[36] = t, $[37] = t16) : t16 = $[37]; const t17 = typeof value.metadata?.title == "string" ? value.metadata.title : ""; let t18; $[38] !== handleTitleChange || $[39] !== t14 || $[40] !== t15 || $[41] !== t16 || $[42] !== t17 || $[43] !== titleId ? (t18 = /* @__PURE__ */ jsx(TextInput, { autoFocus: !0, "aria-invalid": t14, customValidity: t15, "data-testid": "variant-form-title", fontSize: 2, id: titleId, onChange: handleTitleChange, placeholder: t16, value: t17 }), $[38] = handleTitleChange, $[39] = t14, $[40] = t15, $[41] = t16, $[42] = t17, $[43] = titleId, $[44] = t18) : t18 = $[44]; let t19; $[45] !== showTitleError || $[46] !== t ? (t19 = showTitleError && /* @__PURE__ */ jsx(TextWithTone, { "data-testid": "variant-form-title-error", size: 1, tone: "critical", children: t("dialog.create.variant-title.required") }), $[45] = showTitleError, $[46] = t, $[47] = t19) : t19 = $[47]; let t20; $[48] !== t13 || $[49] !== t18 || $[50] !== t19 ? (t20 = /* @__PURE__ */ jsxs(Stack, { space: 3, children: [ t13, t18, t19 ] }), $[48] = t13, $[49] = t18, $[50] = t19, $[51] = t20) : t20 = $[51]; let t21; $[52] !== t ? (t21 = t("dialog.create.description.label"), $[52] = t, $[53] = t21) : t21 = $[53]; let t22; $[54] !== descriptionId || $[55] !== t21 ? (t22 = /* @__PURE__ */ jsx(Text, { as: "label", htmlFor: descriptionId, size: 1, weight: "medium", children: t21 }), $[54] = descriptionId, $[55] = t21, $[56] = t22) : t22 = $[56]; let t23; $[57] !== t ? (t23 = t("dialog.create.description.placeholder"), $[57] = t, $[58] = t23) : t23 = $[58]; const t24 = value.metadata?.description; let t25; $[59] !== t24 ? (t25 = getPortableTextDescriptionValue(t24), $[59] = t24, $[60] = t25) : t25 = $[60]; let t26; $[61] !== descriptionId || $[62] !== handleDescriptionChange || $[63] !== t23 || $[64] !== t25 ? (t26 = /* @__PURE__ */ jsx(TextArea, { "data-testid": "variant-form-description", fontSize: 1, id: descriptionId, onChange: handleDescriptionChange, placeholder: t23, rows: 3, value: t25 }), $[61] = descriptionId, $[62] = handleDescriptionChange, $[63] = t23, $[64] = t25, $[65] = t26) : t26 = $[65]; let t27; $[66] !== t22 || $[67] !== t26 ? (t27 = /* @__PURE__ */ jsxs(Stack, { space: 3, children: [ t22, t26 ] }), $[66] = t22, $[67] = t26, $[68] = t27) : t27 = $[68]; let t28; $[69] !== t ? (t28 = t("dialog.create.conditions.title"), $[69] = t, $[70] = t28) : t28 = $[70]; let t29; $[71] !== t28 ? (t29 = /* @__PURE__ */ jsx(Text, { size: 1, weight: "medium", children: t28 }), $[71] = t28, $[72] = t29) : t29 = $[72]; let t30; $[73] !== t ? (t30 = t("dialog.create.conditions.description"), $[73] = t, $[74] = t30) : t30 = $[74]; let t31; $[75] !== t30 ? (t31 = /* @__PURE__ */ jsx(Text, { muted: !0, size: 1, children: t30 }), $[75] = t30, $[76] = t31) : t31 = $[76]; let t32; $[77] !== t29 || $[78] !== t31 ? (t32 = /* @__PURE__ */ jsxs(Stack, { space: 2, children: [ t29, t31 ] }), $[77] = t29, $[78] = t31, $[79] = t32) : t32 = $[79]; let t33; $[80] !== conditionRows || $[81] !== conditionsValidation || $[82] !== handleConditionChange || $[83] !== handleRemoveCondition || $[84] !== showValidation || $[85] !== suggestionIndex || $[86] !== t ? (t33 = conditionRows.map((row_0, index_1) => { const validation = conditionsValidation.get(index_1) ?? getEmptyConditionRowValidation(), valueValidation = showValidation ? validation.value : null, conditionValidationError = validation.key || valueValidation; return /* @__PURE__ */ jsxs(Stack, { space: 2, children: [ /* @__PURE__ */ jsxs(Flex, { align: "center", gap: 2, children: [ /* @__PURE__ */ jsx(Box, { flex: 1, children: /* @__PURE__ */ jsx(ConditionAutocompleteInput, { autoFocus: index_1 > 0, ariaLabel: t("dialog.create.condition-key.label"), customValidity: validation.key ? t(validation.key) : void 0, invalid: !!validation.key, onChange: (nextValue_0) => handleConditionChange(index_1, "key", nextValue_0), options: getConditionKeyOptions(suggestionIndex, conditionRows, index_1), placeholder: t("dialog.create.condition-key.placeholder"), testId: "variant-form-condition-key", value: row_0.key }) }), /* @__PURE__ */ jsx(Box, { flex: 1, children: /* @__PURE__ */ jsx(ConditionAutocompleteInput, { ariaLabel: t("dialog.create.condition-value.label"), customValidity: valueValidation ? t(valueValidation) : void 0, invalid: !!valueValidation, onChange: (nextValue_1) => handleConditionChange(index_1, "value", nextValue_1), options: getConditionValueOptions(suggestionIndex, row_0.key), placeholder: t("dialog.create.condition-value.placeholder"), testId: "variant-form-condition-value", value: row_0.value }) }), /* @__PURE__ */ jsx(Button, { disabled: isConditionRowEmpty(row_0) && conditionRows.length === 1, icon: TrashIcon, mode: "bleed", onClick: () => handleRemoveCondition(index_1), tone: "critical", tooltipProps: { content: t("dialog.create.remove-condition") }, type: "button" }) ] }), conditionValidationError && /* @__PURE__ */ jsx(TextWithTone, { "data-testid": validation.key ? "variant-form-condition-key-error" : "variant-form-condition-value-error", size: 1, tone: "critical", children: t(conditionValidationError) }) ] }, row_0.id); }), $[80] = conditionRows, $[81] = conditionsValidation, $[82] = handleConditionChange, $[83] = handleRemoveCondition, $[84] = showValidation, $[85] = suggestionIndex, $[86] = t, $[87] = t33) : t33 = $[87]; let t34; $[88] !== t33 ? (t34 = /* @__PURE__ */ jsx(Stack, { space: 2, children: t33 }), $[88] = t33, $[89] = t34) : t34 = $[89]; const t35 = !canAddCondition; let t36; $[90] !== t ? (t36 = t("dialog.create.action.add-condition"), $[90] = t, $[91] = t36) : t36 = $[91]; let t37; $[92] !== canAddCondition || $[93] !== t ? (t37 = canAddCondition ? null : { content: t("dialog.create.action.add-condition.disabled-hint") }, $[92] = canAddCondition, $[93] = t, $[94] = t37) : t37 = $[94]; let t38; $[95] !== handleAddCondition || $[96] !== t35 || $[97] !== t36 || $[98] !== t37 ? (t38 = /* @__PURE__ */ jsx(Flex, { children: /* @__PURE__ */ jsx(Button, { disabled: t35, icon: AddIcon, mode: "ghost", onClick: handleAddCondition, text: t36, tooltipProps: t37, type: "button" }) }), $[95] = handleAddCondition, $[96] = t35, $[97] = t36, $[98] = t37, $[99] = t38) : t38 = $[99]; let t39; $[100] !== t32 || $[101] !== t34 || $[102] !== t38 ? (t39 = /* @__PURE__ */ jsxs(Stack, { space: 3, children: [ t32, t34, t38 ] }), $[100] = t32, $[101] = t34, $[102] = t38, $[103] = t39) : t39 = $[103]; let t40; return $[104] !== t20 || $[105] !== t27 || $[106] !== t39 ? (t40 = /* @__PURE__ */ jsxs(Stack, { space: 5, children: [ t20, t27, t39 ] }), $[104] = t20, $[105] = t27, $[106] = t39, $[107] = t40) : t40 = $[107], t40; } function VariantDialog(props) { const $ = c(35), { confirmDataTestId, confirmText, errorTitle, header, id, initialValue, onCancel, onSubmit, renderCancelButton: t0 } = props, renderCancelButton = t0 === void 0 ? !1 : t0, toast = useToast(), { t } = useTranslation(variantsLocaleNamespace), [variant, setVariant] = useState(initialValue), [isSubmitting, setIsSubmitting] = useState(!1), [showValidation, setShowValidation] = useState(!1), [conditionsInvalid, setConditionsInvalid] = useState(!1); let t1; $[0] !== conditionsInvalid || $[1] !== variant ? (t1 = getIsVariantInvalid(variant) || conditionsInvalid, $[0] = conditionsInvalid, $[1] = variant, $[2] = t1) : t1 = $[2]; const invalid = t1; let t2; $[3] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t2 = (path, nextValue) => { setVariant((currentVariant) => applyPatches([at(path, set(nextValue))], currentVariant)); }, $[3] = t2) : t2 = $[3]; const handleVariantChange = t2; let t3; $[4] !== errorTitle || $[5] !== invalid || $[6] !== onSubmit || $[7] !== toast || $[8] !== variant ? (t3 = async (event) => { if (event.preventDefault(), invalid) { setShowValidation(!0); return; } setIsSubmitting(!0); try { await onSubmit(variant), setIsSubmitting(!1); } catch (t42) { const error = t42; setIsSubmitting(!1), console.error(error), toast.push({ closable: !0, status: "error", title: errorTitle }); } }, $[4] = errorTitle, $[5] = invalid, $[6] = onSubmit, $[7] = toast, $[8] = variant, $[9] = t3) : t3 = $[9]; const handleSubmit = t3, t4 = isSubmitting ? void 0 : onCancel, t5 = isSubmitting ? void 0 : onCancel; let t6; $[10] !== showValidation || $[11] !== variant ? (t6 = /* @__PURE__ */ jsx(Box, { paddingBottom: 4, children: /* @__PURE__ */ jsx(VariantForm, { onChange: handleVariantChange, onConditionValidityChange: setConditionsInvalid, showValidation, value: variant }) }), $[10] = showValidation, $[11] = variant, $[12] = t6) : t6 = $[12]; let t7; $[13] !== isSubmitting || $[14] !== onCancel || $[15] !== renderCancelButton || $[16] !== t ? (t7 = renderCancelButton && /* @__PURE__ */ jsx(Button, { disabled: isSubmitting, mode: "ghost", onClick: onCancel, text: t("dialog.edit.action.cancel"), type: "button" }), $[13] = isSubmitting, $[14] = onCancel, $[15] = renderCancelButton, $[16] = t, $[17] = t7) : t7 = $[17]; let t8; $[18] !== confirmDataTestId || $[19] !== confirmText || $[20] !== isSubmitting ? (t8 = /* @__PURE__ */ jsx(Button, { "data-testid": confirmDataTestId, disabled: isSubmitting, loading: isSubmitting, size: "large", text: confirmText, type: "submit" }), $[18] = confirmDataTestId, $[19] = confirmText, $[20] = isSubmitting, $[21] = t8) : t8 = $[21]; let t9; $[22] !== t7 || $[23] !== t8 ? (t9 = /* @__PURE__ */ jsxs(Flex, { gap: 2, justify: "flex-end", paddingTop: 5, children: [ t7, t8 ] }), $[22] = t7, $[23] = t8, $[24] = t9) : t9 = $[24]; let t10; $[25] !== handleSubmit || $[26] !== t6 || $[27] !== t9 ? (t10 = /* @__PURE__ */ jsx(Card, { borderTop: !0, padding: 4, children: /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, children: [ t6, t9 ] }) }), $[25] = handleSubmit, $[26] = t6, $[27] = t9, $[28] = t10) : t10 = $[28]; let t11; return $[29] !== header || $[30] !== id || $[31] !== t10 || $[32] !== t4 || $[33] !== t5 ? (t11 = /* @__PURE__ */ jsx(Dialog, { __unstable_autoFocus: !1, header, id, onClickOutside: t4, onClose: t5, padding: !1, width: 1, children: t10 }), $[29] = header, $[30] = id, $[31] = t10, $[32] = t4, $[33] = t5, $[34] = t11) : t11 = $[34], t11; } function toEditableVariant(variant) { return { _id: variant._id, _type: variant._type, conditions: variant.conditions, priority: variant.priority, metadata: variant.metadata }; } function EditVariantDialog(props) { const $ = c(18), { onCancel, onSubmit, variant: initialVariant } = props, { t } = useTranslation(variantsLocaleNamespace), { updateVariant } = useVariantOperations(); let t0; $[0] !== initialVariant ? (t0 = toEditableVariant(initialVariant), $[0] = initialVariant, $[1] = t0) : t0 = $[1]; const initialValue = t0; let t1; $[2] !== onSubmit || $[3] !== updateVariant ? (t1 = async (variant) => { await updateVariant(variant), onSubmit(); }, $[2] = onSubmit, $[3] = updateVariant, $[4] = t1) : t1 = $[4]; const handleSubmit = t1; let t2; $[5] !== t ? (t2 = t("dialog.edit.action.confirm"), $[5] = t, $[6] = t2) : t2 = $[6]; let t3; $[7] !== t ? (t3 = t("dialog.edit.error.title"), $[7] = t, $[8] = t3) : t3 = $[8]; let t4; $[9] !== t ? (t4 = t("dialog.edit.title"), $[9] = t, $[10] = t4) : t4 = $[10]; let t5; return $[11] !== handleSubmit || $[12] !== initialValue || $[13] !== onCancel || $[14] !== t2 || $[15] !== t3 || $[16] !== t4 ? (t5 = /* @__PURE__ */ jsx(VariantDialog, { confirmDataTestId: "save-variant-button", confirmText: t2, errorTitle: t3, header: t4, id: "edit-variant-dialog", initialValue, onCancel, onSubmit: handleSubmit, renderCancelButton: !0 }), $[11] = handleSubmit, $[12] = initialValue, $[13] = onCancel, $[14] = t2, $[15] = t3, $[16] = t4, $[17] = t5) : t5 = $[17], t5; } function useVariantDocuments(variantDocumentId) { const $ = c(7); let t0; $[0] !== variantDocumentId ? (t0 = getVariantId(variantDocumentId), $[0] = variantDocumentId, $[1] = t0) : t0 = $[1]; const variantId = t0; let t1; $[2] !== variantId ? (t1 = { variantId }, $[2] = variantId, $[3] = t1) : t1 = $[3]; const params = t1, t2 = `variant-${variantId}`; let t3; return $[4] !== params || $[5] !== t2 ? (t3 = { groqFilter: "sanity::partOfVariant($variantId)", params, cacheKey: t2 }, $[4] = params, $[5] = t2, $[6] = t3) : t3 = $[6], useBundleDocuments(t3); } function VariantDetailMenuButton(t0) { const $ = c(21), { variant } = t0, { t } = useTranslation(variantsLocaleNamespace), router = useRouter(), toast = useToast(), { deleteVariant } = useVariantOperations(), [isDeleting, setIsDeleting] = useState(!1); let t1; $[0] !== deleteVariant || $[1] !== router || $[2] !== t || $[3] !== toast || $[4] !== variant._id ? (t1 = async () => { setIsDeleting(!0); try { await deleteVariant(variant._id), setIsDeleting(!1), router.navigate({}); } catch (t22) { console.error(t22), toast.push({ closable: !0, status: "error", title: t("overview.action.delete-variant.error.title") }), setIsDeleting(!1); } }, $[0] = deleteVariant, $[1] = router, $[2] = t, $[3] = toast, $[4] = variant._id, $[5] = t1) : t1 = $[5]; const handleDelete = t1; let t2; $[6] !== isDeleting ? (t2 = /* @__PURE__ */ jsx(ContextMenuButton, { disabled: isDeleting, loading: isDeleting }), $[6] = isDeleting, $[7] = t2) : t2 = $[7]; let t3; $[8] !== variant._id ? (t3 = getVariantId(variant._id), $[8] = variant._id, $[9] = t3) : t3 = $[9]; const t4 = `variant-detail-actions-${t3}`; let t5; $[10] !== t ? (t5 = t("overview.action.delete-variant"), $[10] = t, $[11] = t5) : t5 = $[11]; let t6; $[12] !== handleDelete || $[13] !== isDeleting || $[14] !== t5 ? (t6 = /* @__PURE__ */ jsx(Menu, { children: /* @__PURE__ */ jsx(MenuItem, { disabled: isDeleting, onClick: handleDelete, text: t5, tone: "critical" }) }), $[12] = handleDelete, $[13] = isDeleting, $[14] = t5, $[15] = t6) : t6 = $[15]; let t7; $[16] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t7 = { placement: "bottom-end", portal: !0 }, $[16] = t7) : t7 = $[16]; let t8; return $[17] !== t2 || $[18] !== t4 || $[19] !== t6 ? (t8 = /* @__PURE__ */ jsx(MenuButton, { button: t2, id: t4, menu: t6, popover: t7 }), $[17] = t2, $[18] = t4, $[19] = t6, $[20] = t8) : t8 = $[20], t8; } function VariantDetailFooter(t0) { const $ = c(14), { variant } = t0, { t } = useTranslation(variantsLocaleNamespace); let t1; $[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t1 = /* @__PURE__ */ jsx(Card, { borderTop: !0, marginX: 2, style: { opacity: 0.6 } }), $[0] = t1) : t1 = $[0]; let t2; $[1] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t2 = /* @__PURE__ */ jsx(Text, { size: 1, children: /* @__PURE__ */ jsx(DiamondIcon, {}) }), $[1] = t2) : t2 = $[1]; let t3; $[2] !== t ? (t3 = t("detail.footer.created"), $[2] = t, $[3] = t3) : t3 = $[3]; let t4; $[4] !== variant._createdAt ? (t4 = /* @__PURE__ */ jsx(RelativeTime, { time: variant._createdAt, useTemporalPhrase: !0, minimal: !0 }), $[4] = variant._createdAt, $[5] = t4) : t4 = $[5]; let t5; $[6] !== t3 || $[7] !== t4 ? (t5 = /* @__PURE__ */ jsx(Flex, { flex: 1, gap: 1, children: /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsxs(Flex, { align: "center", gap: 2, children: [ t2, /* @__PURE__ */ jsxs(Text, { muted: !0, size: 1, children: [ t3, " ", t4 ] }) ] }) }) }), $[6] = t3, $[7] = t4, $[8] = t5) : t5 = $[8]; let t6; $[9] !== variant ? (t6 = /* @__PURE__ */ jsx(Flex, { flex: "none", gap: 1, "data-testid": "variant-detail-footer-actions", children: /* @__PURE__ */ jsx(VariantDetailMenuButton, { variant }) }), $[9] = variant, $[10] = t6) : t6 = $[10]; let t7; return $[11] !== t5 || $[12] !== t6 ? (t7 = /* @__PURE__ */ jsxs(Card, { flex: "none", children: [ t1, /* @__PURE__ */ jsxs(Flex, { padding: 3, children: [ t5, t6 ] }) ] }), $[11] = t5, $[12] = t6, $[13] = t7) : t7 = $[13], t7; } function getVariantDocumentVersion({ document, releasesById, t }) { const system = document._system, releaseRef = system?.release?._ref; if (releaseRef) { const release = releasesById?.get(releaseRef); if (release) { const { displayTitle } = getReleaseTitleDetails(release.metadata?.title, getReleaseIdFromReleaseDocumentId(release._id)); return { label: displayTitle, tone: getReleaseTone(release) }; } return { label: getReleaseIdFromReleaseDocumentId(releaseRef), tone: "default" }; } return system?.bundleId === "drafts" ? { label: t("detail.documents.table.version.drafts"), tone: getReleaseTone("drafts") } : { label: t("detail.documents.table.version.published"), tone: getReleaseTone("published") }; } const TABLE_CARD_STYLE = { height: "100%", overflow: "auto" }; function getDocumentPreviewTitle(document) { const title = document.title || document.name; return typeof title == "string" && title.trim() ? title : document._id; } const MemoDocumentType = memo(function(t0) { const $ = c(5), { type } = t0, schema = useSchema(); let t1; $[0] !== schema || $[1] !== type ? (t1 = schema.get(type), $[0] = schema, $[1] = type, $[2] = t1) : t1 = $[2]; const t2 = t1?.title || type; let t3; return $[3] !== t2 ? (t3 = /* @__PURE__ */ jsx(Text, { size: 1, children: t2 }), $[3] = t2, $[4] = t3) : t3 = $[4], t3; }, (prev, next) => prev.type === next.type); function getVariantDocumentVersionSortRank(document) { const system = document._system; return system?.release?._ref ? 2 : system?.bundleId === "drafts" ? 1 : 0; } function getVariantDocumentGroupSortKey({ document, version }) { const groupRef = document._system?.group._ref ?? document._id, versionRank = getVariantDocumentVersionSortRank(document); return `${groupRef}\0${versionRank}\0${version.label}\0${document._id}`; } function getVariantDocumentColumnDefs(t) { return [{ id: "documentGroup", hidden: !0, width: null, sorting: !0, sortTransform: getVariantDocumentGroupSortKey }, { id: "version", width: null, style: { minWidth: 100 }, sorting: !1, header: (props) => /* @__PURE__ */ jsx(Flex, { ...props.headerProps, paddingY: 3, sizing: "border", children: /* @__PURE__ */ jsx(Headers.BasicHeader, { text: t("detail.documents.table.version") }) }), cell: ({ cellProps, datum }) => /* @__PURE__ */ jsx(Flex, { align: "center", ...cellProps, children: /* @__PURE__ */ jsx(Box, { paddingX: 2, children: !datum.isLoading && datum.version && /* @__PURE__ */ jsx(Badge, { fontSize: 1, mode: "outline", radius: 2, tone: datum.version.tone, children: datum.version.label }) }) }) }, { id: "document._type", width: null, style: { minWidth: 100 }, sorting: !0, header: (props) => /* @__PURE__ */ jsx(Flex, { ...props.headerProps, paddingY: 3, sizing: "border", children: /* @__PURE__ */ jsx(Headers.SortHeaderButton, { text: t("detail.documents.table.type"), ...props }) }), cell: ({ cellProps, datum }) => /* @__PURE__ */ jsx(Flex, { align: "center", ...cellProps, children: /* @__PURE__ */ jsx(Box, { paddingX: 2, children: !datum.isLoading && /* @__PURE__ */ jsx(MemoDocumentType, { type: datum.document._type }) }) }) }, { id: "search", width: null, style: { minWidth: "min(50%, calc(100vw - 80px))", maxWidth: "min(50%, calc(100vw - 80px))" }, sortTransform: ({ document }) => getDocumentPreviewTitle(document).toLowerCase(), header: (props) => /* @__PURE__ */ jsx(Headers.TableHeaderSearch, { ...props, placeholder: t("detail.documents.table.search-placeholder") }), cell: ({ cellProps, datum }) => /* @__PURE__ */ jsx(Box, { ...cellProps, flex: 1, padding: 1, paddingRight: 2, sizing: "border", children: datum.isLoading ? /* @__PURE__ */ jsx(SanityDefaultPreview, { isPlaceholder: !0 }) : /* @__PURE__ */ jsx(SanityDefaultPreview, { title: getDocumentPreviewTitle(datum.document), subtitle: datum.document._id }) }) }, { id: "document._updatedAt", sorting: !0, width: 130, header: (props) => /* @__PURE__ */ jsx(Flex, { ...props.headerProps, paddingY: 3, sizing: "border", children: /* @__PURE__ */ jsx(Headers.SortHeaderButton, { text: t("detail.documents.table.edited"), ...props }) }), cell: ({ cellProps, datum }) => /* @__PURE__ */ jsx(Flex, { ...cellProps, align: "center", paddingX: 2, paddingY: 3, style: { minWidth: 130 }, children: !datum.isLoading && datum.document._updatedAt && /* @__PURE__ */ jsx(Text, { muted: !0, size: 1, children: /* @__PURE__ */ jsx(RelativeTime, { time: datum.document._updatedAt, useTemporalPhrase: !0, minimal: !0 }) }) }) }]; } function filterDocuments(rows, searchTerm) { const normalizedSearchTerm = searchTerm.trim().toLowerCase(); return normalizedSearchTerm ? rows.filter(({ document }) => [getDocumentPreviewTitle(document), document._id, document._type].some((value) => value.toLowerCase().includes(normalizedSearchTerm))) : rows; } function VariantDocumentsTable(t0) { const $ = c(18), { documents, loading: t1 } = t0, loading = t1 === void 0 ? !1 : t1, { t } = useTranslation(variantsLocaleNamespace), [scrollContainerRef, setScrollContainerRef] = useState(null), { state$ } = useReleasesStore(), releasesById = useObservable(state$)?.releases; let t2; $[0] !== t ? (t2 = getVariantDocumentColumnDefs(t), $[0] = t, $[1] = t2) : t2 = $[1]; const columnDefs = t2; let t3; if ($[2] !== documents || $[3] !== releasesById || $[4] !== t) { let t42; $[6] !== releasesById || $[7] !== t ? (t42 = (document) => ({ document, version: getVariantDocumentVersion({ document, releasesById, t }) }), $[6] = releasesById, $[7] = t, $[8] = t42) : t42 = $[8], t3 = documents.map(t42), $[2] = documents, $[3] = releasesById, $[4] = t, $[5] = t3; } else t3 = $[5]; const rows = t3; let t4; $[9] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t4 = { column: "documentGroup", direction: "asc" }, $[9] = t4) : t4 = $[9]; let t5; $[10] !== t ? (t5 = t("detail.documents.no-documents"), $[10] = t, $[11] = t5) : t5 = $[11]; let t6; return $[12] !== columnDefs || $[13] !== loading || $[14] !== rows || $[15] !== scrollContainerRef || $[16] !== t5 ? (t6 = /* @__PURE__ */ jsx(Card, { flex: 1, ref: setScrollContainerRef, style: TABLE_CARD_STYLE, children: /* @__PURE__ */ jsx(Table, { columnDefs, data: rows, defaultSort: t4, emptyState: t5, loading, rowId: "document._id", scrollContainerRef, searchFilter: filterDocuments }) }), $[12] = columnDefs, $[13] = loading, $[14] = rows, $[15] = scrollContainerRef, $[16] = t5, $[17] = t6) : t6 = $[17], t6; } function VariantDetail() { const $ = c(98), router = useRouter(), { t } = useTranslation(variantsLocaleNamespace), [editDialogOpen, setEditDialogOpen] = useState(!1), variantIdRaw = typeof router.state.variantId == "string" ? router.state.variantId : void 0, variantId = decodeVariantIdFromRoute(variantIdRaw), { byId, loading } = useAllVariants(), variant = variantId ? byId.get(variantId) : void 0, { results: variantDocuments, loading: documentsLoading } = useVariantDocuments(variantId ?? ""); let t0; $[0] !== variantDocuments ? (t0 = variantDocuments.map(_temp$2), $[0] = variantDocuments, $[1] = t0) : t0 = $[1]; const documents = t0; if (loading) { let t110; $[2] !== t ? (t110 = t("detail.loading"), $[2] = t, $[3] = t110) : t110 = $[3]; let t210; return $[4] !== t110 ? (t210 = /* @__PURE__ */ jsx(LoadingBlock, { fill: !0, title: t110 }), $[4] = t110, $[5] = t210) : t210 = $[5], t210; } if (!variant) { let t110; $[6] !== router ? (t110 = () => router.navigate({}), $[6] = router, $[7] = t110) : t110 = $[7]; let t210; $[8] !== t ? (t210 = t("detail.back"), $[8] = t, $[9] = t210) : t210 = $[9]; let t310; $[10] !== t110 || $[11] !== t210 ? (t310 = /* @__PURE__ */ jsx(Card, { borderBottom: !0, flex: "none", padding: 3, children: /* @__PURE__ */ jsx(Button, { mode: "bleed", onClick: t110, text: t210 }) }), $[10] = t110, $[11] = t210, $[12] = t310) : t310 = $[12]; let t48; $[13] !== t ? (t48 = t("detail.not-found.title"), $[13] = t, $[14] = t48) : t48 = $[14]; let t52; $[15] !== t48 ? (t52 = /* @__PURE__ */ jsx(Text, { size: 2, weight: "semibold", children: t48 }), $[15] = t48, $[16] = t52) : t52 = $[16]; let t62; $[17] !== t ? (t62 = t("detail.not-found.description"), $[17] = t, $[18] = t62) : t62 = $[18]; let t72; $[19] !== t62 ? (t72 = /* @__PURE__ */ jsx(Text, { muted: !0, size: 1, children: t62 }), $[19] = t62, $[20] = t72) : t72 = $[20]; let t82; $[21] !== t52 || $[22] !== t72 ? (t82 = /* @__PURE__ */ jsx(Box, { padding: 4, children: /* @__PURE__ */ jsx(Card, { border: !0, padding: 4, radius: 3, children: /* @__PURE__ */ jsxs(Stack, { space: 3, children: [ t52, t72 ] }) }) }), $[21] = t52, $[22] = t72, $[23] = t82) : t82 = $[23]; let t92; return $[24] !== t310 || $[25] !== t82 ? (t92 = /* @__PURE__ */ jsxs(Flex, { direction: "column", flex: 1, height: "fill", children: [ t310, t82 ] }), $[24] = t310, $[25] = t82, $[26] = t92) : t92 = $[26], t92; } const description = getVariantDescription(variant), conditionsText = getVariantConditionsText(variant.conditions), T0 = Flex, t1 = "column", t2 = 1, t3 = "fill", t4 = "hidden"; let t5; $[27] !== router ? (t5 = () => router.navigate({}), $[27] = router, $[28] = t5) : t5 = $[28]; let t6; $[29] !== t ? (t6 = t("detail.back"), $[29] = t, $[30] = t6) : t6 = $[30]; let t7; $[31] !== t5 || $[32] !== t6 ? (t7 = /* @__PURE__ */ jsx(Card, { borderBottom: !0, flex: "none", padding: 3, children: /* @__PURE__ */ jsx(Button, { mode: "bleed", onClick: t5, text: t6 }) }), $[31] = t5, $[32] = t6, $[33] = t7) : t7 = $[33]; const T1 = Flex, t8 = "column", t9 = 1, t10 = "fill", t11 = "hidden"; let t12; $[34] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t12 = { minHeight: 0 }, $[34] = t12) : t12 = $[34]; const T2 = Container, t13 = "none", t14 = 3, T3 = Flex, t15 = "column", t16 = 3, T4 = Card, t17 = 5, T5 = Flex, t18 = "flex-start", t19 = 4, t20 = "space-between", T6 = Stack, t21 = 3, T7 = Text, t22 = "h1", t23 = 4, t24 = "bold", t25 = getVariantTitle(variant); let t26; $[35] !== T7 || $[36] !== t25 ? (t26 = /* @__PURE__ */ jsx(T7, { as: t22, size: t23, weight: t24, children: t25 }), $[35] = T7, $[36] = t25, $[37] = t26) : t26 = $[37]; let t27; $[38] !== description || $[39] !== t ? (t27 = description || t("detail.no-description"), $[38] = description, $[39] = t, $[40] = t27) : t27 = $[40]; let t28; $[41] !== t27 ? (t28 = /* @__PURE__ */ jsx(Text, { muted: !0, size: 1, children: t27 }), $[41] = t27, $[42] = t28) : t28 = $[42]; let t29; $[43] !== T6 || $[44] !== t26 || $[45] !== t28 ? (t29 = /* @__PURE__ */ jsxs(T6, { space: t21, children: [ t26, t28 ] }), $[43] = T6, $[44] = t26, $[45] = t28, $[46] = t29) : t29 = $[46]; let t30; $[47] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t30 = () => setEditDialogOpen(!0), $[47] = t30) : t30 = $[47]; let t31; $[48] !== t ? (t31 = t("detail.action.edit-variant"), $[48] = t, $[49] = t31) : t31 = $[49]; let t32; $[50] !== t31 ? (t32 = /* @__PURE__ */ jsx(Button, { onClick: t30, text: t31 }), $[50] = t31, $[51] = t32) : t32 = $[51]; let t33; $[52] !== T5 || $[53] !== t29 || $[54] !== t32 ? (t33 = /* @__PURE__ */ jsxs(T5, { align: t18, gap: t19, justify: t20, children: [ t29, t32 ] }), $[52] = T5, $[53] = t29, $[54] = t32, $[55] = t33) : t33 = $[55]; let t34; $[56] !== t ? (t34 = t("dialog.create.conditions.title"), $[56] = t, $[57] = t34) : t34 = $[57]; let t35; $[58] !== t34 ? (t35 = /* @__PURE__ */ jsx(Text, { size: 1, weight: "medium", children: t34 }), $[58] = t34, $[59] = t35) : t35 = $[59]; let t36; $[60] !== conditionsText || $[61] !== t ? (t36 = conditionsText || t("overview.table.no-conditions"), $[60] = conditionsText, $[61] = t, $[62] = t36) : t36 = $[62]; let t37; $[63] !== t36 ? (t37 = /* @__PURE__ */ jsx(Text, { muted: !0, size: 1, children: t36 }), $[63] = t36, $[64] = t37) : t37 = $[64]; let t38; $[65] !== t35 || $[66] !== t37 ? (t38 = /* @__PURE__ */ jsx(Box, { paddingTop: 4, children: /* @__PURE__ */ jsxs(Stack, { space: 2, children: [ t35, t37 ] }) }), $[65] = t35, $[66] = t37, $[67] = t38) : t38 = $[67]; let t39; $[68] !== T4 || $[69] !== t33 || $[70] !== t38 ? (t39 = /* @__PURE__ */ jsxs(T4, { paddingY: t17, children: [ t33, t38 ] }), $[68] = T4, $[69] = t33, $[70] = t38, $[71] = t39) : t39 = $[71]; let t40; $[72] !== T3 || $[73] !== t39 ? (t40 = /* @__PURE__ */ jsx(T3, { direction: t15, paddingX: t16, children: t39 }), $[72] = T3, $[73] = t39, $[74] = t40) : t40 = $[74]; let t41; $[75] !== T2 || $[76] !== t40 ? (t41 = /* @__PURE__ */ jsx(T2, { flex: t13, width: t14, children: t40 }), $[75] = T2, $[76] = t40, $[77] = t41) : t41 = $[77]; let t42; $[78] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (t42 = { minHeight: 0 }, $[78] = t42) : t42 = $[78]; let t43; $[79] !== documents || $[80] !== documentsLoading ? (t43 = /* @__PURE__ */ jsx(Flex, { direction: "column", flex: 1, overflow: "hidden", style: t42, children: /* @__PURE__ */ jsx(VariantDocument