diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json index c7bdcb9..71a7554 100644 --- a/.devcontainer/devcontainer.json +++ b/.devcontainer/devcontainer.json @@ -1,6 +1,6 @@ { "name": "Tailor - Image Content Element", - "image": "mcr.microsoft.com/devcontainers/typescript-node:1-22-bookworm", + "image": "mcr.microsoft.com/devcontainers/typescript-node:4-24-trixie", "features": { "ghcr.io/devcontainers-extra/features/pnpm:2": {}, "ghcr.io/devcontainers/features/github-cli:1": {} diff --git a/README.md b/README.md index ab80938..636fd93 100644 --- a/README.md +++ b/README.md @@ -1,24 +1,33 @@ -# ce-image +# Image -Tailor image content element component. +Image content element with upload and alt text support. -## Development +**Type:** `IMAGE` -Dev server: +## Data -```sh -pnpm dev -``` +| Field | Type | Description | +|-------|------|-------------| +| `url` | `string \| null` | Public image URL | +| `alt` | `string?` | Alt text | -Lint +## Edit -```sh -pnpm lint -``` +- Image preview with progressive loading +- Upload button in top toolbar (JPG, JPEG, PNG, GIF, WEBP, AVIF) with URL source support +- Alt text field in side toolbar + +## Display -Test +- Renders the image with alt text +- Click image to open a fullscreen viewer dialog + +## Development ```sh +pnpm dev # Preview :8080 | Edit :8010 | Display :8020 | Server :8030 +pnpm build +pnpm lint pnpm test ``` diff --git a/package.json b/package.json index c975352..c0e3ec2 100644 --- a/package.json +++ b/package.json @@ -17,15 +17,15 @@ }, "devDependencies": { "@changesets/cli": "^2.29.5", - "@playwright/test": "1.53.2", - "@tailor-cms/cek-e2e": "^1.3.2", - "@tailor-cms/eslint-config": "1.1.2", - "@tailor-cms/tce-boot": "1.3.2", + "@playwright/test": "^1.58.2", + "@tailor-cms/cek-e2e": "^2.0.0-beta.10", + "@tailor-cms/eslint-config": "^2.0.0-beta.10", + "@tailor-cms/tce-boot": "^2.0.0-beta.10", "@types/node": "^24.0.12", "dotenv": "^17.1.0", - "eslint": "^9.30.1", + "eslint": "^9.39.3", "prettier": "^3.6.2", - "typescript": "^5.8.3" + "typescript": "^6.0.2" }, "packageManager": "pnpm@10.12.3" } diff --git a/packages/display/package.json b/packages/display/package.json index 46bd05d..88fd42b 100644 --- a/packages/display/package.json +++ b/packages/display/package.json @@ -3,7 +3,7 @@ "description": "Tailor CMS image element end-user component", "author": "Studion (https://github.com/tailor-cms)", "type": "module", - "version": "1.1.0", + "version": "1.1.1-beta.0", "exports": { ".": { "import": "./dist/index.js", @@ -25,15 +25,17 @@ "prepublish": "pnpm build" }, "peerDependencies": { - "vue": "^3.5.13" + "vue": "^3.5.29" }, "devDependencies": { "@tailor-cms/ce-image-manifest": "workspace:*", - "@tailor-cms/eslint-config": "1.1.2", - "@vitejs/plugin-vue": "^6.0.0", - "typescript": "^5.8.3", - "vite": "^7.0.3", - "vue-tsc": "^3.0.1" + "@tailor-cms/eslint-config": "^2.0.0-beta.10", + "@vitejs/plugin-vue": "^6.0.5", + "typescript": "^6.0.2", + "vite": "^8.0.0", + "vite-plugin-lib-inject-css": "^2.2.2", + "vue-tsc": "^3.2.5", + "vuetify": "^4.0.0" }, "publishConfig": { "access": "public" diff --git a/packages/display/src/components/Display.vue b/packages/display/src/components/Display.vue index 31f94a9..9ac21b8 100644 --- a/packages/display/src/components/Display.vue +++ b/packages/display/src/components/Display.vue @@ -1,35 +1,80 @@