Initial commit

Author: luksak

.github/workflows/ci.yml

@@ -0,0 +1,30 @@
+name: CI
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+    branches: [main]
+
+jobs:
+  lint:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 18
+          cache: 'npm'
+      - run: npm ci
+      - run: npm run lint
+
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 18
+          cache: 'npm'
+      - run: npm ci
+      - run: npm run build

.github/workflows/publish.yml

@@ -0,0 +1,21 @@
+name: Publish to NPM
+
+on:
+  release:
+    types: [created]
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 18
+          registry-url: https://registry.npmjs.org/
+      - run: npm ci
+      - run: npm run lint
+      - run: npm run build
+      - run: npm publish --access public
+        env:
+          NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}

.gitignore

@@ -0,0 +1,39 @@
+# Dependencies
+node_modules
+.pnp
+.pnp.js
+
+# Build output
+dist
+.nuxt
+.output
+.build
+
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+# Editor directories and files
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+.vscode/*
+!.vscode/extensions.json
+!.vscode/settings.json
+
+# Local env files
+.env
+.env.*
+!.env.example
+
+# Playground
+playground

CONTRIBUTING.md

@@ -0,0 +1,83 @@
+# Contributing to @attributech/nuxt-drupal-image
+
+Thank you for considering contributing to this project! Here's how you can help.
+
+## Development Setup
+
+1. Clone the repository:
+   ```bash
+   git clone https://github.com/attributech/nuxt-drupal-image.git
+   cd nuxt-drupal-image
+   ```
+
+2. Install dependencies:
+   ```bash
+   npm install
+   ```
+
+3. Build the module:
+   ```bash
+   npm run build
+   ```
+
+4. Run the playground (for testing):
+   ```bash
+   npm run dev
+   ```
+
+## Development Workflow
+
+1. Create a new branch for your feature or bugfix:
+   ```bash
+   git checkout -b feature/your-feature-name
+   ```
+
+2. Make your changes and ensure they follow the project's coding style.
+
+3. Run linting:
+   ```bash
+   npm run lint
+   ```
+
+4. Fix any linting issues:
+   ```bash
+   npm run lint:fix
+   ```
+
+5. Build the module to ensure it compiles correctly:
+   ```bash
+   npm run build
+   ```
+
+6. Commit your changes with a descriptive commit message.
+
+7. Push your branch to GitHub:
+   ```bash
+   git push origin feature/your-feature-name
+   ```
+
+8. Create a pull request against the main branch.
+
+## Pull Request Guidelines
+
+- Ensure your code follows the project's coding style.
+- Include tests for new features or bug fixes if applicable.
+- Update documentation if necessary.
+- Keep pull requests focused on a single change.
+- Make sure all tests pass and there are no linting errors.
+
+## Release Process
+
+Releases are managed by the maintainers. The process typically involves:
+
+1. Updating the version in package.json
+2. Creating a new GitHub release
+3. The GitHub Actions workflow will automatically publish to npm
+
+## Code of Conduct
+
+Please be respectful and considerate of others when contributing to this project.
+
+## License
+
+By contributing to this project, you agree that your contributions will be licensed under the project's MIT license.

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 attribute GmbH
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,121 @@
+# @attributech/nuxt-drupal-image
+
+A Nuxt module for handling Drupal image styles.
+
+## Features
+
+- Compatible with Nuxt 2 (with Bridge) and Nuxt 3
+- TypeScript support
+- Auto-imports for the useImageUrl composable
+- Simplifies working with Drupal image styles
+
+## Installation
+
+```bash
+npm install @attributech/nuxt-drupal-image
+```
+
+## Setup
+
+Add the module to your `nuxt.config.ts`:
+
+### Nuxt 3
+
+```ts
+export default defineNuxtConfig({
+  modules: [
+    '@attributech/nuxt-drupal-image'
+  ]
+})
+```
+
+### Nuxt 2 with Bridge
+
+```ts
+import { defineNuxtConfig } from '@nuxt/bridge'
+
+export default defineNuxtConfig({
+  buildModules: [
+    '@attributech/nuxt-drupal-image'
+  ]
+})
+```
+
+## Usage
+
+### useImageUrl
+
+A composable for building Drupal image style URLs.
+
+```ts
+const imageUrl = useImageUrl(imageUri, style)
+```
+
+#### Parameters
+
+- `imageUri`: The Drupal image URI (e.g., 'public://image.jpg')
+- `style`: The Drupal image style name (e.g., 'thumbnail', 'large')
+
+#### Returns
+
+- A string containing the complete URL to the styled image
+
+#### Example
+
+```vue
+<template>
+  <img :src="imageUrl" alt="My image" />
+</template>
+
+<script setup>
+const imageUri = 'public://my-image.jpg'
+const imageUrl = useImageUrl(imageUri, 'large')
+</script>
+```
+
+#### Configuration
+
+The composable uses the `serverUrl` from your Nuxt runtime config. Make sure to set this in your `nuxt.config.ts`:
+
+```ts
+// Nuxt 3
+export default defineNuxtConfig({
+  runtimeConfig: {
+    public: {
+      serverUrl: process.env.SERVER_URL || 'https://example.com'
+    }
+  }
+})
+
+// Nuxt 2 with Bridge
+export default defineNuxtConfig({
+  publicRuntimeConfig: {
+    serverUrl: process.env.SERVER_URL || 'https://example.com'
+  }
+})
+```
+
+## Migration from existing code
+
+### Migrating from util/imageUrl.js
+
+If you're currently using the utility function from `util/imageUrl.js`, you can migrate to the composable as follows:
+
+Before:
+```js
+import imageUrl from '@/util/imageUrl'
+
+const url = imageUrl(imageUri, style, apiUrl)
+```
+
+After:
+```js
+import { useImageUrl } from '@attributech/nuxt-drupal-image'
+
+// The apiUrl is now taken from the Nuxt runtime config
+const url = useImageUrl(imageUri, style)
+```
+
+## License
+
+MIT