@lvl99dotcom/paintcanvas 0.5.0 → 0.7.0

package/dist/ui/elements/PcVersion/index.js

@@ -0,0 +1,43 @@
+import { PcElement, defineElement } from "../../base/index.js";
+import { PAINTCANVAS_REPOSITORY_URL, versionText } from "../../../lib/version/index.js";
+import { css, html } from "lit";
+// src/ui/elements/PcVersion/index.ts
+/**
+* PaintCanvas's version and the commit it was built from, e.g. "PaintCanvas v0.6.0 (ac12a0d)", as a link to its GitHub
+* repository (opened in a new tab). For an app's settings or about panel.
+*
+* @example
+* html`<pc-version></pc-version>`
+*/
+var PcVersion = class extends PcElement {
+	static styles = [PcElement.styles, css`
+      :host {
+        display: block;
+        font-family: var(--pc-font);
+        font-size: var(--pc-font-size-small);
+      }
+      a {
+        color: var(--pc-text-muted);
+        text-decoration: none;
+      }
+      a:hover {
+        color: var(--pc-text);
+        text-decoration: underline;
+      }
+      a:focus-visible {
+        outline: var(--pc-focus-width) solid var(--pc-focus);
+        outline-offset: 2px;
+      }
+    `];
+	render() {
+		return html`<a
+      part="link"
+      href=${PAINTCANVAS_REPOSITORY_URL}
+      target="_blank"
+      rel="noopener noreferrer"
+      >${versionText()}</a
+    >`;
+	}
+};
+defineElement("pc-version", PcVersion);
+export { PcVersion };

package/dist/ui/icons/images/icon-profile-graph@2x.js

@@ -0,0 +1,3 @@
+// src/ui/icons/images/icon-profile-graph@2x.png?url
+var icon_profile_graph_2x_default = "data:image/png;base64,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";
+export { icon_profile_graph_2x_default as default };

package/dist/ui/icons/index.d.ts

@@ -1,5 +1,5 @@
 /** Names of the icons that come with PaintCanvas */
-export type IconName = "brush" | "eraser" | "cursor" | "rectangleMask" | "circleMask" | "polygonMask" | "freehandMask" | "eyedropper" | "zoom" | "zoomIn" | "zoomOut" | "pan" | "undo" | "redo" | "layers" | "locked" | "unlocked" | "visible" | "hidden" | "linked" | "unlinked" | "pressure" | "focusPen" | "tilt" | "randomise" | "flipHorizontal" | "flipVertical" | "rotate90Left" | "rotate90Right" | "rotate" | "horizontalSize" | "verticalSize" | "diagonalTlbrSize" | "diagonalTrblSize" | "clipboard" | "smoothingLinear" | "smoothingBezierQuad" | "smoothingBezierCubic" | "sun" | "moon" | "star" | "cog";
+export type IconName = "brush" | "eraser" | "cursor" | "rectangleMask" | "circleMask" | "polygonMask" | "freehandMask" | "eyedropper" | "zoom" | "zoomIn" | "zoomOut" | "pan" | "undo" | "redo" | "layers" | "locked" | "unlocked" | "visible" | "hidden" | "linked" | "unlinked" | "pressure" | "focusPen" | "tilt" | "randomise" | "profileGraph" | "flipHorizontal" | "flipVertical" | "rotate90Left" | "rotate90Right" | "rotate" | "horizontalSize" | "verticalSize" | "diagonalTlbrSize" | "diagonalTrblSize" | "clipboard" | "smoothingLinear" | "smoothingBezierQuad" | "smoothingBezierCubic" | "sun" | "moon" | "star" | "cog";
 /** The icons that come with PaintCanvas, as URLs */
 export declare const DEFAULT_ICONS: Readonly<Record<IconName, string>>;
 /**

package/dist/ui/icons/index.js

@@ -23,6 +23,7 @@ import icon_pressure_2x_default from "./images/icon-pressure@2x.js";
 import icon_focus_pen_2x_default from "./images/icon-focus-pen@2x.js";
 import icon_tilt_2x_default from "./images/icon-tilt@2x.js";
 import icon_randomise_2x_default from "./images/icon-randomise@2x.js";
+import icon_profile_graph_2x_default from "./images/icon-profile-graph@2x.js";
 import icon_flip_horizontal_2x_default from "./images/icon-flip-horizontal@2x.js";
 import icon_flip_vertical_2x_default from "./images/icon-flip-vertical@2x.js";
 import icon_rotate_90_left_2x_default from "./images/icon-rotate-90-left@2x.js";
@@ -69,6 +70,7 @@ var DEFAULT_ICONS = {
 	focusPen: icon_focus_pen_2x_default,
 	tilt: icon_tilt_2x_default,
 	randomise: icon_randomise_2x_default,
+	profileGraph: icon_profile_graph_2x_default,
 	flipHorizontal: icon_flip_horizontal_2x_default,
 	flipVertical: icon_flip_vertical_2x_default,
 	rotate90Left: icon_rotate_90_left_2x_default,

package/dist/ui/index.d.ts

@@ -4,16 +4,22 @@ export { PcElement, defineElement, emit } from "./base";
 export { PcIcon } from "./elements/PcIcon";
 export { PcButton, type ButtonVariant } from "./elements/PcButton";
 export { PcButtonGroup } from "./elements/PcButtonGroup";
+export { PcButtonMenu, isNarrowerThan, type ButtonMenuItem, } from "./elements/PcButtonMenu";
 export { PcIconToggle } from "./elements/PcIconToggle";
 export { PcToggleCheckbox } from "./elements/PcToggleCheckbox";
 export { PcSlider } from "./elements/PcSlider";
 export { PcNumberSlider, fitNumber } from "./elements/PcNumberSlider";
+export { PcProfileEditor, type ProfileSaveDetail, } from "./elements/PcProfileEditor";
+export { PcProfileGraph, curvePath, movePoint, } from "./elements/PcProfileGraph";
+export { PcSliderRange, rangeFraction, type RangeDetail, type RangeEnd, } from "./elements/PcSliderRange";
 export { PcBrushSize, sizeText } from "./elements/PcBrushSize";
 export { PointerDrag, DRAG_THRESHOLD, dragDelta } from "./drag";
 export { markDismissingPress, isDismissingPress } from "./dismiss";
 export { PcMenu, isMenuItem, menuSections, type MenuItem, type MenuLabel, type MenuDivider, type MenuEntry, } from "./elements/PcMenu";
 export { PcContextMenu, CONTEXT_MENU_TOGGLE_EVENT, MENU_MARGIN, menuLeft, menuTop, type MenuPlacement, } from "./elements/PcContextMenu";
-export { PcDialog, CANCEL_CHOICE, type DialogChoice, } from "./elements/PcDialog";
+export { PcDialogWindow, DIALOG_DISMISS_EVENT, type DialogCloseReason, } from "./elements/PcDialogWindow";
+export { PcDialog, CANCEL_CHOICE, type DialogChoice, type DialogChoiceDetail, type DialogField, } from "./elements/PcDialog";
+export { askConfirm, askText, deletePresetQuestion, OK_CHOICE, type AskOptions, type AskTextOptions, type ConfirmFn, type PromptFn, } from "./ask";
 export { PcToast, TOAST_DURATION_MS, type ToastKind } from "./elements/PcToast";
 export { PcInfoTip } from "./elements/PcInfoTip";
 export { PcPopover } from "./elements/PcPopover";
@@ -22,11 +28,12 @@ export { PcPane, PANE_COLLAPSE_EVENT, type PaneEdge, type PaneOrientation, } fro
 export { PcInputSettings, type InputSettingsLike, } from "./elements/PcInputSettings";
 export { PcMatch } from "./elements/PcMatch";
 export { PcColourPair, COLOUR_CLICK_EVENT } from "./elements/PcColourPair";
-export { PcClipboardTools, CLIPBOARD_TOOLS } from "./elements/PcClipboardTools";
+export { PcClipboardTools, CLIPBOARD_MENU_BELOW, CLIPBOARD_TOOLS, } from "./elements/PcClipboardTools";
 export { PcShortcutSettings, type ShortcutSettingsLike, } from "./elements/PcShortcutSettings";
 export { PcAppSettings } from "./elements/PcAppSettings";
 export { PcPanelColours, LONG_PRESS_MS, type ColourModel, } from "./elements/PcPanelColours";
 export { PcStats, formatBytes } from "./elements/PcStats";
+export { PcVersion } from "./elements/PcVersion";
 export { PcThemePicker, THEMES, THEME_ICONS, isTheme, type Theme, } from "./elements/PcThemePicker";
 export { PaintCanvasElement } from "./elements/PaintCanvas";
 export { DEFAULT_NARROW_WIDTH, DEFAULT_SIDE_MODES, LayoutStateController, STATE_EVENT, matchesState, parseSideModes, showsRail, sideModeFor, type InputKind, type LayoutState, type SideMode, type SideModeRule, } from "./layout";

package/dist/ui/index.js

@@ -5,16 +5,22 @@ import { PcElement, defineElement, emit } from "./base/index.js";
 import { PcIcon } from "./elements/PcIcon/index.js";
 import { PcButton } from "./elements/PcButton/index.js";
 import { PcButtonGroup } from "./elements/PcButtonGroup/index.js";
+import { PcButtonMenu, isNarrowerThan } from "./elements/PcButtonMenu/index.js";
 import { PcIconToggle } from "./elements/PcIconToggle/index.js";
 import { PcToggleCheckbox } from "./elements/PcToggleCheckbox/index.js";
 import { PcSlider } from "./elements/PcSlider/index.js";
 import { PcNumberSlider, fitNumber } from "./elements/PcNumberSlider/index.js";
+import { PcProfileEditor } from "./elements/PcProfileEditor/index.js";
+import { PcProfileGraph, curvePath, movePoint } from "./elements/PcProfileGraph/index.js";
+import { PcSliderRange, rangeFraction } from "./elements/PcSliderRange/index.js";
 import { PcBrushSize, sizeText } from "./elements/PcBrushSize/index.js";
 import { DRAG_THRESHOLD, PointerDrag, dragDelta } from "./drag/index.js";
 import { isDismissingPress, markDismissingPress } from "./dismiss/index.js";
 import { PcMenu, isMenuItem, menuSections } from "./elements/PcMenu/index.js";
 import { CONTEXT_MENU_TOGGLE_EVENT, MENU_MARGIN, PcContextMenu, menuLeft, menuTop } from "./elements/PcContextMenu/index.js";
+import { DIALOG_DISMISS_EVENT, PcDialogWindow } from "./elements/PcDialogWindow/index.js";
 import { CANCEL_CHOICE, PcDialog } from "./elements/PcDialog/index.js";
+import { OK_CHOICE, askConfirm, askText, deletePresetQuestion } from "./ask/index.js";
 import { PcToast, TOAST_DURATION_MS } from "./elements/PcToast/index.js";
 import { PcInfoTip } from "./elements/PcInfoTip/index.js";
 import { PcPopover } from "./elements/PcPopover/index.js";
@@ -23,12 +29,13 @@ import { PANE_COLLAPSE_EVENT, PcPane } from "./elements/PcPane/index.js";
 import { PcInputSettings } from "./elements/PcInputSettings/index.js";
 import { PcMatch } from "./elements/PcMatch/index.js";
 import { COLOUR_CLICK_EVENT, PcColourPair } from "./elements/PcColourPair/index.js";
-import { CLIPBOARD_TOOLS, PcClipboardTools } from "./elements/PcClipboardTools/index.js";
+import { CLIPBOARD_MENU_BELOW, CLIPBOARD_TOOLS, PcClipboardTools } from "./elements/PcClipboardTools/index.js";
 import { PcShortcutSettings } from "./elements/PcShortcutSettings/index.js";
 import { PcAppSettings } from "./elements/PcAppSettings/index.js";
 import { LONG_PRESS_MS, PcPanelColours } from "./elements/PcPanelColours/index.js";
 import { PcStats, formatBytes } from "./elements/PcStats/index.js";
+import { PcVersion } from "./elements/PcVersion/index.js";
 import { PcThemePicker, THEME_ICONS } from "./elements/PcThemePicker/index.js";
 import { PaintCanvasElement } from "./elements/PaintCanvas/index.js";
 import { DEFAULT_NARROW_WIDTH, DEFAULT_SIDE_MODES, LayoutStateController, STATE_EVENT, matchesState, parseSideModes, showsRail, sideModeFor } from "./layout/index.js";
-export { CANCEL_CHOICE, CLIPBOARD_TOOLS, COLOUR_CLICK_EVENT, CONTEXT_MENU_TOGGLE_EVENT, DARK_TOKENS, DEFAULT_ICONS, DEFAULT_NARROW_WIDTH, DEFAULT_SIDE_MODES, DRAG_THRESHOLD, IconRegistry, LIGHT_TOKENS, LONG_PRESS_MS, LayoutStateController, MENU_MARGIN, PANE_COLLAPSE_EVENT, PaintCanvasElement, PcAppSettings, PcBrushSize, PcButton, PcButtonGroup, PcClipboardTools, PcColourPair, PcContextMenu, PcDialog, PcElement, PcIcon, PcIconToggle, PcInfoTip, PcInputSettings, PcMatch, PcMenu, PcNumberSlider, PcPane, PcPanel, PcPanelColours, PcPopover, PcShortcutSettings, PcSlider, PcStats, PcThemePicker, PcToast, PcToggleCheckbox, PointerDrag, STATE_EVENT, THEMES, THEME_ICONS, TOAST_DURATION_MS, TOKENS_CSS, defineElement, dragDelta, emit, fitNumber, formatBytes, icons, installTokens, isDismissingPress, isMenuItem, isTheme, markDismissingPress, matchesState, menuLeft, menuSections, menuTop, parseSideModes, showsRail, sideModeFor, sizeText, tokens };
+export { CANCEL_CHOICE, CLIPBOARD_MENU_BELOW, CLIPBOARD_TOOLS, COLOUR_CLICK_EVENT, CONTEXT_MENU_TOGGLE_EVENT, DARK_TOKENS, DEFAULT_ICONS, DEFAULT_NARROW_WIDTH, DEFAULT_SIDE_MODES, DIALOG_DISMISS_EVENT, DRAG_THRESHOLD, IconRegistry, LIGHT_TOKENS, LONG_PRESS_MS, LayoutStateController, MENU_MARGIN, OK_CHOICE, PANE_COLLAPSE_EVENT, PaintCanvasElement, PcAppSettings, PcBrushSize, PcButton, PcButtonGroup, PcButtonMenu, PcClipboardTools, PcColourPair, PcContextMenu, PcDialog, PcDialogWindow, PcElement, PcIcon, PcIconToggle, PcInfoTip, PcInputSettings, PcMatch, PcMenu, PcNumberSlider, PcPane, PcPanel, PcPanelColours, PcPopover, PcProfileEditor, PcProfileGraph, PcShortcutSettings, PcSlider, PcSliderRange, PcStats, PcThemePicker, PcToast, PcToggleCheckbox, PcVersion, PointerDrag, STATE_EVENT, THEMES, THEME_ICONS, TOAST_DURATION_MS, TOKENS_CSS, askConfirm, askText, curvePath, defineElement, deletePresetQuestion, dragDelta, emit, fitNumber, formatBytes, icons, installTokens, isDismissingPress, isMenuItem, isNarrowerThan, isTheme, markDismissingPress, matchesState, menuLeft, menuSections, menuTop, movePoint, parseSideModes, rangeFraction, showsRail, sideModeFor, sizeText, tokens };

package/dist/ui/layout/index.d.ts

@@ -16,8 +16,8 @@ export interface SideModeRule {
     mode: SideMode;
     below?: number;
 }
-/** Side modes used unless the implementer chooses others: docked, and a rail below 600px wide */
-export declare const DEFAULT_SIDE_MODES = "docked, rail@600";
+/** Side modes used unless the implementer chooses others: docked, and floating below 600px wide */
+export declare const DEFAULT_SIDE_MODES = "docked, floating@600";
 /** Layout width (CSS pixels) below which the layout counts as narrow, unless the implementer chooses another */
 export declare const DEFAULT_NARROW_WIDTH = 600;
 /**

package/dist/ui/layout/index.js

@@ -14,8 +14,8 @@ var SIDE_MODES = [
 * showsRail("docked"); // false
 */
 var showsRail = (mode) => mode === "rail" || mode === "overlay";
-/** Side modes used unless the implementer chooses others: docked, and a rail below 600px wide */
-var DEFAULT_SIDE_MODES = "docked, rail@600";
+/** Side modes used unless the implementer chooses others: docked, and floating below 600px wide */
+var DEFAULT_SIDE_MODES = "docked, floating@600";
 /** Layout width (CSS pixels) below which the layout counts as narrow, unless the implementer chooses another */
 var DEFAULT_NARROW_WIDTH = 600;
 /**

package/dist/ui/styles/index.d.ts

@@ -1,10 +1,30 @@
+/** The sizes of pill buttons, from small to extra extra large (`pill` is the usual size) */
+export declare const PILL_SIZES: readonly ["pill-s", "pill", "pill-l", "pill-xl", "pill-xxl"];
+/** A pill button size */
+export type PillSize = (typeof PILL_SIZES)[number];
+/** Each pill size's least height, font size and padding, in pixels */
+export declare const PILL_SIZE_STYLES: Readonly<Record<PillSize, {
+    height: number;
+    fontSize: number;
+    padding: string;
+}>>;
+/**
+ * CSS declarations giving a pill size (its least height, font size and padding), with text on one centred line.
+ *
+ * @example
+ * pillSizeDeclarations("pill-s"); // "min-height: 24px; font-size: 14px; padding: 2px 8px; line-height: 1;"
+ */
+export declare const pillSizeDeclarations: (size: PillSize) => string;
 /** Windows, menus and dialog buttons: affirmative buttons purple, cancel and close buttons pink */
 export declare const windows: import("lit").CSSResult;
 /** Interface controls whose text isn't selected by clicking or dragging (form fields stay selectable) */
 export declare const noTextSelection: import("lit").CSSResult;
 /** Icon toggles (a checkbox hidden behind its icon, purple while on) and boxed icon buttons */
 export declare const iconControls: import("lit").CSSResult;
-/** Small purple pill buttons, e.g. "Configure", "New Layer", "Import" */
+/**
+ * Purple pill buttons, e.g. "Configure", "New Layer", "Import": `pill` is the usual size; `pill-s`, `pill-l`, `pill-xl`
+ * and `pill-xxl` are the others (see `PILL_SIZE_STYLES`).
+ */
 export declare const pills: import("lit").CSSResult;
 /** The shared styles as text, e.g. for `unsafeCSS` */
 export declare const WINDOWS_CSS: string;

package/dist/ui/styles/index.js

@@ -1,5 +1,53 @@
-import { css } from "lit";
+import { css, unsafeCSS } from "lit";
 // src/ui/styles/index.ts
+/** The sizes of pill buttons, from small to extra extra large (`pill` is the usual size) */
+var PILL_SIZES = [
+	"pill-s",
+	"pill",
+	"pill-l",
+	"pill-xl",
+	"pill-xxl"
+];
+/** Each pill size's least height, font size and padding, in pixels */
+var PILL_SIZE_STYLES = {
+	"pill-s": {
+		height: 24,
+		fontSize: 14,
+		padding: "2px 8px"
+	},
+	pill: {
+		height: 32,
+		fontSize: 16,
+		padding: "8px 16px"
+	},
+	"pill-l": {
+		height: 50,
+		fontSize: 20,
+		padding: "15px 25px"
+	},
+	"pill-xl": {
+		height: 75,
+		fontSize: 24,
+		padding: "25px 37px"
+	},
+	"pill-xxl": {
+		height: 100,
+		fontSize: 28,
+		padding: "36px 50px"
+	}
+};
+/**
+* CSS declarations giving a pill size (its least height, font size and padding), with text on one centred line.
+*
+* @example
+* pillSizeDeclarations("pill-s"); // "min-height: 24px; font-size: 14px; padding: 2px 8px; line-height: 1;"
+*/
+var pillSizeDeclarations = (size) => {
+	const { height, fontSize, padding } = PILL_SIZE_STYLES[size];
+	return `min-height: ${height}px; font-size: ${fontSize}px; padding: ${padding}; line-height: 1;`;
+};
+/** The usual pill size, for buttons shaped as pills without a size of their own */
+var PILL = unsafeCSS(pillSizeDeclarations("pill"));
 /** Windows, menus and dialog buttons: affirmative buttons purple, cancel and close buttons pink */
 var windows = css`
   button,
@@ -25,12 +73,15 @@ var windows = css`
   button[type="submit"],
   button.cancel,
   button.close {
-    min-height: var(--pc-control-size);
-    padding: var(--pc-space-1) var(--pc-space-3);
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    box-sizing: border-box;
     border: 0;
     border-radius: var(--pc-radius-pill);
     color: var(--pc-accent-text);
     font: inherit;
+    ${PILL}
     font-weight: bold;
     cursor: pointer;
   }
@@ -159,30 +210,38 @@ var iconControls = css`
     outline: var(--pc-focus-width) solid var(--pc-focus);
   }
 `;
-/** Small purple pill buttons, e.g. "Configure", "New Layer", "Import" */
+/** Pill buttons, of each size in `PILL_SIZES` as classes */
+var PILL_SELECTOR = unsafeCSS(["configure", ...PILL_SIZES].map((name) => `button.${name}`).join(", "));
+/** Each pill size's class, giving it its height, font size and padding */
+var PILL_SIZE_CLASSES = unsafeCSS(PILL_SIZES.map((size) => `button.${size} { ${pillSizeDeclarations(size)} }`).join("\n"));
+/**
+* Purple pill buttons, e.g. "Configure", "New Layer", "Import": `pill` is the usual size; `pill-s`, `pill-l`, `pill-xl`
+* and `pill-xxl` are the others (see `PILL_SIZE_STYLES`).
+*/
 var pills = css`
-  button.configure,
-  button.pill {
-    min-height: 30px;
-    padding: var(--pc-space-1) var(--pc-space-3);
+  ${PILL_SELECTOR} {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    box-sizing: border-box;
     border: 0;
     border-radius: var(--pc-radius-pill);
     background: var(--pc-accent);
     color: var(--pc-accent-text);
     font: inherit;
+    ${PILL}
     font-weight: bold;
     cursor: pointer;
   }
-  button.configure:hover:not(:disabled),
-  button.pill:hover:not(:disabled) {
+  ${PILL_SIZE_CLASSES}
+  :is(${PILL_SELECTOR}):hover:not(:disabled) {
     filter: brightness(1.15);
   }
-  button.configure:focus-visible,
-  button.pill:focus-visible {
+  :is(${PILL_SELECTOR}):focus-visible {
     outline: var(--pc-focus-width) solid var(--pc-focus);
     outline-offset: 2px;
   }
-  button.pill:disabled {
+  :is(${PILL_SELECTOR}):disabled {
     background: var(--pc-disabled);
     cursor: default;
   }
@@ -192,4 +251,4 @@ var WINDOWS_CSS = windows.cssText;
 var NO_TEXT_SELECTION_CSS = noTextSelection.cssText;
 var ICON_CONTROLS_CSS = iconControls.cssText;
 var PILLS_CSS = pills.cssText;
-export { ICON_CONTROLS_CSS, NO_TEXT_SELECTION_CSS, PILLS_CSS, WINDOWS_CSS, iconControls, noTextSelection, pills, windows };
+export { ICON_CONTROLS_CSS, NO_TEXT_SELECTION_CSS, PILLS_CSS, PILL_SIZES, PILL_SIZE_STYLES, WINDOWS_CSS, iconControls, noTextSelection, pillSizeDeclarations, pills, windows };

package/locales/en-GB.json

@@ -7,6 +7,7 @@
   "paintCanvas.common.clear": "Clear",
   "paintCanvas.common.cut": "Cut",
   "paintCanvas.common.copy": "Copy",
+  "paintCanvas.common.copyMerged": "Copy merged",
   "paintCanvas.common.paste": "Paste",
   "paintCanvas.common.undo": "Undo",
   "paintCanvas.common.redo": "Redo",
@@ -16,6 +17,31 @@
   "paintCanvas.common.height": "Height",
   "paintCanvas.common.size": "Size",
   "paintCanvas.common.opacity": "Opacity",
+  "paintCanvas.range.low": "{label} (min)",
+  "paintCanvas.range.high": "{label} (max)",
+  "paintCanvas.profileGraph.point": "Point {number}: {x}, {y}",
+  "paintCanvas.profileGraph.remove": "Remove point",
+  "paintCanvas.profileGraph.linear": "Sharp corner (linear)",
+  "paintCanvas.profileGraph.bezier": "Smooth (bezier cubic)",
+  "paintCanvas.profiles.linear": "Linear",
+  "paintCanvas.profiles.overweight": "Overweight",
+  "paintCanvas.profiles.underweight": "Underweight",
+  "paintCanvas.profileEditor.title": "{param} profile graph",
+  "paintCanvas.profileEditor.button": "{param}: profile graph",
+  "paintCanvas.profileEditor.custom": "Custom",
+  "paintCanvas.profileEditor.actions": "Profile graph actions",
+  "paintCanvas.profileEditor.new": "New graph",
+  "paintCanvas.profileEditor.duplicate": "Duplicate…",
+  "paintCanvas.profileEditor.rename": "Rename…",
+  "paintCanvas.profileEditor.delete": "Delete…",
+  "paintCanvas.profileEditor.reset": "Reset",
+  "paintCanvas.profileEditor.name": "Name",
+  "paintCanvas.profileEditor.saveHeading": "Save profile graph",
+  "paintCanvas.profileEditor.renameHeading": "Rename profile graph",
+  "paintCanvas.profileEditor.deleteHeading": "Delete profile graph",
+  "paintCanvas.profileEditor.deleteConfirm": "Delete \"{name}\"? This can't be undone.",
+  "paintCanvas.profileEditor.replaceHeading": "Replace profile graph",
+  "paintCanvas.profileEditor.replaceConfirm": "You already have a profile graph called \"{name}\". Replace it?",
   "paintCanvas.tool.brush": "Brush",
   "paintCanvas.tool.eraser": "Eraser",
   "paintCanvas.tool.move": "Move, scale and rotate",
@@ -88,6 +114,9 @@
   "paintCanvas.presets.myPresets": "My presets",
   "paintCanvas.presets.unknownAuthor": "Unknown",
   "paintCanvas.presets.deleteConfirm": "Delete \"{name}\"? This can't be undone.",
+  "paintCanvas.presets.deleteHeading": "Delete preset",
+  "paintCanvas.presets.replaceHeading": "Replace preset",
+  "paintCanvas.presets.replace": "Replace",
   "paintCanvas.presets.deleted": "Deleted \"{name}\"",
   "paintCanvas.presets.deleteFailed": "Couldn't delete \"{name}\"",
   "paintCanvas.presets.saved": "Saved \"{name}\" to My presets",
@@ -134,6 +163,8 @@
   "paintCanvas.layers.alphaLock": "Alpha lock",
   "paintCanvas.layers.blendMode": "Blending mode",
   "paintCanvas.layers.actions": "Layer actions",
+  "paintCanvas.layers.rename": "Rename…",
+  "paintCanvas.layers.renameTitle": "Rename layer",
   "paintCanvas.layers.reorder": "Reorder {name}: drag, or press for actions",
   "paintCanvas.layers.duplicate": "Duplicate",
   "paintCanvas.layers.createMask": "Create mask",
@@ -181,6 +212,7 @@
   "paintCanvas.brushConfig.snapToPixelGrid": "Snap to pixel grid",
   "paintCanvas.brushConfig.addToPresets": "Add to presets",
   "paintCanvas.brushConfig.variation": "{param}: {source}",
+  "paintCanvas.brushConfig.varyWith": "{param}: vary with",
   "paintCanvas.layers.mergeDownTitle": "Merge down",
   "paintCanvas.layers.clear": "Clear…",
   "paintCanvas.layers.delete": "Delete…",
@@ -260,6 +292,9 @@
   "paintCanvas.settings.fileIncompatible": "Settings JSON file not compatible",
   "paintCanvas.settings.fileReadFailed": "Failed to read settings JSON file",
   "paintCanvas.settings.exportFailed": "Error exporting settings JSON file",
+  "paintCanvas.settings.gpu": "Draw with the GPU",
+  "paintCanvas.settings.gpuHint": "Try this if drawing is slow. It applies after reloading the page.",
+  "paintCanvas.settings.reloadToApply": "Reload the page to apply this change.",
   "paintCanvas.stats.label": "Canvas details",
   "paintCanvas.stats.size": "Canvas: {width} × {height} px",
   "paintCanvas.stats.zoom": "Zoom: {zoom}",

package/locales/en-US.json

@@ -7,6 +7,7 @@
   "paintCanvas.common.clear": "Clear",
   "paintCanvas.common.cut": "Cut",
   "paintCanvas.common.copy": "Copy",
+  "paintCanvas.common.copyMerged": "Copy merged",
   "paintCanvas.common.paste": "Paste",
   "paintCanvas.common.undo": "Undo",
   "paintCanvas.common.redo": "Redo",
@@ -16,6 +17,31 @@
   "paintCanvas.common.height": "Height",
   "paintCanvas.common.size": "Size",
   "paintCanvas.common.opacity": "Opacity",
+  "paintCanvas.range.low": "{label} (min)",
+  "paintCanvas.range.high": "{label} (max)",
+  "paintCanvas.profileGraph.point": "Point {number}: {x}, {y}",
+  "paintCanvas.profileGraph.remove": "Remove point",
+  "paintCanvas.profileGraph.linear": "Sharp corner (linear)",
+  "paintCanvas.profileGraph.bezier": "Smooth (bezier cubic)",
+  "paintCanvas.profiles.linear": "Linear",
+  "paintCanvas.profiles.overweight": "Overweight",
+  "paintCanvas.profiles.underweight": "Underweight",
+  "paintCanvas.profileEditor.title": "{param} profile graph",
+  "paintCanvas.profileEditor.button": "{param}: profile graph",
+  "paintCanvas.profileEditor.custom": "Custom",
+  "paintCanvas.profileEditor.actions": "Profile graph actions",
+  "paintCanvas.profileEditor.new": "New graph",
+  "paintCanvas.profileEditor.duplicate": "Duplicate…",
+  "paintCanvas.profileEditor.rename": "Rename…",
+  "paintCanvas.profileEditor.delete": "Delete…",
+  "paintCanvas.profileEditor.reset": "Reset",
+  "paintCanvas.profileEditor.name": "Name",
+  "paintCanvas.profileEditor.saveHeading": "Save profile graph",
+  "paintCanvas.profileEditor.renameHeading": "Rename profile graph",
+  "paintCanvas.profileEditor.deleteHeading": "Delete profile graph",
+  "paintCanvas.profileEditor.deleteConfirm": "Delete \"{name}\"? This can't be undone.",
+  "paintCanvas.profileEditor.replaceHeading": "Replace profile graph",
+  "paintCanvas.profileEditor.replaceConfirm": "You already have a profile graph called \"{name}\". Replace it?",
   "paintCanvas.tool.brush": "Brush",
   "paintCanvas.tool.eraser": "Eraser",
   "paintCanvas.tool.move": "Move, scale and rotate",
@@ -88,6 +114,9 @@
   "paintCanvas.presets.myPresets": "My presets",
   "paintCanvas.presets.unknownAuthor": "Unknown",
   "paintCanvas.presets.deleteConfirm": "Delete \"{name}\"? This can't be undone.",
+  "paintCanvas.presets.deleteHeading": "Delete preset",
+  "paintCanvas.presets.replaceHeading": "Replace preset",
+  "paintCanvas.presets.replace": "Replace",
   "paintCanvas.presets.deleted": "Deleted \"{name}\"",
   "paintCanvas.presets.deleteFailed": "Couldn't delete \"{name}\"",
   "paintCanvas.presets.saved": "Saved \"{name}\" to My presets",
@@ -134,6 +163,8 @@
   "paintCanvas.layers.alphaLock": "Alpha lock",
   "paintCanvas.layers.blendMode": "Blending mode",
   "paintCanvas.layers.actions": "Layer actions",
+  "paintCanvas.layers.rename": "Rename…",
+  "paintCanvas.layers.renameTitle": "Rename layer",
   "paintCanvas.layers.reorder": "Reorder {name}: drag, or press for actions",
   "paintCanvas.layers.duplicate": "Duplicate",
   "paintCanvas.layers.createMask": "Create mask",
@@ -181,6 +212,7 @@
   "paintCanvas.brushConfig.snapToPixelGrid": "Snap to pixel grid",
   "paintCanvas.brushConfig.addToPresets": "Add to presets",
   "paintCanvas.brushConfig.variation": "{param}: {source}",
+  "paintCanvas.brushConfig.varyWith": "{param}: vary with",
   "paintCanvas.layers.mergeDownTitle": "Merge down",
   "paintCanvas.layers.clear": "Clear…",
   "paintCanvas.layers.delete": "Delete…",
@@ -260,6 +292,9 @@
   "paintCanvas.settings.fileIncompatible": "Settings JSON file not compatible",
   "paintCanvas.settings.fileReadFailed": "Failed to read settings JSON file",
   "paintCanvas.settings.exportFailed": "Error exporting settings JSON file",
+  "paintCanvas.settings.gpu": "Draw with the GPU",
+  "paintCanvas.settings.gpuHint": "Try this if drawing is slow. It applies after reloading the page.",
+  "paintCanvas.settings.reloadToApply": "Reload the page to apply this change.",
   "paintCanvas.stats.label": "Canvas details",
   "paintCanvas.stats.size": "Canvas: {width} × {height} px",
   "paintCanvas.stats.zoom": "Zoom: {zoom}",

package/locales/fr.json

@@ -7,6 +7,7 @@
   "paintCanvas.common.clear": "Effacer",
   "paintCanvas.common.cut": "Couper",
   "paintCanvas.common.copy": "Copier",
+  "paintCanvas.common.copyMerged": "Copier avec fusion",
   "paintCanvas.common.paste": "Coller",
   "paintCanvas.common.undo": "Annuler",
   "paintCanvas.common.redo": "Rétablir",
@@ -16,6 +17,31 @@
   "paintCanvas.common.height": "Hauteur",
   "paintCanvas.common.size": "Taille",
   "paintCanvas.common.opacity": "Opacité",
+  "paintCanvas.range.low": "{label} (min)",
+  "paintCanvas.range.high": "{label} (max)",
+  "paintCanvas.profileGraph.point": "Point {number} : {x}, {y}",
+  "paintCanvas.profileGraph.remove": "Supprimer le point",
+  "paintCanvas.profileGraph.linear": "Angle net (linéaire)",
+  "paintCanvas.profileGraph.bezier": "Lisse (bézier cubique)",
+  "paintCanvas.profiles.linear": "Linéaire",
+  "paintCanvas.profiles.overweight": "Surpondéré",
+  "paintCanvas.profiles.underweight": "Sous-pondéré",
+  "paintCanvas.profileEditor.title": "Courbe de profil : {param}",
+  "paintCanvas.profileEditor.button": "{param} : courbe de profil",
+  "paintCanvas.profileEditor.custom": "Personnalisé",
+  "paintCanvas.profileEditor.actions": "Actions de la courbe",
+  "paintCanvas.profileEditor.new": "Nouvelle courbe",
+  "paintCanvas.profileEditor.duplicate": "Dupliquer…",
+  "paintCanvas.profileEditor.rename": "Renommer…",
+  "paintCanvas.profileEditor.delete": "Supprimer…",
+  "paintCanvas.profileEditor.reset": "Réinitialiser",
+  "paintCanvas.profileEditor.name": "Nom",
+  "paintCanvas.profileEditor.saveHeading": "Enregistrer la courbe",
+  "paintCanvas.profileEditor.renameHeading": "Renommer la courbe",
+  "paintCanvas.profileEditor.deleteHeading": "Supprimer la courbe",
+  "paintCanvas.profileEditor.deleteConfirm": "Supprimer « {name} » ? Cette action est irréversible.",
+  "paintCanvas.profileEditor.replaceHeading": "Remplacer la courbe",
+  "paintCanvas.profileEditor.replaceConfirm": "Vous avez déjà une courbe nommée « {name} ». La remplacer ?",
   "paintCanvas.tool.brush": "Pinceau",
   "paintCanvas.tool.eraser": "Gomme",
   "paintCanvas.tool.move": "Déplacer, redimensionner et faire pivoter",
@@ -88,6 +114,9 @@
   "paintCanvas.presets.myPresets": "Mes préréglages",
   "paintCanvas.presets.unknownAuthor": "Inconnu",
   "paintCanvas.presets.deleteConfirm": "Supprimer « {name} » ? Cette action est irréversible.",
+  "paintCanvas.presets.deleteHeading": "Supprimer le préréglage",
+  "paintCanvas.presets.replaceHeading": "Remplacer le préréglage",
+  "paintCanvas.presets.replace": "Remplacer",
   "paintCanvas.presets.deleted": "« {name} » supprimé",
   "paintCanvas.presets.deleteFailed": "Impossible de supprimer « {name} »",
   "paintCanvas.presets.saved": "« {name} » enregistré dans Mes préréglages",
@@ -134,6 +163,8 @@
   "paintCanvas.layers.alphaLock": "Verrouillage alpha",
   "paintCanvas.layers.blendMode": "Mode de fusion",
   "paintCanvas.layers.actions": "Actions du calque",
+  "paintCanvas.layers.rename": "Renommer…",
+  "paintCanvas.layers.renameTitle": "Renommer le calque",
   "paintCanvas.layers.reorder": "Réorganiser {name} : faire glisser, ou appuyer pour les actions",
   "paintCanvas.layers.duplicate": "Dupliquer",
   "paintCanvas.layers.createMask": "Créer un masque",
@@ -181,6 +212,7 @@
   "paintCanvas.brushConfig.snapToPixelGrid": "Aligner sur la grille de pixels",
   "paintCanvas.brushConfig.addToPresets": "Ajouter aux préréglages",
   "paintCanvas.brushConfig.variation": "{param} : {source}",
+  "paintCanvas.brushConfig.varyWith": "{param} : varier selon",
   "paintCanvas.layers.mergeDownTitle": "Fusionner avec le calque inférieur",
   "paintCanvas.layers.clear": "Effacer…",
   "paintCanvas.layers.delete": "Supprimer…",
@@ -260,6 +292,9 @@
   "paintCanvas.settings.fileIncompatible": "Fichier JSON de réglages incompatible",
   "paintCanvas.settings.fileReadFailed": "Échec de la lecture du fichier JSON de réglages",
   "paintCanvas.settings.exportFailed": "Erreur lors de l'exportation du fichier JSON de réglages",
+  "paintCanvas.settings.gpu": "Dessiner avec le GPU",
+  "paintCanvas.settings.gpuHint": "Essayez ceci si le dessin est lent. Le changement s’applique après le rechargement de la page.",
+  "paintCanvas.settings.reloadToApply": "Rechargez la page pour appliquer ce changement.",
   "paintCanvas.stats.label": "Détails de la toile",
   "paintCanvas.stats.size": "Toile : {width} × {height} px",
   "paintCanvas.stats.zoom": "Zoom : {zoom}",