diff --git a/package-lock.json b/package-lock.json index d06b642ff..13d4999d8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "mapcomplete", - "version": "0.42.0", + "version": "0.42.4", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "mapcomplete", - "version": "0.42.0", + "version": "0.42.4", "license": "GPL-3.0-or-later", "dependencies": { "@comunica/core": "^3.0.1", @@ -52,6 +52,7 @@ "lz-string": "^1.4.4", "mangrove-reviews-typescript": "^1.1.0", "maplibre-gl": "^4.1.1", + "markdown-it": "^14.1.0", "monaco-editor": "^0.46.0", "nano-markdown": "^1.2.2", "opening_hours": "^3.6.0", @@ -11319,6 +11320,14 @@ "node": ">=10" } }, + "node_modules/linkify-it": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-5.0.0.tgz", + "integrity": "sha512-5aHCbzQRADcdP+ATqnDuhhJ/MRIqDkZX5pyjFHRRysS8vZ5AbqGEoFIb6pYHPZ+L/OC2Lc+xT8uHVVR5CAK/wQ==", + "dependencies": { + "uc.micro": "^2.0.0" + } + }, "node_modules/local-pkg": { "version": "0.4.3", "license": "MIT", @@ -11540,6 +11549,27 @@ "version": "2.0.0", "license": "ISC" }, + "node_modules/markdown-it": { + "version": "14.1.0", + "resolved": "https://registry.npmjs.org/markdown-it/-/markdown-it-14.1.0.tgz", + "integrity": "sha512-a54IwgWPaeBCAAsv13YgmALOF1elABB08FxO9i+r4VFk5Vl4pKokRPeX8u5TCgSsPi6ec1otfLjdOpVcgbpshg==", + "dependencies": { + "argparse": "^2.0.1", + "entities": "^4.4.0", + "linkify-it": "^5.0.0", + "mdurl": "^2.0.0", + "punycode.js": "^2.3.1", + "uc.micro": "^2.1.0" + }, + "bin": { + "markdown-it": "bin/markdown-it.mjs" + } + }, + "node_modules/mdurl": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/mdurl/-/mdurl-2.0.0.tgz", + "integrity": "sha512-Lf+9+2r+Tdp5wXDXC4PcIBjTDtq4UKjCPMQhKIuzpJNW0b96kVqSwW0bT7FhRSfmAiFYgP+SCRvdrDozfh0U5w==" + }, "node_modules/memoize": { "version": "10.0.0", "resolved": "https://registry.npmjs.org/memoize/-/memoize-10.0.0.tgz", @@ -12903,6 +12933,14 @@ "node": ">=6" } }, + "node_modules/punycode.js": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/punycode.js/-/punycode.js-2.3.1.tgz", + "integrity": "sha512-uxFIHU0YlHYhDQtV4R9J6a52SLx28BCjT+4ieh7IGbgwVJWO+km431c4yRlREUAsAmt/uMjQUyQHNEPf0M39CA==", + "engines": { + "node": ">=6" + } + }, "node_modules/qrcode-generator": { "version": "1.4.4", "license": "MIT" @@ -16042,6 +16080,11 @@ "version": "1.2.0", "license": "MIT" }, + "node_modules/uc.micro": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-2.1.0.tgz", + "integrity": "sha512-ARDJmphmdvUk6Glw7y9DQ2bFkKBHwQHLi2lsaH6PPmz/Ka9sFOBsBluozhDltWmnv9u/cF6Rt87znRTPV+yp/A==" + }, "node_modules/ufo": { "version": "1.0.1", "license": "MIT" @@ -24645,6 +24688,14 @@ "lilconfig": { "version": "2.0.6" }, + "linkify-it": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-5.0.0.tgz", + "integrity": "sha512-5aHCbzQRADcdP+ATqnDuhhJ/MRIqDkZX5pyjFHRRysS8vZ5AbqGEoFIb6pYHPZ+L/OC2Lc+xT8uHVVR5CAK/wQ==", + "requires": { + "uc.micro": "^2.0.0" + } + }, "local-pkg": { "version": "0.4.3" }, @@ -24794,6 +24845,24 @@ } } }, + "markdown-it": { + "version": "14.1.0", + "resolved": "https://registry.npmjs.org/markdown-it/-/markdown-it-14.1.0.tgz", + "integrity": "sha512-a54IwgWPaeBCAAsv13YgmALOF1elABB08FxO9i+r4VFk5Vl4pKokRPeX8u5TCgSsPi6ec1otfLjdOpVcgbpshg==", + "requires": { + "argparse": "^2.0.1", + "entities": "^4.4.0", + "linkify-it": "^5.0.0", + "mdurl": "^2.0.0", + "punycode.js": "^2.3.1", + "uc.micro": "^2.1.0" + } + }, + "mdurl": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/mdurl/-/mdurl-2.0.0.tgz", + "integrity": "sha512-Lf+9+2r+Tdp5wXDXC4PcIBjTDtq4UKjCPMQhKIuzpJNW0b96kVqSwW0bT7FhRSfmAiFYgP+SCRvdrDozfh0U5w==" + }, "memoize": { "version": "10.0.0", "resolved": "https://registry.npmjs.org/memoize/-/memoize-10.0.0.tgz", @@ -25573,6 +25642,11 @@ "punycode": { "version": "2.3.0" }, + "punycode.js": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/punycode.js/-/punycode.js-2.3.1.tgz", + "integrity": "sha512-uxFIHU0YlHYhDQtV4R9J6a52SLx28BCjT+4ieh7IGbgwVJWO+km431c4yRlREUAsAmt/uMjQUyQHNEPf0M39CA==" + }, "qrcode-generator": { "version": "1.4.4" }, @@ -27772,6 +27846,11 @@ "typewise-core": { "version": "1.2.0" }, + "uc.micro": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-2.1.0.tgz", + "integrity": "sha512-ARDJmphmdvUk6Glw7y9DQ2bFkKBHwQHLi2lsaH6PPmz/Ka9sFOBsBluozhDltWmnv9u/cF6Rt87znRTPV+yp/A==" + }, "ufo": { "version": "1.0.1" }, diff --git a/package.json b/package.json index 385b1a871..46b4d6be3 100644 --- a/package.json +++ b/package.json @@ -86,7 +86,6 @@ "optimize-images-png": "cd assets/generated/ && find -name '*.png' -exec optipng '{}' \\; && echo 'PNGs are optimized'", "optimize-images-jpg": "cd assets/ && find . -regextype sed -regex \".*/.*.\\(jpg\\|JPG\\|JPEG\\|jpeg\\)\" -exec jpegoptim '{}' \\; && echo 'JPGs are optimized'", "optimize-images-scaledown-jpg": "cd assets/ && find . -regextype sed -regex \".*/.*.\\(jpg\\|JPG\\|JPEG\\|jpeg\\)\" -exec mogrify -resize 640x640\\> '{}' \\; && echo 'JPGs are optimized'", - "generate:stats": "vite-node scripts/GenerateSeries.ts", "reset:layeroverview": "npm run prep:layeroverview && npm run generate:layeroverview && npm run refresh:layeroverview", "prep:layeroverview": "mkdir -p ./src/assets/generated/layers; echo {\\\"themes\\\":[]} > ./src/assets/generated/known_themes.json && echo {\\\"layers\\\": []} > ./src/assets/generated/known_layers.json && rm -f ./src/assets/generated/layers/*.json && rm -f ./src/assets/generated/themes/*.json && cp ./assets/layers/usersettings/usersettings.json ./src/assets/generated/layers/usersettings.json && echo '{}' > ./src/assets/generated/layers/favourite.json && echo '{}' > ./src/assets/generated/layers/summary.json", @@ -171,8 +170,8 @@ "lz-string": "^1.4.4", "mangrove-reviews-typescript": "^1.1.0", "maplibre-gl": "^4.1.1", + "markdown-it": "^14.1.0", "monaco-editor": "^0.46.0", - "nano-markdown": "^1.2.2", "opening_hours": "^3.6.0", "osm-auth": "^2.2.0", "osmtogeojson": "^3.0.0-beta.5", diff --git a/public/css/index-tailwind-output.css b/public/css/index-tailwind-output.css index ebb916a76..cdd390a09 100644 --- a/public/css/index-tailwind-output.css +++ b/public/css/index-tailwind-output.css @@ -781,10 +781,6 @@ video { float: left; } -.m-8 { - margin: 2rem; -} - .m-4 { margin: 1rem; } @@ -797,6 +793,10 @@ video { margin: 0px; } +.m-8 { + margin: 2rem; +} + .m-2 { margin: 0.5rem; } @@ -900,10 +900,6 @@ video { margin-right: 4rem; } -.mb-4 { - margin-bottom: 1rem; -} - .mt-4 { margin-top: 1rem; } @@ -936,6 +932,10 @@ video { margin-right: 0.25rem; } +.mb-4 { + margin-bottom: 1rem; +} + .ml-1 { margin-left: 0.25rem; } @@ -1762,11 +1762,6 @@ video { border-color: rgb(75 85 99 / var(--tw-border-opacity)); } -.border-gray-400 { - --tw-border-opacity: 1; - border-color: rgb(156 163 175 / var(--tw-border-opacity)); -} - .border-gray-800 { --tw-border-opacity: 1; border-color: rgb(31 41 55 / var(--tw-border-opacity)); @@ -1916,10 +1911,6 @@ video { padding-left: 0.75rem; } -.pr-0 { - padding-right: 0px; -} - .pt-1 { padding-top: 0.25rem; } @@ -2721,7 +2712,7 @@ textarea { color: #7193bb; } -.literal-code { +.literal-code, code { /* A codeblock */ display: inline-block; background-color: lightgray; diff --git a/src/Models/ThemeConfig/TagRenderingConfig.ts b/src/Models/ThemeConfig/TagRenderingConfig.ts index 5dec39a77..bcc3c969f 100644 --- a/src/Models/ThemeConfig/TagRenderingConfig.ts +++ b/src/Models/ThemeConfig/TagRenderingConfig.ts @@ -52,6 +52,7 @@ export default class TagRenderingConfig { public readonly renderIconClass?: string public readonly question?: TypedTranslation public readonly questionhint?: TypedTranslation + public readonly questionHintIsMd?: boolean public readonly condition?: TagsFilter public readonly invalidValues?: TagsFilter /** @@ -80,7 +81,7 @@ export default class TagRenderingConfig { public readonly classes: string[] | undefined constructor( - config: string | TagRenderingConfigJson | QuestionableTagRenderingConfigJson, + config: string | TagRenderingConfigJson | (QuestionableTagRenderingConfigJson & {questionHintIsMd?: boolean}), context?: string ) { let json = config @@ -136,6 +137,7 @@ export default class TagRenderingConfig { this.render = Translations.T(json.render, translationKey + ".render") this.question = Translations.T(json.question, translationKey + ".question") this.questionhint = Translations.T(json.questionHint, translationKey + ".questionHint") + this.questionHintIsMd = json["questionHintIsMd"] ?? false this.description = Translations.T(json.description, translationKey + ".description") this.editButtonAriaLabel = Translations.T( json.editButtonAriaLabel, diff --git a/src/UI/Base/Markdown.svelte b/src/UI/Base/Markdown.svelte new file mode 100644 index 000000000..d11f6a3ca --- /dev/null +++ b/src/UI/Base/Markdown.svelte @@ -0,0 +1,17 @@ + +{#if src?.length > 0} + {@html md.render(src)} +{/if} + diff --git a/src/UI/Popup/TagRendering/TagRenderingQuestion.svelte b/src/UI/Popup/TagRendering/TagRenderingQuestion.svelte index 9bf63d639..a0dc35883 100644 --- a/src/UI/Popup/TagRendering/TagRenderingQuestion.svelte +++ b/src/UI/Popup/TagRendering/TagRenderingQuestion.svelte @@ -263,7 +263,7 @@ {#if config.questionhint} {#if config.questionHintIsMd} - + {:else}
- {/if} + {/if} {/if} diff --git a/src/UI/Studio/SchemaBasedArray.svelte b/src/UI/Studio/SchemaBasedArray.svelte index 3967d0dbd..488c0a2c3 100644 --- a/src/UI/Studio/SchemaBasedArray.svelte +++ b/src/UI/Studio/SchemaBasedArray.svelte @@ -8,6 +8,7 @@ import QuestionPreview from "./QuestionPreview.svelte" import SchemaBasedMultiType from "./SchemaBasedMultiType.svelte" import ShowConversionMessage from "./ShowConversionMessage.svelte" + import Markdown from "../Base/Markdown.svelte" export let state: EditLayerState export let schema: ConfigMeta @@ -97,9 +98,7 @@

{schema.path.at(-1)}

{#if subparts.length > 0} - - {schema.description} - + {/if} {#if $currentValue === undefined} No array defined diff --git a/src/UI/Studio/SchemaBasedMultiType.svelte b/src/UI/Studio/SchemaBasedMultiType.svelte index 873bad9af..2df43cbc3 100644 --- a/src/UI/Studio/SchemaBasedMultiType.svelte +++ b/src/UI/Studio/SchemaBasedMultiType.svelte @@ -41,10 +41,11 @@ if (lastIsString) { types.splice(types.length - 1, 1) } - const configJson: QuestionableTagRenderingConfigJson = { + const configJson: QuestionableTagRenderingConfigJson & {questionHintIsMd: boolean}= { id: "TYPE_OF:" + path.join("_"), question: "Which subcategory is needed for " + schema.path.at(-1) + "?", - questionHint: nmd(schema.description), + questionHint: schema.description, + questionHintIsMd: true, mappings: types .map((opt) => opt.trim()) .filter((opt) => opt.length > 0) diff --git a/src/Utils.ts b/src/Utils.ts index 189251f5c..77062e583 100644 --- a/src/Utils.ts +++ b/src/Utils.ts @@ -507,7 +507,7 @@ In the case that MapComplete is pointed to the testing grounds, the edit will be let result = "" while (match) { const [_, normal, key, leftover] = match - let v = tags === undefined ? undefined : tags[key] + let v = tags?.[key] if (v !== undefined && v !== null) { if (v["toISOString"] != undefined) { // This is a date, probably the timestamp of the object diff --git a/src/index.css b/src/index.css index 3ee016bbd..0c904441a 100644 --- a/src/index.css +++ b/src/index.css @@ -500,7 +500,7 @@ textarea { } -.literal-code { +.literal-code, code { /* A codeblock */ display: inline-block; background-color: lightgray;