@payloadcms/ui 3.5.1-canary.e5c20f4 → 3.6.1-canary.4429857
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/elements/Autosave/index.d.ts.map +1 -1
- package/dist/elements/Autosave/index.js +22 -3
- package/dist/elements/Autosave/index.js.map +1 -1
- package/dist/elements/Button/index.d.ts +1 -1
- package/dist/elements/Button/index.d.ts.map +1 -1
- package/dist/elements/Button/index.js +4 -3
- package/dist/elements/Button/index.js.map +1 -1
- package/dist/elements/Button/types.d.ts +1 -0
- package/dist/elements/Button/types.d.ts.map +1 -1
- package/dist/elements/Button/types.js.map +1 -1
- package/dist/elements/CodeEditor/CodeEditor.js +39 -32
- package/dist/elements/CodeEditor/CodeEditor.js.map +1 -1
- package/dist/elements/CodeEditor/types.d.ts +4 -0
- package/dist/elements/CodeEditor/types.d.ts.map +1 -1
- package/dist/elements/CodeEditor/types.js.map +1 -1
- package/dist/elements/DocumentDrawer/DrawerHeader/index.d.ts.map +1 -1
- package/dist/elements/DocumentDrawer/DrawerHeader/index.js +5 -5
- package/dist/elements/DocumentDrawer/DrawerHeader/index.js.map +1 -1
- package/dist/elements/DocumentDrawer/index.d.ts +1 -1
- package/dist/elements/DocumentDrawer/index.d.ts.map +1 -1
- package/dist/elements/DocumentDrawer/index.js +3 -3
- package/dist/elements/DocumentDrawer/index.js.map +1 -1
- package/dist/elements/EditMany/index.d.ts.map +1 -1
- package/dist/elements/EditMany/index.js +66 -44
- package/dist/elements/EditMany/index.js.map +1 -1
- package/dist/elements/EditUpload/index.d.ts.map +1 -1
- package/dist/elements/EditUpload/index.js +4 -3
- package/dist/elements/EditUpload/index.js.map +1 -1
- package/dist/elements/FieldSelect/index.d.ts +2 -2
- package/dist/elements/FieldSelect/index.d.ts.map +1 -1
- package/dist/elements/FieldSelect/index.js.map +1 -1
- package/dist/elements/Gutter/index.d.ts +2 -1
- package/dist/elements/Gutter/index.d.ts.map +1 -1
- package/dist/elements/Gutter/index.js +4 -3
- package/dist/elements/Gutter/index.js.map +1 -1
- package/dist/elements/ListControls/getTextFieldsToBeSearched.d.ts.map +1 -1
- package/dist/elements/ListControls/getTextFieldsToBeSearched.js +2 -3
- package/dist/elements/ListControls/getTextFieldsToBeSearched.js.map +1 -1
- package/dist/elements/RelationshipTable/index.scss +16 -0
- package/dist/elements/TableColumns/buildColumnState.d.ts +3 -3
- package/dist/elements/TableColumns/buildColumnState.d.ts.map +1 -1
- package/dist/elements/TableColumns/buildColumnState.js +6 -7
- package/dist/elements/TableColumns/buildColumnState.js.map +1 -1
- package/dist/elements/TableColumns/filterFields.d.ts +4 -0
- package/dist/elements/TableColumns/filterFields.d.ts.map +1 -1
- package/dist/elements/TableColumns/filterFields.js +11 -6
- package/dist/elements/TableColumns/filterFields.js.map +1 -1
- package/dist/elements/TableColumns/getInitialColumns.d.ts +7 -2
- package/dist/elements/TableColumns/getInitialColumns.d.ts.map +1 -1
- package/dist/elements/TableColumns/getInitialColumns.js +5 -0
- package/dist/elements/TableColumns/getInitialColumns.js.map +1 -1
- package/dist/elements/TableColumns/index.d.ts.map +1 -1
- package/dist/elements/TableColumns/index.js +5 -2
- package/dist/elements/TableColumns/index.js.map +1 -1
- package/dist/elements/WhereBuilder/Condition/index.d.ts.map +1 -1
- package/dist/elements/WhereBuilder/Condition/index.js +100 -259
- package/dist/elements/WhereBuilder/Condition/index.js.map +1 -1
- package/dist/elements/WhereBuilder/reduceClientFields.js +1 -1
- package/dist/elements/WhereBuilder/reduceClientFields.js.map +1 -1
- package/dist/exports/client/{CodeEditor-FR4GQI3P.js → CodeEditor-W7RSWONH.js} +2 -2
- package/dist/exports/client/{chunk-RO7ZK4KN.js → chunk-3MXUY6XL.js} +6 -6
- package/dist/exports/client/chunk-3MXUY6XL.js.map +8 -0
- package/dist/exports/client/index.d.ts +12 -2
- package/dist/exports/client/index.d.ts.map +1 -1
- package/dist/exports/client/index.js +10 -10
- package/dist/exports/client/index.js.map +4 -4
- package/dist/exports/shared/index.js +2 -2
- package/dist/exports/shared/index.js.map +3 -3
- package/dist/forms/Form/index.d.ts.map +1 -1
- package/dist/forms/Form/index.js +25 -14
- package/dist/forms/Form/index.js.map +1 -1
- package/dist/forms/Form/types.d.ts +9 -2
- package/dist/forms/Form/types.d.ts.map +1 -1
- package/dist/forms/Form/types.js.map +1 -1
- package/dist/forms/Submit/index.d.ts +1 -1
- package/dist/forms/Submit/index.d.ts.map +1 -1
- package/dist/forms/Submit/index.js +5 -4
- package/dist/forms/Submit/index.js.map +1 -1
- package/dist/hooks/useUseAsTitle.d.ts.map +1 -1
- package/dist/hooks/useUseAsTitle.js +2 -2
- package/dist/hooks/useUseAsTitle.js.map +1 -1
- package/dist/providers/ListQuery/index.d.ts.map +1 -1
- package/dist/providers/ListQuery/index.js +1 -1
- package/dist/providers/ListQuery/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/utilities/buildTableState.d.ts.map +1 -1
- package/dist/utilities/buildTableState.js +4 -4
- package/dist/utilities/buildTableState.js.map +1 -1
- package/dist/utilities/getClientConfig.d.ts.map +1 -1
- package/dist/utilities/getClientConfig.js.map +1 -1
- package/dist/utilities/groupNavItems.d.ts.map +1 -1
- package/dist/utilities/groupNavItems.js +4 -0
- package/dist/utilities/groupNavItems.js.map +1 -1
- package/dist/utilities/renderTable.d.ts +4 -4
- package/dist/utilities/renderTable.d.ts.map +1 -1
- package/dist/utilities/renderTable.js +6 -5
- package/dist/utilities/renderTable.js.map +1 -1
- package/package.json +4 -4
- package/dist/exports/client/chunk-RO7ZK4KN.js.map +0 -8
- package/dist/utilities/flattenFieldMap.d.ts +0 -10
- package/dist/utilities/flattenFieldMap.d.ts.map +0 -1
- package/dist/utilities/flattenFieldMap.js +0 -26
- package/dist/utilities/flattenFieldMap.js.map +0 -1
- /package/dist/exports/client/{CodeEditor-FR4GQI3P.js.map → CodeEditor-W7RSWONH.js.map} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Autosave/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAGzE,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Autosave/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAGzE,OAAO,KAA2B,MAAM,OAAO,CAAA;AAkB/C,OAAO,cAAc,CAAA;AAMrB,MAAM,MAAM,KAAK,GAAG;IAClB,UAAU,CAAC,EAAE,sBAAsB,CAAA;IACnC,MAAM,CAAC,EAAE,kBAAkB,CAAA;IAC3B,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACpB,qBAAqB,EAAE,MAAM,CAAA;CAC9B,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA4QpC,CAAA"}
|
|
@@ -39,6 +39,8 @@ export const Autosave = ({
|
|
|
39
39
|
setLastUpdateTime,
|
|
40
40
|
setMostRecentVersionIsAutosaved
|
|
41
41
|
} = useDocumentInfo();
|
|
42
|
+
const queueRef = useRef([]);
|
|
43
|
+
const isProcessingRef = useRef(false);
|
|
42
44
|
const {
|
|
43
45
|
reportUpdate
|
|
44
46
|
} = useDocumentEvents();
|
|
@@ -80,6 +82,22 @@ export const Autosave = ({
|
|
|
80
82
|
// Store locale in ref so the autosave func
|
|
81
83
|
// can always retrieve the most to date locale
|
|
82
84
|
localeRef.current = locale;
|
|
85
|
+
const processQueue = React.useCallback(async () => {
|
|
86
|
+
if (isProcessingRef.current || queueRef.current.length === 0) {
|
|
87
|
+
return;
|
|
88
|
+
}
|
|
89
|
+
isProcessingRef.current = true;
|
|
90
|
+
const latestAction = queueRef.current[queueRef.current.length - 1];
|
|
91
|
+
queueRef.current = [];
|
|
92
|
+
try {
|
|
93
|
+
await latestAction();
|
|
94
|
+
} finally {
|
|
95
|
+
isProcessingRef.current = false;
|
|
96
|
+
if (queueRef.current.length > 0) {
|
|
97
|
+
await processQueue();
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
}, []);
|
|
83
101
|
// When debounced fields change, autosave
|
|
84
102
|
useIgnoredEffect(() => {
|
|
85
103
|
const abortController = new AbortController();
|
|
@@ -87,7 +105,7 @@ export const Autosave = ({
|
|
|
87
105
|
// We need to log the time in order to figure out if we need to trigger the state off later
|
|
88
106
|
let startTimestamp = undefined;
|
|
89
107
|
let endTimestamp = undefined;
|
|
90
|
-
const autosave = () => {
|
|
108
|
+
const autosave = async () => {
|
|
91
109
|
if (modified) {
|
|
92
110
|
startTimestamp = new Date().getTime();
|
|
93
111
|
setSaving(true);
|
|
@@ -115,7 +133,7 @@ export const Autosave = ({
|
|
|
115
133
|
data._status = 'draft';
|
|
116
134
|
const skipSubmission = submitted && !valid && versionsConfig?.drafts && versionsConfig?.drafts?.validate;
|
|
117
135
|
if (!skipSubmission) {
|
|
118
|
-
|
|
136
|
+
await fetch(url, {
|
|
119
137
|
body: JSON.stringify(data),
|
|
120
138
|
credentials: 'include',
|
|
121
139
|
headers: {
|
|
@@ -189,7 +207,8 @@ export const Autosave = ({
|
|
|
189
207
|
}
|
|
190
208
|
}
|
|
191
209
|
};
|
|
192
|
-
|
|
210
|
+
queueRef.current.push(autosave);
|
|
211
|
+
void processQueue();
|
|
193
212
|
return () => {
|
|
194
213
|
if (autosaveTimeout) {
|
|
195
214
|
clearTimeout(autosaveTimeout);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["versionDefaults","React","useRef","useState","toast","useAllFormFields","useForm","useFormModified","useFormSubmitted","useDebounce","useIgnoredEffect","useConfig","useDocumentEvents","useDocumentInfo","useLocale","useTranslation","formatTimeToNow","reduceFieldsToValuesWithValidation","baseClass","minimumAnimationTime","Autosave","id","collection","global","globalDoc","config","routes","api","serverURL","docConfig","incrementVersionCount","lastUpdateTime","mostRecentVersionIsAutosaved","setLastUpdateTime","setMostRecentVersionIsAutosaved","reportUpdate","dispatchFields","setSubmitted","submitted","versionsConfig","versions","fields","formModified","code","locale","i18n","t","interval","autosaveInterval","drafts","autosave","saving","setSaving","debouncedFields","modified","fieldRef","modifiedRef","localeRef","debouncedRef","current","abortController","AbortController","autosaveTimeout","undefined","startTimestamp","endTimestamp","Date","getTime","url","method","entitySlug","slug","data","valid","_status","skipSubmission","validate","fetch","body","JSON","stringify","credentials","headers","language","signal","then","res","newDate","status","updatedAt","toISOString","json","errors","Array","isArray","fieldErrors","nonFieldErrors","reduce","fieldErrs","nonFieldErrs","err","newFieldErrs","newNonFieldErrs","message","push","forEach","dataError","field","type","error","setTimeout","clearTimeout","abort","_jsxs","className","Boolean","_jsx","Fragment","distance","date"],"sources":["../../../src/elements/Autosave/index.tsx"],"sourcesContent":["'use client'\n// TODO: abstract the `next/navigation` dependency out from this component\nimport type { ClientCollectionConfig, ClientGlobalConfig } from 'payload'\n\nimport { versionDefaults } from 'payload/shared'\nimport React, { useEffect, useRef, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport {\n useAllFormFields,\n useForm,\n useFormModified,\n useFormSubmitted,\n} from '../../forms/Form/context.js'\nimport { useDebounce } from '../../hooks/useDebounce.js'\nimport { useIgnoredEffect } from '../../hooks/useIgnoredEffect.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentEvents } from '../../providers/DocumentEvents/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { formatTimeToNow } from '../../utilities/formatDate.js'\nimport { reduceFieldsToValuesWithValidation } from '../../utilities/reduceFieldsToValuesWithValidation.js'\nimport './index.scss'\n\nconst baseClass = 'autosave'\n// The minimum time the saving state should be shown\nconst minimumAnimationTime = 1000\n\nexport type Props = {\n collection?: ClientCollectionConfig\n global?: ClientGlobalConfig\n id?: number | string\n publishedDocUpdatedAt: string\n}\n\nexport const Autosave: React.FC<Props> = ({ id, collection, global: globalDoc }) => {\n const {\n config: {\n routes: { api },\n serverURL,\n },\n } = useConfig()\n const {\n docConfig,\n incrementVersionCount,\n lastUpdateTime,\n mostRecentVersionIsAutosaved,\n setLastUpdateTime,\n setMostRecentVersionIsAutosaved,\n } = useDocumentInfo()\n const { reportUpdate } = useDocumentEvents()\n const { dispatchFields, setSubmitted } = useForm()\n const submitted = useFormSubmitted()\n const versionsConfig = docConfig?.versions\n\n const [fields] = useAllFormFields()\n const formModified = useFormModified()\n const { code: locale } = useLocale()\n const { i18n, t } = useTranslation()\n\n let interval = versionDefaults.autosaveInterval\n if (versionsConfig.drafts && versionsConfig.drafts.autosave) {\n interval = versionsConfig.drafts.autosave.interval\n }\n\n const [saving, setSaving] = useState(false)\n const debouncedFields = useDebounce(fields, interval)\n const modified = useDebounce(formModified, interval)\n const fieldRef = useRef(fields)\n const modifiedRef = useRef(modified)\n const localeRef = useRef(locale)\n const debouncedRef = useRef(debouncedFields)\n\n debouncedRef.current = debouncedFields\n\n // Store fields in ref so the autosave func\n // can always retrieve the most to date copies\n // after the timeout has executed\n fieldRef.current = fields\n\n // Store modified in ref so the autosave func\n // can bail out if modified becomes false while\n // timing out during autosave\n modifiedRef.current = modified\n\n // Store locale in ref so the autosave func\n // can always retrieve the most to date locale\n localeRef.current = locale\n\n // When debounced fields change, autosave\n useIgnoredEffect(\n () => {\n const abortController = new AbortController()\n let autosaveTimeout = undefined\n // We need to log the time in order to figure out if we need to trigger the state off later\n let startTimestamp = undefined\n let endTimestamp = undefined\n\n const autosave = () => {\n if (modified) {\n startTimestamp = new Date().getTime()\n\n setSaving(true)\n\n let url: string\n let method: string\n let entitySlug: string\n\n if (collection && id) {\n entitySlug = collection.slug\n url = `${serverURL}${api}/${entitySlug}/${id}?draft=true&autosave=true&locale=${localeRef.current}`\n method = 'PATCH'\n }\n\n if (globalDoc) {\n entitySlug = globalDoc.slug\n url = `${serverURL}${api}/globals/${entitySlug}?draft=true&autosave=true&locale=${localeRef.current}`\n method = 'POST'\n }\n\n if (url) {\n if (modifiedRef.current) {\n const { data, valid } = {\n ...reduceFieldsToValuesWithValidation(fieldRef.current, true),\n }\n data._status = 'draft'\n const skipSubmission =\n submitted && !valid && versionsConfig?.drafts && versionsConfig?.drafts?.validate\n\n if (!skipSubmission) {\n void fetch(url, {\n body: JSON.stringify(data),\n credentials: 'include',\n headers: {\n 'Accept-Language': i18n.language,\n 'Content-Type': 'application/json',\n },\n method,\n signal: abortController.signal,\n })\n .then((res) => {\n const newDate = new Date()\n // We need to log the time in order to figure out if we need to trigger the state off later\n endTimestamp = newDate.getTime()\n\n if (res.status === 200) {\n setLastUpdateTime(newDate.getTime())\n\n reportUpdate({\n id,\n entitySlug,\n updatedAt: newDate.toISOString(),\n })\n\n if (!mostRecentVersionIsAutosaved) {\n incrementVersionCount()\n setMostRecentVersionIsAutosaved(true)\n }\n } else {\n return res.json()\n }\n })\n .then((json) => {\n if (\n versionsConfig?.drafts &&\n versionsConfig?.drafts?.validate &&\n json?.errors\n ) {\n if (Array.isArray(json.errors)) {\n const [fieldErrors, nonFieldErrors] = json.errors.reduce(\n ([fieldErrs, nonFieldErrs], err) => {\n const newFieldErrs = []\n const newNonFieldErrs = []\n\n if (err?.message) {\n newNonFieldErrs.push(err)\n }\n\n if (Array.isArray(err?.data)) {\n err.data.forEach((dataError) => {\n if (dataError?.field) {\n newFieldErrs.push(dataError)\n } else {\n newNonFieldErrs.push(dataError)\n }\n })\n }\n\n return [\n [...fieldErrs, ...newFieldErrs],\n [...nonFieldErrs, ...newNonFieldErrs],\n ]\n },\n [[], []],\n )\n\n dispatchFields({\n type: 'ADD_SERVER_ERRORS',\n errors: fieldErrors,\n })\n\n nonFieldErrors.forEach((err) => {\n toast.error(err.message || i18n.t('error:unknown'))\n })\n\n setSubmitted(true)\n setSaving(false)\n return\n }\n }\n })\n .then(() => {\n // If request was faster than minimum animation time, animate the difference\n if (endTimestamp - startTimestamp < minimumAnimationTime) {\n autosaveTimeout = setTimeout(\n () => {\n setSaving(false)\n },\n minimumAnimationTime - (endTimestamp - startTimestamp),\n )\n } else {\n setSaving(false)\n }\n })\n }\n }\n }\n }\n }\n\n void autosave()\n\n return () => {\n if (autosaveTimeout) {\n clearTimeout(autosaveTimeout)\n }\n if (abortController.signal) {\n try {\n abortController.abort('Autosave closed early.')\n } catch (error) {\n // swallow error\n }\n }\n setSaving(false)\n }\n },\n [debouncedFields],\n [\n api,\n collection,\n dispatchFields,\n globalDoc,\n i18n,\n id,\n interval,\n modified,\n reportUpdate,\n serverURL,\n setSubmitted,\n versionsConfig?.drafts,\n submitted,\n setLastUpdateTime,\n mostRecentVersionIsAutosaved,\n incrementVersionCount,\n setMostRecentVersionIsAutosaved,\n ],\n )\n\n return (\n <div className={baseClass}>\n {saving && t('general:saving')}\n {!saving && Boolean(lastUpdateTime) && (\n <React.Fragment>\n {t('version:lastSavedAgo', {\n distance: formatTimeToNow({ date: lastUpdateTime, i18n }),\n })}\n </React.Fragment>\n )}\n </div>\n )\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"index.js","names":["versionDefaults","React","useRef","useState","toast","useAllFormFields","useForm","useFormModified","useFormSubmitted","useDebounce","useIgnoredEffect","useConfig","useDocumentEvents","useDocumentInfo","useLocale","useTranslation","formatTimeToNow","reduceFieldsToValuesWithValidation","baseClass","minimumAnimationTime","Autosave","id","collection","global","globalDoc","config","routes","api","serverURL","docConfig","incrementVersionCount","lastUpdateTime","mostRecentVersionIsAutosaved","setLastUpdateTime","setMostRecentVersionIsAutosaved","queueRef","isProcessingRef","reportUpdate","dispatchFields","setSubmitted","submitted","versionsConfig","versions","fields","formModified","code","locale","i18n","t","interval","autosaveInterval","drafts","autosave","saving","setSaving","debouncedFields","modified","fieldRef","modifiedRef","localeRef","debouncedRef","current","processQueue","useCallback","length","latestAction","abortController","AbortController","autosaveTimeout","undefined","startTimestamp","endTimestamp","Date","getTime","url","method","entitySlug","slug","data","valid","_status","skipSubmission","validate","fetch","body","JSON","stringify","credentials","headers","language","signal","then","res","newDate","status","updatedAt","toISOString","json","errors","Array","isArray","fieldErrors","nonFieldErrors","reduce","fieldErrs","nonFieldErrs","err","newFieldErrs","newNonFieldErrs","message","push","forEach","dataError","field","type","error","setTimeout","clearTimeout","abort","_jsxs","className","Boolean","_jsx","Fragment","distance","date"],"sources":["../../../src/elements/Autosave/index.tsx"],"sourcesContent":["'use client'\n// TODO: abstract the `next/navigation` dependency out from this component\nimport type { ClientCollectionConfig, ClientGlobalConfig } from 'payload'\n\nimport { versionDefaults } from 'payload/shared'\nimport React, { useRef, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport {\n useAllFormFields,\n useForm,\n useFormModified,\n useFormSubmitted,\n} from '../../forms/Form/context.js'\nimport { useDebounce } from '../../hooks/useDebounce.js'\nimport { useIgnoredEffect } from '../../hooks/useIgnoredEffect.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentEvents } from '../../providers/DocumentEvents/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { formatTimeToNow } from '../../utilities/formatDate.js'\nimport { reduceFieldsToValuesWithValidation } from '../../utilities/reduceFieldsToValuesWithValidation.js'\nimport './index.scss'\n\nconst baseClass = 'autosave'\n// The minimum time the saving state should be shown\nconst minimumAnimationTime = 1000\n\nexport type Props = {\n collection?: ClientCollectionConfig\n global?: ClientGlobalConfig\n id?: number | string\n publishedDocUpdatedAt: string\n}\n\nexport const Autosave: React.FC<Props> = ({ id, collection, global: globalDoc }) => {\n const {\n config: {\n routes: { api },\n serverURL,\n },\n } = useConfig()\n const {\n docConfig,\n incrementVersionCount,\n lastUpdateTime,\n mostRecentVersionIsAutosaved,\n setLastUpdateTime,\n setMostRecentVersionIsAutosaved,\n } = useDocumentInfo()\n const queueRef = useRef([])\n const isProcessingRef = useRef(false)\n\n const { reportUpdate } = useDocumentEvents()\n const { dispatchFields, setSubmitted } = useForm()\n const submitted = useFormSubmitted()\n const versionsConfig = docConfig?.versions\n\n const [fields] = useAllFormFields()\n const formModified = useFormModified()\n const { code: locale } = useLocale()\n const { i18n, t } = useTranslation()\n\n let interval = versionDefaults.autosaveInterval\n if (versionsConfig.drafts && versionsConfig.drafts.autosave) {\n interval = versionsConfig.drafts.autosave.interval\n }\n\n const [saving, setSaving] = useState(false)\n const debouncedFields = useDebounce(fields, interval)\n const modified = useDebounce(formModified, interval)\n const fieldRef = useRef(fields)\n const modifiedRef = useRef(modified)\n const localeRef = useRef(locale)\n const debouncedRef = useRef(debouncedFields)\n\n debouncedRef.current = debouncedFields\n\n // Store fields in ref so the autosave func\n // can always retrieve the most to date copies\n // after the timeout has executed\n fieldRef.current = fields\n\n // Store modified in ref so the autosave func\n // can bail out if modified becomes false while\n // timing out during autosave\n modifiedRef.current = modified\n\n // Store locale in ref so the autosave func\n // can always retrieve the most to date locale\n localeRef.current = locale\n\n const processQueue = React.useCallback(async () => {\n if (isProcessingRef.current || queueRef.current.length === 0) {\n return\n }\n\n isProcessingRef.current = true\n const latestAction = queueRef.current[queueRef.current.length - 1]\n queueRef.current = []\n\n try {\n await latestAction()\n } finally {\n isProcessingRef.current = false\n if (queueRef.current.length > 0) {\n await processQueue()\n }\n }\n }, [])\n\n // When debounced fields change, autosave\n useIgnoredEffect(\n () => {\n const abortController = new AbortController()\n let autosaveTimeout = undefined\n // We need to log the time in order to figure out if we need to trigger the state off later\n let startTimestamp = undefined\n let endTimestamp = undefined\n\n const autosave = async () => {\n if (modified) {\n startTimestamp = new Date().getTime()\n\n setSaving(true)\n\n let url: string\n let method: string\n let entitySlug: string\n\n if (collection && id) {\n entitySlug = collection.slug\n url = `${serverURL}${api}/${entitySlug}/${id}?draft=true&autosave=true&locale=${localeRef.current}`\n method = 'PATCH'\n }\n\n if (globalDoc) {\n entitySlug = globalDoc.slug\n url = `${serverURL}${api}/globals/${entitySlug}?draft=true&autosave=true&locale=${localeRef.current}`\n method = 'POST'\n }\n\n if (url) {\n if (modifiedRef.current) {\n const { data, valid } = {\n ...reduceFieldsToValuesWithValidation(fieldRef.current, true),\n }\n data._status = 'draft'\n const skipSubmission =\n submitted && !valid && versionsConfig?.drafts && versionsConfig?.drafts?.validate\n\n if (!skipSubmission) {\n await fetch(url, {\n body: JSON.stringify(data),\n credentials: 'include',\n headers: {\n 'Accept-Language': i18n.language,\n 'Content-Type': 'application/json',\n },\n method,\n signal: abortController.signal,\n })\n .then((res) => {\n const newDate = new Date()\n // We need to log the time in order to figure out if we need to trigger the state off later\n endTimestamp = newDate.getTime()\n\n if (res.status === 200) {\n setLastUpdateTime(newDate.getTime())\n\n reportUpdate({\n id,\n entitySlug,\n updatedAt: newDate.toISOString(),\n })\n\n if (!mostRecentVersionIsAutosaved) {\n incrementVersionCount()\n setMostRecentVersionIsAutosaved(true)\n }\n } else {\n return res.json()\n }\n })\n .then((json) => {\n if (\n versionsConfig?.drafts &&\n versionsConfig?.drafts?.validate &&\n json?.errors\n ) {\n if (Array.isArray(json.errors)) {\n const [fieldErrors, nonFieldErrors] = json.errors.reduce(\n ([fieldErrs, nonFieldErrs], err) => {\n const newFieldErrs = []\n const newNonFieldErrs = []\n\n if (err?.message) {\n newNonFieldErrs.push(err)\n }\n\n if (Array.isArray(err?.data)) {\n err.data.forEach((dataError) => {\n if (dataError?.field) {\n newFieldErrs.push(dataError)\n } else {\n newNonFieldErrs.push(dataError)\n }\n })\n }\n\n return [\n [...fieldErrs, ...newFieldErrs],\n [...nonFieldErrs, ...newNonFieldErrs],\n ]\n },\n [[], []],\n )\n\n dispatchFields({\n type: 'ADD_SERVER_ERRORS',\n errors: fieldErrors,\n })\n\n nonFieldErrors.forEach((err) => {\n toast.error(err.message || i18n.t('error:unknown'))\n })\n\n setSubmitted(true)\n setSaving(false)\n return\n }\n }\n })\n .then(() => {\n // If request was faster than minimum animation time, animate the difference\n if (endTimestamp - startTimestamp < minimumAnimationTime) {\n autosaveTimeout = setTimeout(\n () => {\n setSaving(false)\n },\n minimumAnimationTime - (endTimestamp - startTimestamp),\n )\n } else {\n setSaving(false)\n }\n })\n }\n }\n }\n }\n }\n\n queueRef.current.push(autosave)\n void processQueue()\n\n return () => {\n if (autosaveTimeout) {\n clearTimeout(autosaveTimeout)\n }\n if (abortController.signal) {\n try {\n abortController.abort('Autosave closed early.')\n } catch (error) {\n // swallow error\n }\n }\n setSaving(false)\n }\n },\n [debouncedFields],\n [\n api,\n collection,\n dispatchFields,\n globalDoc,\n i18n,\n id,\n interval,\n modified,\n reportUpdate,\n serverURL,\n setSubmitted,\n versionsConfig?.drafts,\n submitted,\n setLastUpdateTime,\n mostRecentVersionIsAutosaved,\n incrementVersionCount,\n setMostRecentVersionIsAutosaved,\n ],\n )\n\n return (\n <div className={baseClass}>\n {saving && t('general:saving')}\n {!saving && Boolean(lastUpdateTime) && (\n <React.Fragment>\n {t('version:lastSavedAgo', {\n distance: formatTimeToNow({ date: lastUpdateTime, i18n }),\n })}\n </React.Fragment>\n )}\n </div>\n )\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -7,5 +7,5 @@ export declare const ButtonContents: ({ children, icon, showTooltip, tooltip }:
|
|
|
7
7
|
showTooltip: any;
|
|
8
8
|
tooltip: any;
|
|
9
9
|
}) => React.JSX.Element;
|
|
10
|
-
export declare const Button: React.
|
|
10
|
+
export declare const Button: React.FC<Props>;
|
|
11
11
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Button/index.tsx"],"names":[],"mappings":"AACA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Button/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmC,MAAM,OAAO,CAAA;AAEvD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAUvC,OAAO,cAAc,CAAA;AAarB,eAAO,MAAM,cAAc;;;;;uBAqB1B,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAqJlC,CAAA"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
|
|
3
3
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
4
|
-
import React, {
|
|
4
|
+
import React, { Fragment, isValidElement } from 'react';
|
|
5
5
|
import { ChevronIcon } from '../../icons/Chevron/index.js';
|
|
6
6
|
import { EditIcon } from '../../icons/Edit/index.js';
|
|
7
7
|
import { LinkIcon } from '../../icons/Link/index.js';
|
|
@@ -44,7 +44,7 @@ export const ButtonContents = ({
|
|
|
44
44
|
})]
|
|
45
45
|
});
|
|
46
46
|
};
|
|
47
|
-
export const Button =
|
|
47
|
+
export const Button = props => {
|
|
48
48
|
const {
|
|
49
49
|
id,
|
|
50
50
|
type = 'button',
|
|
@@ -61,6 +61,7 @@ export const Button = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
61
61
|
newTab,
|
|
62
62
|
onClick,
|
|
63
63
|
onMouseDown,
|
|
64
|
+
ref,
|
|
64
65
|
round,
|
|
65
66
|
size = 'medium',
|
|
66
67
|
SubMenuPopupContent,
|
|
@@ -172,5 +173,5 @@ export const Button = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
172
173
|
});
|
|
173
174
|
}
|
|
174
175
|
return buttonElement;
|
|
175
|
-
}
|
|
176
|
+
};
|
|
176
177
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","forwardRef","Fragment","isValidElement","ChevronIcon","EditIcon","LinkIcon","PlusIcon","SwapIcon","XIcon","Popup","Tooltip","icons","chevron","edit","link","plus","swap","x","baseClass","ButtonContents","children","icon","showTooltip","tooltip","BuiltInIcon","_jsxs","_jsx","className","show","Button","props","ref","id","type","ariaLabel","buttonStyle","disabled","el","iconPosition","iconStyle","Link","newTab","onClick","onMouseDown","round","size","SubMenuPopupContent","to","url","setShowTooltip","useState","classes","filter","Boolean","join","handleClick","event","preventDefault","styleClasses","buttonProps","undefined","onPointerEnter","onPointerLeave","rel","target","buttonElement","prefetch","href","console","error","LinkTag","Tag","button","buttonSize","horizontalAlign","noBackground","render","close","verticalAlign"],"sources":["../../../src/elements/Button/index.tsx"],"sourcesContent":["'use client'\nimport React, { forwardRef, Fragment, isValidElement } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { EditIcon } from '../../icons/Edit/index.js'\nimport { LinkIcon } from '../../icons/Link/index.js'\nimport { PlusIcon } from '../../icons/Plus/index.js'\nimport { SwapIcon } from '../../icons/Swap/index.js'\nimport { XIcon } from '../../icons/X/index.js'\nimport { Popup } from '../Popup/index.js'\nimport { Tooltip } from '../Tooltip/index.js'\nimport './index.scss'\n\nconst icons = {\n chevron: ChevronIcon,\n edit: EditIcon,\n link: LinkIcon,\n plus: PlusIcon,\n swap: SwapIcon,\n x: XIcon,\n}\n\nconst baseClass = 'btn'\n\nexport const ButtonContents = ({ children, icon, showTooltip, tooltip }) => {\n const BuiltInIcon = icons[icon]\n\n return (\n <Fragment>\n {tooltip && (\n <Tooltip className={`${baseClass}__tooltip`} show={showTooltip}>\n {tooltip}\n </Tooltip>\n )}\n <span className={`${baseClass}__content`}>\n {children && <span className={`${baseClass}__label`}>{children}</span>}\n {icon && (\n <span className={`${baseClass}__icon`}>\n {isValidElement(icon) && icon}\n {BuiltInIcon && <BuiltInIcon />}\n </span>\n )}\n </span>\n </Fragment>\n )\n}\n\nexport const Button = forwardRef<HTMLAnchorElement | HTMLButtonElement, Props>((props, ref) => {\n const {\n id,\n type = 'button',\n 'aria-label': ariaLabel,\n buttonStyle = 'primary',\n children,\n className,\n disabled,\n el = 'button',\n icon,\n iconPosition = 'right',\n iconStyle = 'without-border',\n Link,\n newTab,\n onClick,\n onMouseDown,\n round,\n size = 'medium',\n SubMenuPopupContent,\n to,\n tooltip,\n url,\n } = props\n\n const [showTooltip, setShowTooltip] = React.useState(false)\n\n const classes = [\n baseClass,\n className && className,\n icon && `${baseClass}--icon`,\n iconStyle && `${baseClass}--icon-style-${iconStyle}`,\n icon && !children && `${baseClass}--icon-only`,\n size && `${baseClass}--size-${size}`,\n icon && iconPosition && `${baseClass}--icon-position-${iconPosition}`,\n tooltip && `${baseClass}--has-tooltip`,\n !SubMenuPopupContent && `${baseClass}--withoutPopup`,\n ]\n .filter(Boolean)\n .join(' ')\n\n function handleClick(event) {\n setShowTooltip(false)\n if (type !== 'submit' && onClick) {\n event.preventDefault()\n }\n if (onClick) {\n onClick(event)\n }\n }\n\n const styleClasses = [\n buttonStyle && `${baseClass}--style-${buttonStyle}`,\n disabled && `${baseClass}--disabled`,\n round && `${baseClass}--round`,\n SubMenuPopupContent ? `${baseClass}--withPopup` : `${baseClass}--withoutPopup`,\n ]\n .filter(Boolean)\n .join(' ')\n\n const buttonProps = {\n id,\n type,\n 'aria-disabled': disabled,\n 'aria-label': ariaLabel,\n className: !SubMenuPopupContent ? [classes, styleClasses].join(' ') : classes,\n disabled,\n onClick: !disabled ? handleClick : undefined,\n onMouseDown: !disabled ? onMouseDown : undefined,\n onPointerEnter: tooltip ? () => setShowTooltip(true) : undefined,\n onPointerLeave: tooltip ? () => setShowTooltip(false) : undefined,\n rel: newTab ? 'noopener noreferrer' : undefined,\n target: newTab ? '_blank' : undefined,\n }\n\n let buttonElement\n let prefetch\n\n switch (el) {\n case 'anchor':\n buttonElement = (\n <a\n {...buttonProps}\n href={!disabled ? url : undefined}\n ref={ref as React.Ref<HTMLAnchorElement>}\n >\n <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n {children}\n </ButtonContents>\n </a>\n )\n break\n\n case 'link':\n if (!Link) {\n console.error('Link is required when using el=\"link\"', children)\n return null\n }\n\n let LinkTag = Link // eslint-disable-line no-case-declarations\n\n if (disabled) {\n LinkTag = 'div'\n } else {\n prefetch = false\n }\n\n buttonElement = (\n <LinkTag {...buttonProps} href={to || url} prefetch={prefetch} to={to || url}>\n <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n {children}\n </ButtonContents>\n </LinkTag>\n )\n break\n\n default:\n const Tag = el // eslint-disable-line no-case-declarations\n\n buttonElement = (\n <Tag ref={ref} type=\"submit\" {...buttonProps}>\n <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n {children}\n </ButtonContents>\n </Tag>\n )\n break\n }\n if (SubMenuPopupContent) {\n return (\n <div className={styleClasses}>\n {buttonElement}\n <Popup\n button={<ChevronIcon />}\n buttonSize={size}\n className={disabled ? `${baseClass}--popup-disabled` : ''}\n disabled={disabled}\n horizontalAlign=\"right\"\n noBackground\n render={({ close }) => SubMenuPopupContent({ close: () => close() })}\n size=\"large\"\n verticalAlign=\"bottom\"\n />\n </div>\n )\n }\n\n return buttonElement\n})\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","Fragment","isValidElement","ChevronIcon","EditIcon","LinkIcon","PlusIcon","SwapIcon","XIcon","Popup","Tooltip","icons","chevron","edit","link","plus","swap","x","baseClass","ButtonContents","children","icon","showTooltip","tooltip","BuiltInIcon","_jsxs","_jsx","className","show","Button","props","id","type","ariaLabel","buttonStyle","disabled","el","iconPosition","iconStyle","Link","newTab","onClick","onMouseDown","ref","round","size","SubMenuPopupContent","to","url","setShowTooltip","useState","classes","filter","Boolean","join","handleClick","event","preventDefault","styleClasses","buttonProps","undefined","onPointerEnter","onPointerLeave","rel","target","buttonElement","prefetch","href","console","error","LinkTag","Tag","button","buttonSize","horizontalAlign","noBackground","render","close","verticalAlign"],"sources":["../../../src/elements/Button/index.tsx"],"sourcesContent":["'use client'\nimport React, { Fragment, isValidElement } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { EditIcon } from '../../icons/Edit/index.js'\nimport { LinkIcon } from '../../icons/Link/index.js'\nimport { PlusIcon } from '../../icons/Plus/index.js'\nimport { SwapIcon } from '../../icons/Swap/index.js'\nimport { XIcon } from '../../icons/X/index.js'\nimport { Popup } from '../Popup/index.js'\nimport { Tooltip } from '../Tooltip/index.js'\nimport './index.scss'\n\nconst icons = {\n chevron: ChevronIcon,\n edit: EditIcon,\n link: LinkIcon,\n plus: PlusIcon,\n swap: SwapIcon,\n x: XIcon,\n}\n\nconst baseClass = 'btn'\n\nexport const ButtonContents = ({ children, icon, showTooltip, tooltip }) => {\n const BuiltInIcon = icons[icon]\n\n return (\n <Fragment>\n {tooltip && (\n <Tooltip className={`${baseClass}__tooltip`} show={showTooltip}>\n {tooltip}\n </Tooltip>\n )}\n <span className={`${baseClass}__content`}>\n {children && <span className={`${baseClass}__label`}>{children}</span>}\n {icon && (\n <span className={`${baseClass}__icon`}>\n {isValidElement(icon) && icon}\n {BuiltInIcon && <BuiltInIcon />}\n </span>\n )}\n </span>\n </Fragment>\n )\n}\n\nexport const Button: React.FC<Props> = (props) => {\n const {\n id,\n type = 'button',\n 'aria-label': ariaLabel,\n buttonStyle = 'primary',\n children,\n className,\n disabled,\n el = 'button',\n icon,\n iconPosition = 'right',\n iconStyle = 'without-border',\n Link,\n newTab,\n onClick,\n onMouseDown,\n ref,\n round,\n size = 'medium',\n SubMenuPopupContent,\n to,\n tooltip,\n url,\n } = props\n\n const [showTooltip, setShowTooltip] = React.useState(false)\n\n const classes = [\n baseClass,\n className && className,\n icon && `${baseClass}--icon`,\n iconStyle && `${baseClass}--icon-style-${iconStyle}`,\n icon && !children && `${baseClass}--icon-only`,\n size && `${baseClass}--size-${size}`,\n icon && iconPosition && `${baseClass}--icon-position-${iconPosition}`,\n tooltip && `${baseClass}--has-tooltip`,\n !SubMenuPopupContent && `${baseClass}--withoutPopup`,\n ]\n .filter(Boolean)\n .join(' ')\n\n function handleClick(event) {\n setShowTooltip(false)\n if (type !== 'submit' && onClick) {\n event.preventDefault()\n }\n if (onClick) {\n onClick(event)\n }\n }\n\n const styleClasses = [\n buttonStyle && `${baseClass}--style-${buttonStyle}`,\n disabled && `${baseClass}--disabled`,\n round && `${baseClass}--round`,\n SubMenuPopupContent ? `${baseClass}--withPopup` : `${baseClass}--withoutPopup`,\n ]\n .filter(Boolean)\n .join(' ')\n\n const buttonProps = {\n id,\n type,\n 'aria-disabled': disabled,\n 'aria-label': ariaLabel,\n className: !SubMenuPopupContent ? [classes, styleClasses].join(' ') : classes,\n disabled,\n onClick: !disabled ? handleClick : undefined,\n onMouseDown: !disabled ? onMouseDown : undefined,\n onPointerEnter: tooltip ? () => setShowTooltip(true) : undefined,\n onPointerLeave: tooltip ? () => setShowTooltip(false) : undefined,\n rel: newTab ? 'noopener noreferrer' : undefined,\n target: newTab ? '_blank' : undefined,\n }\n\n let buttonElement\n let prefetch\n\n switch (el) {\n case 'anchor':\n buttonElement = (\n <a\n {...buttonProps}\n href={!disabled ? url : undefined}\n ref={ref as React.RefObject<HTMLAnchorElement>}\n >\n <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n {children}\n </ButtonContents>\n </a>\n )\n break\n\n case 'link':\n if (!Link) {\n console.error('Link is required when using el=\"link\"', children)\n return null\n }\n\n let LinkTag = Link // eslint-disable-line no-case-declarations\n\n if (disabled) {\n LinkTag = 'div'\n } else {\n prefetch = false\n }\n\n buttonElement = (\n <LinkTag {...buttonProps} href={to || url} prefetch={prefetch} to={to || url}>\n <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n {children}\n </ButtonContents>\n </LinkTag>\n )\n break\n\n default:\n const Tag = el // eslint-disable-line no-case-declarations\n\n buttonElement = (\n <Tag ref={ref} type=\"submit\" {...buttonProps}>\n <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n {children}\n </ButtonContents>\n </Tag>\n )\n break\n }\n if (SubMenuPopupContent) {\n return (\n <div className={styleClasses}>\n {buttonElement}\n <Popup\n button={<ChevronIcon />}\n buttonSize={size}\n className={disabled ? `${baseClass}--popup-disabled` : ''}\n disabled={disabled}\n horizontalAlign=\"right\"\n noBackground\n render={({ close }) => SubMenuPopupContent({ close: () => close() })}\n size=\"large\"\n verticalAlign=\"bottom\"\n />\n </div>\n )\n }\n\n return buttonElement\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -28,6 +28,7 @@ export type Props = {
|
|
|
28
28
|
* @default false
|
|
29
29
|
*/
|
|
30
30
|
programmaticSubmit?: boolean;
|
|
31
|
+
ref?: React.RefObject<HTMLAnchorElement | HTMLButtonElement | null>;
|
|
31
32
|
round?: boolean;
|
|
32
33
|
secondaryActions?: secondaryAction | secondaryAction[];
|
|
33
34
|
size?: 'large' | 'medium' | 'small';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/Button/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACpD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,KAAK,eAAe,GAAG;IACrB,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAA;CACrC,CAAA;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/Button/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACpD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,KAAK,eAAe,GAAG;IACrB,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAA;CACrC,CAAA;AAED,MAAM,MAAM,KAAK,GAAG;IAClB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,WAAW,CAAC,EAAE,OAAO,GAAG,YAAY,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,WAAW,GAAG,aAAa,CAAA;IAChG,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,EAAE,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,WAAW,CAAA;IACpC,IAAI,CAAC,EAAE,CAAC,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,GAAG,CAAC,GAAG,KAAK,CAAC,SAAS,CAAA;IAC5D,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC/B,SAAS,CAAC,EAAE,MAAM,GAAG,aAAa,GAAG,gBAAgB,CAAA;IACrD,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,IAAI,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;IACxB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAA;IACrC,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAA;IACzC;;;;;;OAMG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,GAAG,iBAAiB,GAAG,IAAI,CAAC,CAAA;IACnE,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,gBAAgB,CAAC,EAAE,eAAe,GAAG,eAAe,EAAE,CAAA;IACtD,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IACnC,mBAAmB,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,KAAK,CAAC,SAAS,CAAA;IACvE,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAA;IAC1B,GAAG,CAAC,EAAE,MAAM,CAAA;CACb,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/Button/types.ts"],"sourcesContent":["import type { ElementType, MouseEvent } from 'react'\nimport type React from 'react'\n\ntype secondaryAction = {\n label: string\n onClick: (event: MouseEvent) => void\n}\nexport type Props = {\n 'aria-label'?: string\n buttonId?: string\n buttonStyle?: 'error' | 'icon-label' | 'none' | 'pill' | 'primary' | 'secondary' | 'transparent'\n children?: React.ReactNode\n className?: string\n disabled?: boolean\n el?: 'anchor' | 'link' | ElementType\n icon?: ['chevron' | 'edit' | 'plus' | 'x'] | React.ReactNode\n iconPosition?: 'left' | 'right'\n iconStyle?: 'none' | 'with-border' | 'without-border'\n id?: string\n Link?: React.ElementType\n newTab?: boolean\n onClick?: (event: MouseEvent) => void\n onMouseDown?: (event: MouseEvent) => void\n /**\n * Enables form submission via an onClick handler. This is only needed if\n * type=\"submit\" does not trigger form submission, e.g. if the button DOM\n * element is not a direct child of the form element.\n *\n * @default false\n */\n programmaticSubmit?: boolean\n round?: boolean\n secondaryActions?: secondaryAction | secondaryAction[]\n size?: 'large' | 'medium' | 'small'\n SubMenuPopupContent?: (props: { close: () => void }) => React.ReactNode\n to?: string\n tooltip?: string\n type?: 'button' | 'submit'\n url?: string\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/Button/types.ts"],"sourcesContent":["import type { ElementType, MouseEvent } from 'react'\nimport type React from 'react'\n\ntype secondaryAction = {\n label: string\n onClick: (event: MouseEvent) => void\n}\n\nexport type Props = {\n 'aria-label'?: string\n buttonId?: string\n buttonStyle?: 'error' | 'icon-label' | 'none' | 'pill' | 'primary' | 'secondary' | 'transparent'\n children?: React.ReactNode\n className?: string\n disabled?: boolean\n el?: 'anchor' | 'link' | ElementType\n icon?: ['chevron' | 'edit' | 'plus' | 'x'] | React.ReactNode\n iconPosition?: 'left' | 'right'\n iconStyle?: 'none' | 'with-border' | 'without-border'\n id?: string\n Link?: React.ElementType\n newTab?: boolean\n onClick?: (event: MouseEvent) => void\n onMouseDown?: (event: MouseEvent) => void\n /**\n * Enables form submission via an onClick handler. This is only needed if\n * type=\"submit\" does not trigger form submission, e.g. if the button DOM\n * element is not a direct child of the form element.\n *\n * @default false\n */\n programmaticSubmit?: boolean\n ref?: React.RefObject<HTMLAnchorElement | HTMLButtonElement | null>\n round?: boolean\n secondaryActions?: secondaryAction | secondaryAction[]\n size?: 'large' | 'medium' | 'small'\n SubMenuPopupContent?: (props: { close: () => void }) => React.ReactNode\n to?: string\n tooltip?: string\n type?: 'button' | 'submit'\n url?: string\n}\n"],"mappings":"AAQA","ignoreList":[]}
|
|
@@ -10,9 +10,10 @@ import './index.scss';
|
|
|
10
10
|
const Editor = EditorImport.default || EditorImport;
|
|
11
11
|
const baseClass = 'code-editor';
|
|
12
12
|
const CodeEditor = props => {
|
|
13
|
-
const $ = _c(
|
|
13
|
+
const $ = _c(24);
|
|
14
14
|
let className;
|
|
15
15
|
let maxHeight;
|
|
16
|
+
let minHeight;
|
|
16
17
|
let options;
|
|
17
18
|
let readOnly;
|
|
18
19
|
let rest;
|
|
@@ -20,6 +21,7 @@ const CodeEditor = props => {
|
|
|
20
21
|
({
|
|
21
22
|
className,
|
|
22
23
|
maxHeight,
|
|
24
|
+
minHeight,
|
|
23
25
|
options,
|
|
24
26
|
readOnly,
|
|
25
27
|
...rest
|
|
@@ -27,52 +29,56 @@ const CodeEditor = props => {
|
|
|
27
29
|
$[0] = props;
|
|
28
30
|
$[1] = className;
|
|
29
31
|
$[2] = maxHeight;
|
|
30
|
-
$[3] =
|
|
31
|
-
$[4] =
|
|
32
|
-
$[5] =
|
|
32
|
+
$[3] = minHeight;
|
|
33
|
+
$[4] = options;
|
|
34
|
+
$[5] = readOnly;
|
|
35
|
+
$[6] = rest;
|
|
33
36
|
} else {
|
|
34
37
|
className = $[1];
|
|
35
38
|
maxHeight = $[2];
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
+
minHeight = $[3];
|
|
40
|
+
options = $[4];
|
|
41
|
+
readOnly = $[5];
|
|
42
|
+
rest = $[6];
|
|
39
43
|
}
|
|
40
|
-
const
|
|
44
|
+
const MIN_HEIGHT = minHeight ?? 56;
|
|
45
|
+
const [dynamicHeight, setDynamicHeight] = useState(MIN_HEIGHT);
|
|
41
46
|
const {
|
|
42
47
|
theme
|
|
43
48
|
} = useTheme();
|
|
44
49
|
const t0 = rest?.defaultLanguage ? `language--${rest.defaultLanguage}` : "";
|
|
45
50
|
const t1 = readOnly && "read-only";
|
|
46
51
|
let t2;
|
|
47
|
-
if ($[
|
|
52
|
+
if ($[7] !== className || $[8] !== t0 || $[9] !== t1) {
|
|
48
53
|
t2 = [baseClass, className, t0, t1].filter(Boolean);
|
|
49
|
-
$[
|
|
50
|
-
$[
|
|
51
|
-
$[
|
|
52
|
-
$[
|
|
54
|
+
$[7] = className;
|
|
55
|
+
$[8] = t0;
|
|
56
|
+
$[9] = t1;
|
|
57
|
+
$[10] = t2;
|
|
53
58
|
} else {
|
|
54
|
-
t2 = $[
|
|
59
|
+
t2 = $[10];
|
|
55
60
|
}
|
|
56
61
|
const classes = t2.join(" ");
|
|
57
62
|
let t3;
|
|
58
|
-
if ($[
|
|
63
|
+
if ($[11] !== MIN_HEIGHT || $[12] !== classes || $[13] !== dynamicHeight || $[14] !== maxHeight || $[15] !== options || $[16] !== readOnly || $[17] !== rest || $[18] !== theme) {
|
|
59
64
|
let t4;
|
|
60
65
|
let t5;
|
|
61
|
-
if ($[
|
|
66
|
+
if ($[20] !== MIN_HEIGHT || $[21] !== rest) {
|
|
62
67
|
t4 = (value, ev) => {
|
|
63
68
|
rest.onChange?.(value, ev);
|
|
64
|
-
setDynamicHeight(Math.max(
|
|
69
|
+
setDynamicHeight(Math.max(MIN_HEIGHT, value.split("\n").length * 18 + 2));
|
|
65
70
|
};
|
|
66
71
|
t5 = (editor, monaco) => {
|
|
67
72
|
rest.onMount?.(editor, monaco);
|
|
68
|
-
setDynamicHeight(Math.max(
|
|
73
|
+
setDynamicHeight(Math.max(MIN_HEIGHT, editor.getValue().split("\n").length * 18 + 2));
|
|
69
74
|
};
|
|
70
|
-
$[
|
|
71
|
-
$[
|
|
72
|
-
$[
|
|
75
|
+
$[20] = MIN_HEIGHT;
|
|
76
|
+
$[21] = rest;
|
|
77
|
+
$[22] = t4;
|
|
78
|
+
$[23] = t5;
|
|
73
79
|
} else {
|
|
74
|
-
t4 = $[
|
|
75
|
-
t5 = $[
|
|
80
|
+
t4 = $[22];
|
|
81
|
+
t5 = $[23];
|
|
76
82
|
}
|
|
77
83
|
t3 = _jsx(Editor, {
|
|
78
84
|
className: classes,
|
|
@@ -101,16 +107,17 @@ const CodeEditor = props => {
|
|
|
101
107
|
onChange: t4,
|
|
102
108
|
onMount: t5
|
|
103
109
|
});
|
|
104
|
-
$[
|
|
105
|
-
$[
|
|
106
|
-
$[
|
|
107
|
-
$[
|
|
108
|
-
$[
|
|
109
|
-
$[
|
|
110
|
-
$[
|
|
111
|
-
$[
|
|
110
|
+
$[11] = MIN_HEIGHT;
|
|
111
|
+
$[12] = classes;
|
|
112
|
+
$[13] = dynamicHeight;
|
|
113
|
+
$[14] = maxHeight;
|
|
114
|
+
$[15] = options;
|
|
115
|
+
$[16] = readOnly;
|
|
116
|
+
$[17] = rest;
|
|
117
|
+
$[18] = theme;
|
|
118
|
+
$[19] = t3;
|
|
112
119
|
} else {
|
|
113
|
-
t3 = $[
|
|
120
|
+
t3 = $[19];
|
|
114
121
|
}
|
|
115
122
|
return t3;
|
|
116
123
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeEditor.js","names":["c","_c","EditorImport","React","useState","useTheme","ShimmerEffect","Editor","default","baseClass","CodeEditor","props","$","className","maxHeight","options","readOnly","rest","dynamicHeight","setDynamicHeight","theme","t0","defaultLanguage","t1","t2","filter","Boolean","classes","join","t3","t4","t5","value","ev","onChange","Math","max","split","length","editor","monaco","onMount","getValue","_jsx","loading","height","scrollbar","alwaysConsumeMouseWheel","scrollBeyondLastLine","tabSize","wordWrap","min"],"sources":["../../../src/elements/CodeEditor/CodeEditor.tsx"],"sourcesContent":["'use client'\nimport EditorImport from '@monaco-editor/react'\nimport React, { useState } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { useTheme } from '../../providers/Theme/index.js'\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\nimport './index.scss'\n\nconst Editor = (EditorImport.default || EditorImport) as unknown as typeof EditorImport.default\n\nconst baseClass = 'code-editor'\n\nconst CodeEditor: React.FC<Props> = (props) => {\n const { className, maxHeight, options, readOnly, ...rest } = props\n const [dynamicHeight, setDynamicHeight] = useState(
|
|
1
|
+
{"version":3,"file":"CodeEditor.js","names":["c","_c","EditorImport","React","useState","useTheme","ShimmerEffect","Editor","default","baseClass","CodeEditor","props","$","className","maxHeight","minHeight","options","readOnly","rest","MIN_HEIGHT","dynamicHeight","setDynamicHeight","theme","t0","defaultLanguage","t1","t2","filter","Boolean","classes","join","t3","t4","t5","value","ev","onChange","Math","max","split","length","editor","monaco","onMount","getValue","_jsx","loading","height","scrollbar","alwaysConsumeMouseWheel","scrollBeyondLastLine","tabSize","wordWrap","min"],"sources":["../../../src/elements/CodeEditor/CodeEditor.tsx"],"sourcesContent":["'use client'\nimport EditorImport from '@monaco-editor/react'\nimport React, { useState } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { useTheme } from '../../providers/Theme/index.js'\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\nimport './index.scss'\n\nconst Editor = (EditorImport.default || EditorImport) as unknown as typeof EditorImport.default\n\nconst baseClass = 'code-editor'\n\nconst CodeEditor: React.FC<Props> = (props) => {\n const { className, maxHeight, minHeight, options, readOnly, ...rest } = props\n const MIN_HEIGHT = minHeight ?? 56 // equivalent to 3 lines\n\n const [dynamicHeight, setDynamicHeight] = useState(MIN_HEIGHT)\n const { theme } = useTheme()\n\n const classes = [\n baseClass,\n className,\n rest?.defaultLanguage ? `language--${rest.defaultLanguage}` : '',\n readOnly && 'read-only',\n ]\n .filter(Boolean)\n .join(' ')\n\n return (\n <Editor\n className={classes}\n loading={<ShimmerEffect height={dynamicHeight} />}\n options={{\n detectIndentation: true,\n hideCursorInOverviewRuler: true,\n minimap: {\n enabled: false,\n },\n overviewRulerBorder: false,\n readOnly: Boolean(readOnly),\n scrollbar: {\n alwaysConsumeMouseWheel: false,\n },\n scrollBeyondLastLine: false,\n tabSize: 2,\n wordWrap: 'on',\n ...options,\n }}\n theme={theme === 'dark' ? 'vs-dark' : 'vs'}\n {...rest}\n // Since we are not building an IDE and the container\n // can already have scrolling, we want the height of the\n // editor to fit its content.\n // See: https://github.com/microsoft/monaco-editor/discussions/3677\n height={maxHeight ? Math.min(dynamicHeight, maxHeight) : dynamicHeight}\n onChange={(value, ev) => {\n rest.onChange?.(value, ev)\n setDynamicHeight(Math.max(MIN_HEIGHT, value.split('\\n').length * 18 + 2))\n }}\n onMount={(editor, monaco) => {\n rest.onMount?.(editor, monaco)\n setDynamicHeight(Math.max(MIN_HEIGHT, editor.getValue().split('\\n').length * 18 + 2))\n }}\n />\n )\n}\n\n// eslint-disable-next-line no-restricted-exports\nexport default CodeEditor\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/CodeEditor/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAA;AAEvD,MAAM,MAAM,KAAK,GAAG;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,WAAW,CAAA"}
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/CodeEditor/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAA;AAEvD,MAAM,MAAM,KAAK,GAAG;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,WAAW,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/CodeEditor/types.ts"],"sourcesContent":["import type { EditorProps } from '@monaco-editor/react'\n\nexport type Props = {\n maxHeight?: number\n readOnly?: boolean\n} & EditorProps\n"],"mappings":"AAEA","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/CodeEditor/types.ts"],"sourcesContent":["import type { EditorProps } from '@monaco-editor/react'\n\nexport type Props = {\n maxHeight?: number\n /**\n * @default 56 (3 lines)\n */\n minHeight?: number\n readOnly?: boolean\n} & EditorProps\n"],"mappings":"AAEA","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/DocumentDrawer/DrawerHeader/index.tsx"],"names":[],"mappings":"AAUA,OAAO,cAAc,CAAA;AAErB,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC;IAC1C,UAAU,EAAE,MAAM,CAAA;CACnB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/DocumentDrawer/DrawerHeader/index.tsx"],"names":[],"mappings":"AAUA,OAAO,cAAc,CAAA;AAErB,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC;IAC1C,UAAU,EAAE,MAAM,CAAA;CACnB,CAsBA,CAAA"}
|
|
@@ -9,7 +9,7 @@ import { XIcon } from '../../../icons/X/index.js';
|
|
|
9
9
|
import { useDocumentInfo } from '../../../providers/DocumentInfo/index.js';
|
|
10
10
|
import { useTranslation } from '../../../providers/Translation/index.js';
|
|
11
11
|
import { IDLabel } from '../../IDLabel/index.js';
|
|
12
|
-
import {
|
|
12
|
+
import { documentDrawerBaseClass } from '../index.js';
|
|
13
13
|
import './index.scss';
|
|
14
14
|
export const DocumentDrawerHeader = t0 => {
|
|
15
15
|
const $ = _c(7);
|
|
@@ -34,17 +34,17 @@ export const DocumentDrawerHeader = t0 => {
|
|
|
34
34
|
t2 = $[6];
|
|
35
35
|
}
|
|
36
36
|
t1 = _jsxs(Gutter, {
|
|
37
|
-
className: `${
|
|
37
|
+
className: `${documentDrawerBaseClass}__header`,
|
|
38
38
|
children: [_jsxs("div", {
|
|
39
|
-
className: `${
|
|
39
|
+
className: `${documentDrawerBaseClass}__header-content`,
|
|
40
40
|
children: [_jsx("h2", {
|
|
41
|
-
className: `${
|
|
41
|
+
className: `${documentDrawerBaseClass}__header-text`,
|
|
42
42
|
children: _jsx(RenderTitle, {
|
|
43
43
|
element: "span"
|
|
44
44
|
})
|
|
45
45
|
}), _jsx("button", {
|
|
46
46
|
"aria-label": t("general:close"),
|
|
47
|
-
className: `${
|
|
47
|
+
className: `${documentDrawerBaseClass}__header-close`,
|
|
48
48
|
onClick: t2,
|
|
49
49
|
type: "button",
|
|
50
50
|
children: _jsx(XIcon, {})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["c","_c","Gutter","useModal","RenderTitle","XIcon","useDocumentInfo","useTranslation","IDLabel","
|
|
1
|
+
{"version":3,"file":"index.js","names":["c","_c","Gutter","useModal","RenderTitle","XIcon","useDocumentInfo","useTranslation","IDLabel","documentDrawerBaseClass","DocumentDrawerHeader","t0","$","drawerSlug","closeModal","t","t1","t2","_jsxs","className","children","_jsx","element","onClick","type","DocumentTitle","id","title","toString"],"sources":["../../../../src/elements/DocumentDrawer/DrawerHeader/index.tsx"],"sourcesContent":["'use client'\n\nimport { Gutter } from '../../../elements/Gutter/index.js'\nimport { useModal } from '../../../elements/Modal/index.js'\nimport { RenderTitle } from '../../../elements/RenderTitle/index.js'\nimport { XIcon } from '../../../icons/X/index.js'\nimport { useDocumentInfo } from '../../../providers/DocumentInfo/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { IDLabel } from '../../IDLabel/index.js'\nimport { documentDrawerBaseClass } from '../index.js'\nimport './index.scss'\n\nexport const DocumentDrawerHeader: React.FC<{\n drawerSlug: string\n}> = ({ drawerSlug }) => {\n const { closeModal } = useModal()\n const { t } = useTranslation()\n\n return (\n <Gutter className={`${documentDrawerBaseClass}__header`}>\n <div className={`${documentDrawerBaseClass}__header-content`}>\n <h2 className={`${documentDrawerBaseClass}__header-text`}>\n {<RenderTitle element=\"span\" />}\n </h2>\n <button\n aria-label={t('general:close')}\n className={`${documentDrawerBaseClass}__header-close`}\n onClick={() => closeModal(drawerSlug)}\n type=\"button\"\n >\n <XIcon />\n </button>\n </div>\n <DocumentTitle />\n </Gutter>\n )\n}\n\nconst DocumentTitle: React.FC = () => {\n const { id, title } = useDocumentInfo()\n return id && id !== title ? <IDLabel id={id.toString()} /> : null\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAEA,SAASC,MAAM,QAAQ;AACvB,SAASC,QAAQ,QAAQ;AACzB,SAASC,WAAW,QAAQ;AAC5B,SAASC,KAAK,QAAQ;AACtB,SAASC,eAAe,QAAQ;AAChC,SAASC,cAAc,QAAQ;AAC/B,SAASC,OAAO,QAAQ;AACxB,SAASC,uBAAuB,QAAQ;AACxC,OAAO;AAEP,OAAO,MAAMC,oBAAA,GAERC,EAAA;EAAA,MAAAC,CAAA,GAAAX,EAAA;EAAC;IAAAY;EAAA,IAAAF,EAAc;EAClB;IAAAG;EAAA,IAAuBX,QAAA;EACvB;IAAAY;EAAA,IAAcR,cAAA;EAAA,IAAAS,EAAA;EAAA,IAAAJ,CAAA,QAAAE,UAAA,IAAAF,CAAA,QAAAC,UAAA,IAAAD,CAAA,QAAAG,CAAA;IAAA,IAAAE,EAAA;IAAA,IAAAL,CAAA,QAAAE,UAAA,IAAAF,CAAA,QAAAC,UAAA;MAWGI,EAAA,GAAAA,CAAA,KAAMH,UAAA,CAAWD,UAAA;MAAAD,CAAA,MAAAE,UAAA;MAAAF,CAAA,MAAAC,UAAA;MAAAD,CAAA,MAAAK,EAAA;IAAA;MAAAA,EAAA,GAAAL,CAAA;IAAA;IARhCI,EAAA,GAAAE,KAAA,CAAAhB,MAAA;MAAAiB,SAAA,EAAmB,GAAAV,uBAAA,UAAoC;MAAAW,QAAA,GACrDF,KAAA,CAAC;QAAAC,SAAA,EAAe,GAAAV,uBAAA,kBAA4C;QAAAW,QAAA,GAC1DC,IAAA,CAAC;UAAAF,SAAA,EAAc,GAAAV,uBAAA,eAAyC;UAAAW,QAAA,EACrDC,IAAA,CAAAjB,WAAA;YAAAkB,OAAA,EAAqB;UAAA,C;YAExBD,IAAA,CAAC;UAAA,cACaN,CAAA,CAAE;UAAAI,SAAA,EACH,GAAAV,uBAAA,gBAA0C;UAAAc,OAAA,EAC5CN,EAAiB;UAAAO,IAAA,EACrB;UAAAJ,QAAA,EAELC,IAAA,CAAAhB,KAAA,IAAC;QAAA,C;UAGLgB,IAAA,CAAAI,aAAA,IAAC;IAAA,C;;;;;;;;SAdHT,E;CAiBJ;AAEA,MAAMS,aAAA,GAA0BA,CAAA;EAAA,MAAAb,CAAA,GAAAX,EAAA;EAC9B;IAAAyB,EAAA;IAAAC;EAAA,IAAsBrB,eAAA;EAAA,IAAAK,EAAA;EAAA,IAAAC,CAAA,QAAAc,EAAA,IAAAd,CAAA,QAAAe,KAAA;IACfhB,EAAA,GAAAe,EAAA,IAAMA,EAAA,KAAOC,KAAA,GAAQN,IAAA,CAAAb,OAAA;MAAAkB,EAAA,EAAaA,EAAA,CAAAE,QAAA,CAAW;IAAA,C,QAAS;IAAAhB,CAAA,MAAAc,EAAA;IAAAd,CAAA,MAAAe,KAAA;IAAAf,CAAA,MAAAD,EAAA;EAAA;IAAAA,EAAA,GAAAC,CAAA;EAAA;EAAA,OAAtDD,EAAsD;AAAA,CAC/D","ignoreList":[]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { DocumentDrawerProps, DocumentTogglerProps, UseDocumentDrawer } from './types.js';
|
|
3
3
|
import './index.scss';
|
|
4
|
-
export declare const
|
|
4
|
+
export declare const documentDrawerBaseClass = "doc-drawer";
|
|
5
5
|
export declare const DocumentDrawerToggler: React.FC<DocumentTogglerProps>;
|
|
6
6
|
export declare const DocumentDrawer: React.FC<DocumentDrawerProps>;
|
|
7
7
|
export declare const useDocumentDrawer: UseDocumentDrawer;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentDrawer/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2D,MAAM,OAAO,CAAA;AAE/E,OAAO,KAAK,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AAO9F,OAAO,cAAc,CAAA;AAErB,eAAO,MAAM,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentDrawer/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2D,MAAM,OAAO,CAAA;AAE/E,OAAO,KAAK,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AAO9F,OAAO,cAAc,CAAA;AAErB,eAAO,MAAM,uBAAuB,eAAe,CAAA;AAcnD,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA2BhE,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAQxD,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,iBAsE/B,CAAA"}
|
|
@@ -11,7 +11,7 @@ import { useRelatedCollections } from '../AddNewRelation/useRelatedCollections.j
|
|
|
11
11
|
import { Drawer, DrawerToggler } from '../Drawer/index.js';
|
|
12
12
|
import { DocumentDrawerContent } from './DrawerContent.js';
|
|
13
13
|
import './index.scss';
|
|
14
|
-
export const
|
|
14
|
+
export const documentDrawerBaseClass = 'doc-drawer';
|
|
15
15
|
const formatDocumentDrawerSlug = ({
|
|
16
16
|
id,
|
|
17
17
|
collectionSlug,
|
|
@@ -71,7 +71,7 @@ export const DocumentDrawerToggler = t0 => {
|
|
|
71
71
|
});
|
|
72
72
|
let t5;
|
|
73
73
|
if ($[19] !== className) {
|
|
74
|
-
t5 = [className, `${
|
|
74
|
+
t5 = [className, `${documentDrawerBaseClass}__toggler`].filter(Boolean);
|
|
75
75
|
$[19] = className;
|
|
76
76
|
$[20] = t5;
|
|
77
77
|
} else {
|
|
@@ -106,7 +106,7 @@ export const DocumentDrawer = props => {
|
|
|
106
106
|
drawerSlug
|
|
107
107
|
} = props;
|
|
108
108
|
return /*#__PURE__*/_jsx(Drawer, {
|
|
109
|
-
className:
|
|
109
|
+
className: documentDrawerBaseClass,
|
|
110
110
|
gutter: false,
|
|
111
111
|
Header: null,
|
|
112
112
|
slug: drawerSlug,
|