@net-advantage/jo-ui-input 0.1.0 → 1.1.5

package/README.md

@@ -1,83 +1,83 @@
-# @net-advantage/jo-ui-input
-
-Publishable input primitives package.
-
-The input follows a strict MVVM split. The model owns kind behavior, parsing, and formatting. The view-model owns editing state. The view renders the view-model. Semantic wrappers only set `kind` and numeric defaults.
-
-## MVVM
-
-```mermaid
-flowchart LR
-  Props["InputProps"] --> ViewModel["useInputViewModel"]
-  Model["input.model.ts<br/>kind, parse, format"] --> ViewModel
-  ViewModel --> View["Input.tsx"]
-  Metadata["jo-ui-field-metadata"] --> View
-  View -->|"focus, change, blur"| ViewModel
-  ViewModel -->|"onValueChange"| Host["Host application"]
-  ViewModel -->|"onParsedValueChange"| Host
-  Wrappers["EmailInput and numeric wrappers"] --> View
-```
-
-| Layer | File | Responsibility |
-| --- | --- | --- |
-| Contract | [input.types.ts](src/input.types.ts) | Kind, parsed value, props, and view-model |
-| Model | [input.model.ts](src/input.model.ts) | Resolve kind behavior, parse text, and format on blur |
-| View-model | [input.view-model.ts](src/input.view-model.ts) | Own the draft while editing and map messages |
-| View | [Input.tsx](src/Input.tsx) | Render the field from the view-model |
-| Shared metadata | `@net-advantage/jo-ui-field-metadata` | Lay out the label, helper text, required marker, and nested input |
-| Wrappers | [semantic-inputs.tsx](src/semantic-inputs.tsx) | Set `kind` for email, integer, decimal, percentage, and currency |
-
-## Models
-
-```mermaid
-flowchart TD
-  Kind["InputKind"] --> Behavior["KindBehavior"]
-  Kind --> Parsed["ParsedInputValue"]
-  Behavior --> Presentation["NumericPresentation"]
-  Props["InputProps"] --> ViewModel["InputViewModel"]
-  Parsed --> ViewModel
-  Presentation --> ViewModel
-```
-
-- `InputKind` is `text`, `email`, `password`, `search`, `tel`, `url`, `integer`, `decimal`, `percentage`, or `currency`.
-- `ParsedInputValue` is a string, a number, or `null`.
-- A controlled value is shown until the field is focused. While editing, the view-model keeps a draft. Blur formats that draft and leaves edit mode.
-- `parse` and `format` override the kind parser and formatter. Omit them and the model uses the kind defaults.
-- `labelPlacement` accepts `top` or `left`; `descriptionPlacement` accepts `below-label` or `below-control`.
-- Validation errors remain alerts below the input while ordinary helper text is rendered by `FieldMetadata`.
-
-## Semantic input strategy
-
-Use one base control (`InputField`) and configure behavior with `kind`:
-
-- `text`, `email`, `password`, `search`, `tel`, `url`
-- `integer`, `decimal`, `percentage`, `currency`
-
-Helpful props for semantic kinds:
-
-- `onParsedValueChange`: emits parsed values (`number`, `string`, or `null`)
-- `parse`: custom parser override
-- `format`: custom formatter override
-- `locale`, `currency`, `minimumFractionDigits`, `maximumFractionDigits`
-
-Convenience wrappers are also exported:
-
-- `EmailInput`
-- `IntegerInput`
-- `DecimalInput`
-- `PercentageInput`
-- `CurrencyInput`
-
-## Structure
-
-- src: runtime component, model, view-model, and types.
-- stories: Storybook stories for documentation and visual testing.
-
-## Publish footprint
-
-This package publishes only:
-
-- dist
-- README.md
-
-Stories and tests are excluded from the published artifact by design.
+# @net-advantage/jo-ui-input
+
+Publishable input primitives package.
+
+The input follows a strict MVVM split. The model owns kind behavior, parsing, and formatting. The view-model owns editing state. The view renders the view-model. Semantic wrappers only set `kind` and numeric defaults.
+
+## MVVM
+
+```mermaid
+flowchart LR
+  Props["InputProps"] --> ViewModel["useInputViewModel"]
+  Model["input.model.ts<br/>kind, parse, format"] --> ViewModel
+  ViewModel --> View["Input.tsx"]
+  Metadata["jo-ui-field-metadata"] --> View
+  View -->|"focus, change, blur"| ViewModel
+  ViewModel -->|"onValueChange"| Host["Host application"]
+  ViewModel -->|"onParsedValueChange"| Host
+  Wrappers["EmailInput and numeric wrappers"] --> View
+```
+
+| Layer | File | Responsibility |
+| --- | --- | --- |
+| Contract | [input.types.ts](src/input.types.ts) | Kind, parsed value, props, and view-model |
+| Model | [input.model.ts](src/input.model.ts) | Resolve kind behavior, parse text, and format on blur |
+| View-model | [input.view-model.ts](src/input.view-model.ts) | Own the draft while editing and map messages |
+| View | [Input.tsx](src/Input.tsx) | Render the field from the view-model |
+| Shared metadata | `@net-advantage/jo-ui-field-metadata` | Lay out the label, helper text, required marker, and nested input |
+| Wrappers | [semantic-inputs.tsx](src/semantic-inputs.tsx) | Set `kind` for email, integer, decimal, percentage, and currency |
+
+## Models
+
+```mermaid
+flowchart TD
+  Kind["InputKind"] --> Behavior["KindBehavior"]
+  Kind --> Parsed["ParsedInputValue"]
+  Behavior --> Presentation["NumericPresentation"]
+  Props["InputProps"] --> ViewModel["InputViewModel"]
+  Parsed --> ViewModel
+  Presentation --> ViewModel
+```
+
+- `InputKind` is `text`, `email`, `password`, `search`, `tel`, `url`, `integer`, `decimal`, `percentage`, or `currency`.
+- `ParsedInputValue` is a string, a number, or `null`.
+- A controlled value is shown until the field is focused. While editing, the view-model keeps a draft. Blur formats that draft and leaves edit mode.
+- `parse` and `format` override the kind parser and formatter. Omit them and the model uses the kind defaults.
+- `labelPlacement` accepts `top` or `left`; `descriptionPlacement` accepts `below-label` or `below-control`.
+- Validation errors remain alerts below the input while ordinary helper text is rendered by `FieldMetadata`.
+
+## Semantic input strategy
+
+Use one base control (`InputField`) and configure behavior with `kind`:
+
+- `text`, `email`, `password`, `search`, `tel`, `url`
+- `integer`, `decimal`, `percentage`, `currency`
+
+Helpful props for semantic kinds:
+
+- `onParsedValueChange`: emits parsed values (`number`, `string`, or `null`)
+- `parse`: custom parser override
+- `format`: custom formatter override
+- `locale`, `currency`, `minimumFractionDigits`, `maximumFractionDigits`
+
+Convenience wrappers are also exported:
+
+- `EmailInput`
+- `IntegerInput`
+- `DecimalInput`
+- `PercentageInput`
+- `CurrencyInput`
+
+## Structure
+
+- src: runtime component, model, view-model, and types.
+- stories: Storybook stories for documentation and visual testing.
+
+## Publish footprint
+
+This package publishes only:
+
+- dist
+- README.md
+
+Stories and tests are excluded from the published artifact by design.

package/dist/index.js

@@ -1,3 +1,4 @@
+import "./jo-ui-input.css";
 import { FieldMetadata as e } from "@net-advantage/jo-ui-field-metadata";
 import { useCallback as t, useEffect as n, useMemo as r, useState as i } from "react";
 //#region \0rolldown/runtime.js

package/package.json

@@ -1,45 +1,46 @@
-{
-  "name": "@net-advantage/jo-ui-input",
-  "version": "0.1.0",
-  "private": false,
-  "type": "module",
-  "main": "./dist/index.cjs",
-  "module": "./dist/index.js",
-  "types": "./dist/index.d.ts",
-  "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.js",
-      "require": "./dist/index.cjs"
-    }
-  },
-  "files": [
-    "dist",
-    "README.md"
-  ],
-  "sideEffects": [
-    "**/*.css"
-  ],
-  "dependencies": {
-    "@net-advantage/jo-ui-field-metadata": "workspace:*"
-  },
-  "peerDependencies": {
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0"
-  },
-  "scripts": {
-    "build": "pnpm run build:styles && pnpm run build:js && pnpm run build:types",
-    "build:styles": "pnpm exec tailwindcss -c ../../tailwind.controls.config.cjs -i ./src/input.tailwind.css -o ./src/input.css --minify",
-    "build:types": "tsc -p tsconfig.build.json",
-    "build:js": "vite build",
-    "test": "vitest run"
-  },
-  "devDependencies": {
-    "@types/react": "^19.2.18",
-    "@types/react-dom": "^19.2.7",
-    "typescript": "~6.0.2",
-    "vite": "^8.3.0",
-    "vitest": "latest",
-    "@vitejs/plugin-react": "^6.1.1"
-  }
-}
+{
+  "name": "@net-advantage/jo-ui-input",
+  "version": "1.1.5",
+  "private": false,
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    },
+    "./style.css": "./dist/jo-ui-input.css"
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "dependencies": {
+    "@net-advantage/jo-ui-field-metadata": "1.1.5"
+  },
+  "peerDependencies": {
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
+  },
+  "devDependencies": {
+    "@types/react": "^19.2.18",
+    "@types/react-dom": "^19.2.7",
+    "typescript": "~6.0.2",
+    "vite": "^8.3.0",
+    "vitest": "latest",
+    "@vitejs/plugin-react": "^6.1.1"
+  },
+  "scripts": {
+    "build": "pnpm run build:styles && pnpm run build:js && pnpm run build:types",
+    "build:styles": "pnpm exec tailwindcss -c ../../tailwind.controls.config.cjs -i ./src/input.tailwind.css -o ./src/input.css --minify",
+    "build:types": "tsc -p tsconfig.build.json",
+    "build:js": "vite build",
+    "test": "vitest run"
+  }
+}