@lvl99dotcom/paintcanvas 0.6.0 → 0.7.0

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

@@ -2,12 +2,16 @@ import { PcElement, defineElement, emit } from "../../base/index.js";
 import { css, html } from "lit";
 import { live } from "lit/directives/live.js";
 // src/ui/elements/PcToggleCheckbox/index.ts
+/** Sizes of the switch: `m` (20px high, the default) and `s` (16px high, e.g. in toolbars) */
+var TOGGLE_SIZES = ["m", "s"];
 /**
-* An on/off switch with its text (the element's content) beside it, e.g. for settings. Fires `change` when the user
-* turns it on or off.
+* An on/off switch with its text (the element's content) beside it, e.g. for settings. Use it instead of plain
+* checkboxes. It comes in two sizes (`size`: `m`, 20px high, by default, or `s`, 16px high), both pressable over at
+* least 24px of height. Fires `change` when the user turns it on or off.
 *
 * @example
 * html`<pc-toggle-checkbox .checked=${pinchZoom} @change=${toggle}>Pinch to zoom</pc-toggle-checkbox>`
+* html`<pc-toggle-checkbox size="s">Show stroke points</pc-toggle-checkbox>`
 */
 var PcToggleCheckbox = class extends PcElement {
 	static properties = {
@@ -19,15 +23,27 @@ var PcToggleCheckbox = class extends PcElement {
 		disabled: {
 			type: Boolean,
 			reflect: true
+		},
+		size: {
+			type: String,
+			reflect: true
 		}
 	};
 	static styles = [PcElement.styles, css`
       :host {
+        --pc-toggle-height: 20px;
+        --pc-toggle-width: 36px;
         display: flex;
       }
+      :host([size="s"]) {
+        --pc-toggle-height: 16px;
+        --pc-toggle-width: 28px;
+      }
       label {
         display: flex;
         flex: 1;
+        /* The pressable area is at least 24px high, whatever the switch's size */
+        min-height: 24px;
         gap: var(--pc-space-2);
         align-items: center;
         color: var(--pc-text);
@@ -42,8 +58,8 @@ var PcToggleCheckbox = class extends PcElement {
       input {
         position: relative;
         flex: none;
-        width: 36px;
-        height: 20px;
+        width: var(--pc-toggle-width);
+        height: var(--pc-toggle-height);
         margin: 0;
         border-radius: var(--pc-radius-pill);
         background: var(--pc-disabled);
@@ -54,8 +70,8 @@ var PcToggleCheckbox = class extends PcElement {
         position: absolute;
         top: 2px;
         left: 2px;
-        width: 16px;
-        height: 16px;
+        width: calc(var(--pc-toggle-height) - 4px);
+        height: calc(var(--pc-toggle-height) - 4px);
         border-radius: 50%;
         background: #ffffff;
         content: "";
@@ -65,7 +81,9 @@ var PcToggleCheckbox = class extends PcElement {
         background: var(--pc-accent);
       }
       input:checked::before {
-        transform: translateX(16px);
+        transform: translateX(
+          calc(var(--pc-toggle-width) - var(--pc-toggle-height))
+        );
       }
       input:focus-visible {
         outline: var(--pc-focus-width) solid var(--pc-focus);
@@ -81,6 +99,7 @@ var PcToggleCheckbox = class extends PcElement {
 		super();
 		this.checked = false;
 		this.disabled = false;
+		this.size = "m";
 	}
 	/** Follow the user's change, and tell listeners */
 	onChange(event) {
@@ -102,4 +121,4 @@ var PcToggleCheckbox = class extends PcElement {
 	}
 };
 defineElement("pc-toggle-checkbox", PcToggleCheckbox);
-export { PcToggleCheckbox };
+export { PcToggleCheckbox, TOGGLE_SIZES };

package/dist/ui/elements/PcToolSettings/index.d.ts

@@ -3,6 +3,7 @@ import { PcElement } from "../../base";
 import PaintCanvas, { Tool } from "../../../lib/classes/PaintCanvas";
 import type { BrushConfig } from "../../../lib/brushes/types";
 import "../PcBrushSize";
+import "../PcToggleCheckbox";
 import "../PcNumberSlider";
 import "../PcPopover";
 /** Settings varied with pen tilt by the tilt toggle */

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

@@ -8,6 +8,7 @@ import "../../../lib/classes/BrushSettings/index.js";
 import { MAX_ZOOM, MIN_ZOOM } from "../../../lib/classes/Viewport/index.js";
 import { iconLabel } from "../../icons/index.js";
 import "../PcBrushSize/index.js";
+import "../PcToggleCheckbox/index.js";
 import "../PcNumberSlider/index.js";
 import "../PcPopover/index.js";
 import { html, nothing, svg, unsafeCSS } from "lit";
@@ -430,15 +431,14 @@ var PcToolSettings = class extends PcElement {
           ${iconLabel(this.iconUrl(app.constrainProportions ? "linked" : "unlinked"), this.t("paintCanvas.toolSettings.constrainProportions"))}
         </label>
         ${side("height", this.t("paintCanvas.common.height"))}
-        <label>
-          <input
-            type="checkbox"
-            class="percent"
-            .checked=${this.percent}
-            @change=${(e) => this.percent = e.target.checked}
-          />
+        <pc-toggle-checkbox
+          class="percent"
+          size="s"
+          .checked=${this.percent}
+          @change=${(e) => this.percent = e.detail.checked}
+        >
           ${this.t("paintCanvas.toolSettings.percent")}
-        </label>
+        </pc-toggle-checkbox>
         <button
           type="button"
           class="icon-button flip-horizontal"

package/dist/ui/elements/PcVersion/index.d.ts

@@ -0,0 +1,12 @@
+import { PcElement } from "../../base";
+/**
+ * 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>`
+ */
+export declare class PcVersion extends PcElement {
+    static styles: import("lit").CSSResultGroup[];
+    render(): import("lit").TemplateResult<1>;
+}

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/index.d.ts

@@ -4,6 +4,7 @@ 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";
@@ -27,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,6 +5,7 @@ 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";
@@ -28,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, DIALOG_DISMISS_EVENT, DRAG_THRESHOLD, IconRegistry, LIGHT_TOKENS, LONG_PRESS_MS, LayoutStateController, MENU_MARGIN, OK_CHOICE, PANE_COLLAPSE_EVENT, PaintCanvasElement, PcAppSettings, PcBrushSize, PcButton, PcButtonGroup, 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, PointerDrag, STATE_EVENT, THEMES, THEME_ICONS, TOAST_DURATION_MS, TOKENS_CSS, askConfirm, askText, curvePath, defineElement, deletePresetQuestion, dragDelta, emit, fitNumber, formatBytes, icons, installTokens, isDismissingPress, isMenuItem, isTheme, markDismissingPress, matchesState, menuLeft, menuSections, menuTop, movePoint, parseSideModes, rangeFraction, 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/locales/en-GB.json

@@ -163,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",
@@ -290,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

@@ -163,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",
@@ -290,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

@@ -163,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",
@@ -290,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}",

package/locales/ja.json

@@ -163,6 +163,8 @@
   "paintCanvas.layers.alphaLock": "透明部分をロック",
   "paintCanvas.layers.blendMode": "描画モード",
   "paintCanvas.layers.actions": "レイヤーの操作",
+  "paintCanvas.layers.rename": "名前を変更…",
+  "paintCanvas.layers.renameTitle": "レイヤー名を変更",
   "paintCanvas.layers.reorder": "{name}の並べ替え：ドラッグ、または押して操作を表示",
   "paintCanvas.layers.duplicate": "複製",
   "paintCanvas.layers.createMask": "マスクを作成",
@@ -290,6 +292,9 @@
   "paintCanvas.settings.fileIncompatible": "この設定のJSONファイルには対応していません",
   "paintCanvas.settings.fileReadFailed": "設定のJSONファイルを読み込めませんでした",
   "paintCanvas.settings.exportFailed": "設定のJSONファイルを書き出せませんでした",
+  "paintCanvas.settings.gpu": "GPU で描画する",
+  "paintCanvas.settings.gpuHint": "描画が遅い場合にお試しください。ページを再読み込みすると適用されます。",
+  "paintCanvas.settings.reloadToApply": "この変更を適用するにはページを再読み込みしてください。",
   "paintCanvas.stats.label": "キャンバスの詳細",
   "paintCanvas.stats.size": "キャンバス: {width} × {height} px",
   "paintCanvas.stats.zoom": "ズーム: {zoom}",

package/locales/ko.json

@@ -163,6 +163,8 @@
   "paintCanvas.layers.alphaLock": "투명 픽셀 잠금",
   "paintCanvas.layers.blendMode": "혼합 모드",
   "paintCanvas.layers.actions": "레이어 작업",
+  "paintCanvas.layers.rename": "이름 바꾸기…",
+  "paintCanvas.layers.renameTitle": "레이어 이름 바꾸기",
   "paintCanvas.layers.reorder": "{name} 순서 변경: 드래그하거나 눌러서 작업 보기",
   "paintCanvas.layers.duplicate": "복제",
   "paintCanvas.layers.createMask": "마스크 만들기",
@@ -290,6 +292,9 @@
   "paintCanvas.settings.fileIncompatible": "호환되지 않는 설정 JSON 파일입니다",
   "paintCanvas.settings.fileReadFailed": "설정 JSON 파일을 읽지 못했습니다",
   "paintCanvas.settings.exportFailed": "설정 JSON 파일을 내보내지 못했습니다",
+  "paintCanvas.settings.gpu": "GPU로 그리기",
+  "paintCanvas.settings.gpuHint": "그리기가 느리면 사용해 보세요. 페이지를 새로 고친 후 적용됩니다.",
+  "paintCanvas.settings.reloadToApply": "이 변경 사항을 적용하려면 페이지를 새로 고치세요.",
   "paintCanvas.stats.label": "캔버스 정보",
   "paintCanvas.stats.size": "캔버스: {width} × {height} px",
   "paintCanvas.stats.zoom": "확대/축소: {zoom}",

package/locales/zh-Hans.json

@@ -163,6 +163,8 @@
   "paintCanvas.layers.alphaLock": "锁定透明像素",
   "paintCanvas.layers.blendMode": "混合模式",
   "paintCanvas.layers.actions": "图层操作",
+  "paintCanvas.layers.rename": "重命名…",
+  "paintCanvas.layers.renameTitle": "重命名图层",
   "paintCanvas.layers.reorder": "调整{name}的顺序：拖动，或按下以显示操作",
   "paintCanvas.layers.duplicate": "复制",
   "paintCanvas.layers.createMask": "创建蒙版",
@@ -290,6 +292,9 @@
   "paintCanvas.settings.fileIncompatible": "不兼容的设置 JSON 文件",
   "paintCanvas.settings.fileReadFailed": "无法读取设置 JSON 文件",
   "paintCanvas.settings.exportFailed": "导出设置 JSON 文件时出错",
+  "paintCanvas.settings.gpu": "使用 GPU 绘制",
+  "paintCanvas.settings.gpuHint": "如果绘制缓慢，请尝试此选项。重新加载页面后生效。",
+  "paintCanvas.settings.reloadToApply": "重新加载页面以应用此更改。",
   "paintCanvas.stats.label": "画布详情",
   "paintCanvas.stats.size": "画布：{width} × {height} 像素",
   "paintCanvas.stats.zoom": "缩放：{zoom}",

package/locales/zh-Hant.json

@@ -163,6 +163,8 @@
   "paintCanvas.layers.alphaLock": "鎖定透明像素",
   "paintCanvas.layers.blendMode": "混合模式",
   "paintCanvas.layers.actions": "圖層動作",
+  "paintCanvas.layers.rename": "重新命名…",
+  "paintCanvas.layers.renameTitle": "重新命名圖層",
   "paintCanvas.layers.reorder": "調整{name}的順序：拖曳，或按下以顯示動作",
   "paintCanvas.layers.duplicate": "複製",
   "paintCanvas.layers.createMask": "建立遮罩",
@@ -290,6 +292,9 @@
   "paintCanvas.settings.fileIncompatible": "不相容的設定 JSON 檔案",
   "paintCanvas.settings.fileReadFailed": "無法讀取設定 JSON 檔案",
   "paintCanvas.settings.exportFailed": "匯出設定 JSON 檔案時發生錯誤",
+  "paintCanvas.settings.gpu": "使用 GPU 繪製",
+  "paintCanvas.settings.gpuHint": "如果繪製緩慢，請嘗試此選項。重新載入頁面後生效。",
+  "paintCanvas.settings.reloadToApply": "重新載入頁面以套用此變更。",
   "paintCanvas.stats.label": "畫布詳細資料",
   "paintCanvas.stats.size": "畫布：{width} × {height} 像素",
   "paintCanvas.stats.zoom": "縮放：{zoom}",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvl99dotcom/paintcanvas",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "description": "Open-source painting engine and renderer for the browser, with optional UI.",
   "keywords": [
     "drawing",
@@ -64,7 +64,7 @@
     "format:check": "prettier --check .",
     "build:validators": "node scripts/build-validators.ts",
     "icons:build": "node scripts/build-icons.ts",
-    "dev": "pnpm icons:build && vite demo --port 5190 --strictPort --open",
+    "dev": "pnpm icons:build && vite --config vite.demo.config.ts --port 5190 --strictPort --open",
     "demo": "pnpm dev",
     "docs": "pnpm --filter paintcanvas-docs start",
     "docs:build": "pnpm --filter paintcanvas-docs build",