@frontfactory/readmore 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Front Factory
+
+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.

package/README.md

@@ -0,0 +1,65 @@
+# @frontfactory/readmore
+
+Lightweight, framework-agnostic plugin to clamp text to N lines with an ellipsis and a `Read more` / `Read less` toggle
+button.
+
+- Zero dependencies, ~1 KB
+- TypeScript types included
+- CSS-driven clamping via `-webkit-line-clamp` and a CSS custom property (`--readmore-lines`)
+- The toggle button is only created when the text actually overflows
+
+## Installation
+
+```bash
+npm install @frontfactory/readmore
+```
+
+## Usage
+
+```ts
+import { ReadMore } from '@frontfactory/readmore';
+import '@frontfactory/readmore/style.css';
+
+ReadMore.init('.excerpt', {
+    lines: 3
+});
+```
+
+Or instantiate against a single element:
+
+```ts
+const el = document.querySelector<HTMLElement>('#bio');
+
+if (el) new ReadMore(el, {
+    lines: 4
+});
+```
+
+## Options
+
+| Option          | Type     | Default          | Description                                         |
+|-----------------|----------|------------------|-----------------------------------------------------|
+| `lines`         | `number` | `3`              | Number of lines to clamp to.                        |
+| `moreText`      | `string` | `'Read more'`    | Label of the button when the text is collapsed.     |
+| `lessText`      | `string` | `'Read less'`    | Label of the button when the text is expanded.      |
+| `buttonClass`   | `string` | `'readmore-btn'` | Class applied to the toggle button.                 |
+| `expandedClass` | `string` | `'is-expanded'`  | Class applied to the target element while expanded. |
+
+## API
+
+```ts
+const instance = new ReadMore(element, options);
+
+instance.toggle();      // expand / collapse programmatically
+instance.expanded;      // boolean getter
+instance.destroy();     // remove button, classes and listeners
+
+ReadMore.init(selector, options); // returns ReadMore[]
+```
+
+## How it works
+
+The plugin sets the CSS custom property `--readmore-lines` on the target element and toggles the `.readmore-clamp`
+class. The bundled stylesheet uses that variable in a `-webkit-line-clamp` rule, so the ellipsis appears at the end of
+the requested line. The toggle button is mounted right after the element only when the content actually overflows, and
+unmounted again on resize if the text ends up fitting.

package/package.json

@@ -0,0 +1,63 @@
+{
+    "name": "@frontfactory/readmore",
+    "version": "1.0.0",
+    "description": "Lightweight plugin to clamp text to N lines with ellipsis and a read more action.",
+    "type": "module",
+    "scripts": {
+        "dev": "vite",
+        "build": "vite build",
+        "preview": "vite preview",
+        "typecheck": "tsc --noEmit",
+        "prepare": "husky",
+        "release": "semantic-release"
+    },
+    "engines": {
+        "node": ">=20.19"
+    },
+    "main": "./dist/readmore.js",
+    "module": "./dist/readmore.js",
+    "types": "./dist/readmore.d.ts",
+    "exports": {
+        ".": {
+            "types": "./dist/readmore.d.ts",
+            "import": "./dist/readmore.js"
+        },
+        "./style.css": "./dist/readmore.css",
+        "./package.json": "./package.json"
+    },
+    "devDependencies": {
+        "@commitlint/cli": "^20.5.3",
+        "@commitlint/config-conventional": "^20.5.3",
+        "@semantic-release/changelog": "^6.0.3",
+        "@semantic-release/git": "^10.0.1",
+        "@semantic-release/github": "^12.0.6",
+        "conventional-changelog-conventionalcommits": "^9.3.1",
+        "husky": "^9.1.7",
+        "semantic-release": "^25.0.3",
+        "typescript": "^5.4.0",
+        "vite": "^8.0.11",
+        "vite-plugin-dts": "^5.0.0",
+        "vite-plugin-static-copy": "^4.1.0"
+    },
+    "files": [
+        "dist"
+    ],
+    "keywords": [
+        "readmore",
+        "expand",
+        "collapse",
+        "front-end"
+    ],
+    "license": "MIT",
+    "homepage": "https://github.com/front-factory/readmore",
+    "bugs": {
+        "url": "https://github.com/front-factory/readmore/issues"
+    },
+    "repository": {
+        "type": "git",
+        "url": "git+https://github.com/front-factory/readmore.git"
+    },
+    "publishConfig": {
+        "access": "public"
+    }
+}