geez-input 1.0.8 → 1.0.10

package/README.md

@@ -20,14 +20,76 @@ Geez script (ግዕዝ), also known as Ethiopic script, is an ancient writing sy
 
 ## Installation
 
+### React
+
 ```bash
 npm install geez-input
 ```
 
+Then import from the React subpath:
+
+```tsx
+import { GeezInput, GeezTextArea } from "geez-input/react";
+```
+
+Or use the default export (backward compatible):
+
+```tsx
+import { GeezInput, GeezTextArea } from "geez-input";
+```
+
+**Dependencies:** Only requires `react` and `react-dom` as peer dependencies.
+
+### Vue
+
+```bash
+npm install geez-input-vue geez-input
+```
+
+```vue
+<script setup>
+import { GeezInput, GeezTextArea } from 'geez-input-vue'
+</script>
+```
+
+**Dependencies:** Requires `geez-input` and `vue` (^3.0.0) as peer dependencies.
+
+### Svelte
+
+```bash
+npm install geez-input-svelte geez-input
+```
+
+```svelte
+<script>
+  import { GeezInput, GeezTextArea } from 'geez-input-svelte'
+</script>
+```
+
+**Dependencies:** Requires `geez-input` and `svelte` (^4.0.0 || ^5.0.0) as peer dependencies.
+
+### Angular
+
+```bash
+npm install geez-input-angular geez-input
+```
+
+```typescript
+import { GeezInputComponent, GeezTextAreaComponent } from 'geez-input-angular';
+```
+
+**Dependencies:** Requires `geez-input`, `@angular/core` (^17.0.0 || ^18.0.0 || ^19.0.0), and `@angular/forms` (^17.0.0 || ^18.0.0 || ^19.0.0) as peer dependencies.
+
+> 📖 **For detailed usage examples, see [USAGE.md](./USAGE.md)**  
+> 📦 **For dependency details, see [DEPENDENCIES.md](./DEPENDENCIES.md)**  
+> 🚀 **For publishing instructions, see [PUBLISHING.md](./PUBLISHING.md)**
+
 ## Quick Start
 
+### React
+
 ```tsx
-import { GeezInput, GeezTextArea } from 'geez-input'
+import { GeezInput, GeezTextArea } from "geez-input/react";
 
 function App() {
   return (
@@ -35,17 +97,22 @@ function App() {
       <GeezInput placeholder="Type in Geez..." />
       <GeezTextArea placeholder="Write longer text..." />
     </div>
-  )
+  );
 }
 ```
 
+**Note:** You can also use the default export for backward compatibility:
+```tsx
+import { GeezInput, GeezTextArea } from "geez-input";
+```
+
 ## TypeScript Autocomplete
 
 The components provide full TypeScript autocomplete for all HTML input/textarea attributes:
 
 ```tsx
-import { GeezInput, GeezTextArea } from 'geez-input'
-import type { GeezInputProps, GeezTextAreaProps } from 'geez-input'
+import { GeezInput, GeezTextArea } from "geez-input/react";
+import type { GeezInputProps, GeezTextAreaProps } from "geez-input/react";
 
 function MyForm() {
   return (
@@ -64,8 +131,8 @@ function MyForm() {
         id="name-input"
         aria-label="Full name input"
         aria-required="true"
-        onFocus={(e) => console.log('Focused')}
-        onBlur={(e) => console.log('Blurred')}
+        onFocus={(e) => console.log("Focused")}
+        onBlur={(e) => console.log("Blurred")}
         onChange={(e) => console.log(e.target.value)}
       />
 
@@ -81,12 +148,12 @@ function MyForm() {
         name="story"
         id="story-textarea"
         aria-label="Story textarea"
-        onFocus={(e) => console.log('Focused')}
-        onBlur={(e) => console.log('Blurred')}
+        onFocus={(e) => console.log("Focused")}
+        onBlur={(e) => console.log("Blurred")}
         onChange={(e) => console.log(e.target.value)}
       />
     </>
-  )
+  );
 }
 ```
 
@@ -97,15 +164,16 @@ function MyForm() {
 A styled input component with built-in Geez phonetic keyboard support.
 
 **Props:**
+
 - All standard HTML input attributes (`type`, `placeholder`, `value`, `onChange`, `onFocus`, `onBlur`, `required`, `disabled`, `readOnly`, `maxLength`, `minLength`, `pattern`, `autoComplete`, `autoFocus`, `name`, `id`, `aria-*`, `className`, etc.)
 - `mode?: "geez" | "latin"` - Input mode: "geez" for phonetic transformation, "latin" for standard input (default: `"geez"`)
 
 ```tsx
-import { GeezInput } from 'geez-input'
-import { useState } from 'react'
+import { GeezInput } from "geez-input/react";
+import { useState } from "react";
 
 function MyForm() {
-  const [name, setName] = useState('')
+  const [name, setName] = useState("");
 
   return (
     <GeezInput
@@ -116,7 +184,7 @@ function MyForm() {
       maxLength={50}
       autoComplete="name"
     />
-  )
+  );
 }
 ```
 
@@ -125,11 +193,12 @@ function MyForm() {
 A styled textarea component for longer text input.
 
 **Props:**
+
 - All standard HTML textarea attributes (`rows`, `cols`, `placeholder`, `value`, `onChange`, `onFocus`, `onBlur`, `required`, `disabled`, `readOnly`, `maxLength`, `minLength`, `wrap`, `spellCheck`, `name`, `id`, `aria-*`, `className`, etc.)
 - `mode?: "geez" | "latin"` - Input mode: "geez" for phonetic transformation, "latin" for standard input (default: `"geez"`)
 
 ```tsx
-import { GeezTextArea } from 'geez-input'
+import { GeezTextArea } from "geez-input/react";
 
 function MyForm() {
   return (
@@ -139,7 +208,7 @@ function MyForm() {
       required
       maxLength={500}
     />
-  )
+  );
 }
 ```
 
@@ -148,6 +217,7 @@ function MyForm() {
 The library uses intuitive phonetic mappings:
 
 ### Consonants
+
 - `h` → ህ
 - `l` → ል
 - `m` → ም
@@ -155,18 +225,23 @@ The library uses intuitive phonetic mappings:
 - `ch` → ች
 
 ### Syllables
+
 Type a consonant followed by a vowel:
+
 - `he` → ሀ
 - `lu` → ሉ
 - `mi` → ሚ
 - `sha` → ሻ
 
 ### Double Vowels
+
 Type the same vowel twice for alternate forms:
+
 - `ha` → ሃ
 - `lee` → ሌ
 
 ### Punctuation
+
 - `:` → ፡ (word separator)
 - `::` → ። (sentence ending)
 - `,` → ፣
@@ -186,27 +261,26 @@ Type phonetically to get Geez text:
 #### GeezInput
 
 Props:
+
 - `mode?: "geez" | "latin"` - Input mode: "geez" for phonetic transformation, "latin" for standard input (default: `"geez"`)
 - `...InputHTMLAttributes` - All standard HTML input attributes (including `className`) with full TypeScript support
 
 #### GeezTextArea
 
 Props:
+
 - `mode?: "geez" | "latin"` - Input mode: "geez" for phonetic transformation, "latin" for standard input (default: `"geez"`)
 - `...TextareaHTMLAttributes` - All standard HTML textarea attributes (including `className`) with full TypeScript support
 
 ### Type Exports
 
 ```tsx
-import type { 
-  GeezInputProps, 
-  GeezTextAreaProps 
-} from 'geez-input'
+import type { GeezInputProps, GeezTextAreaProps } from "geez-input/react";
 
 // Use in your own components
 type MyInputProps = GeezInputProps & {
-  label: string
-}
+  label: string;
+};
 
 function MyCustomInput({ label, ...props }: MyInputProps) {
   return (
@@ -214,10 +288,42 @@ function MyCustomInput({ label, ...props }: MyInputProps) {
       <label>{label}</label>
       <GeezInput {...props} />
     </div>
-  )
+  );
 }
 ```
 
+## Core Engine
+
+The core transformation engine is exported and can be used independently or integrated with other frameworks:
+
+```tsx
+import { GeezEngine } from "geez-input/core";
+import type { EngineResult } from "geez-input/core";
+
+// Transform text manually
+const result: EngineResult = GeezEngine.transform(
+  "ህ", // text before cursor
+  "",  // text after cursor
+  "a"  // key pressed
+);
+// result.transformedValue === "ሀ"
+// result.newCursorPosition === 1
+// result.isReplacement === true
+```
+
+This allows you to integrate the Geez transformation engine with any framework or library of your choice.
+
+## Framework-Specific Libraries
+
+This monorepo provides libraries for multiple frameworks:
+
+- **React**: `geez-input` (this package)
+- **Vue**: `geez-input-vue` - See [packages/vue/README.md](packages/vue/README.md)
+- **Svelte**: `geez-input-svelte` - See [packages/svelte/README.md](packages/svelte/README.md)
+- **Angular**: `geez-input-angular` - See [packages/angular/README.md](packages/angular/README.md)
+
+Each library provides framework-specific components while using the same core engine.
+
 ## TypeScript Support
 
 The library is written in TypeScript and provides comprehensive type definitions for all component props.
@@ -230,11 +336,11 @@ The library is written in TypeScript and provides comprehensive type definitions
 
 ## Issues & Support
 
-We welcome your feedback and contributions! 
+We welcome your feedback and contributions!
 
-- **Found a bug?** [Open an issue](https://github.com/tewodrosbirhanu/geez-input/issues)
-- **Have a feature request?** [Create an issue](https://github.com/tewodrosbirhanu/geez-input/issues) and let's discuss it
-- **Questions or suggestions?** Feel free to [start a discussion](https://github.com/tewodrosbirhanu/geez-input/issues)
+- **Found a bug?** [Open an issue](https://github.com/onesamket/geez-input/issues)
+- **Have a feature request?** [Create an issue](https://github.com/onesamket/geez-input/issues) and let's discuss it
+- **Questions or suggestions?** Feel free to [start a discussion](https://github.com/onesamket/geez-input/issues)
 
 This repository is actively maintained and **open for issues**. We appreciate all contributions, bug reports, and feature requests from the community!
 
@@ -244,5 +350,4 @@ Contributions are welcome! Whether you're fixing bugs, adding features, improvin
 
 ## License
 
-MIT  [LICENSE](LICENSE)
-
+MIT [LICENSE](LICENSE)

package/dist/core/index.d.ts

@@ -0,0 +1,18 @@
+/**
+ * @packageDocumentation
+ * Geez Input Core Engine - Phonetic keyboard support for Geez/Ethiopic script
+ *
+ * This is the core transformation engine that can be used with any framework.
+ * It provides the GeezEngine class and related types.
+ *
+ * ## Quick Start
+ *
+ * ```ts
+ * import { GeezEngine } from 'geez-input/core'
+ *
+ * const result = GeezEngine.transform('ህ', '', 'a')
+ * // result.transformedValue === 'ሀ'
+ * ```
+ */
+export { GeezEngine } from './engine';
+export type { EngineResult, GeezOptions, TransformStats } from './types';