@fewangsit/wangsvue-gsts 2.0.0-alpha.3 → 2.0.0-alpha.30

package/imagecompressor/ImageCompressor.fm.md

@@ -0,0 +1,44 @@
+# ImageCompressor
+type reference: ./index.d.ts
+
+Append a `ImageCompressor` component when the figma context contains:
+
+- A figma component or instance named "Image Compressor" or similar, consisting of an image upload area with a square preview box (showing either an `image-add-line` icon placeholder or an actual image), Edit/Delete action buttons, requirement info text, and optionally paired with a label, required asterisk, and info icon.
+
+## Metadata Shape (Component)
+
+Append this component to the `components` array of the returned JSON.
+
+## Metadata Shape (Properties)
+
+Append these properties to the `props` object of this component.
+
+### Properties definitions
+
+- `label` (string)
+  The text of the label displayed above the image input.
+
+- `fieldInfo` (string | undefined)
+  Whether an info icon (`information-line`) is present next to the label. Omit if absent.
+
+- `imagePreviewSize` ('small' | 'medium' | 'big' | undefined)
+  Infer from the image preview frame dimensions:
+  - `125px` → `'big'`
+  - `80px` → `'medium'`
+  - `30px` → `'small'`
+  - Omit if ambiguous.
+
+- `rounded` (boolean | undefined)
+  Whether the image preview is displayed as a full circle. Omit if the preview is squared.
+
+- `multiple` (boolean | undefined)
+  Whether "Add Photo" and "Remove" action buttons alongside a "Set as default" radio button are present below the image, indicating multiple image support. Omit if absent.
+
+- `mandatory` (boolean | undefined)
+  Whether a red asterisk `*` is present next to the label, indicating the field is required. Omit if absent.
+
+- `invalid` (boolean | undefined)
+  Whether the image input shows an error state (red border, caption text like "Photo must not be empty"). Omit if not in error state.
+
+- `disabled` (boolean | undefined)
+  Whether the image input shows a disabled state (grayed out placeholder). Omit if not disabled.

package/imagecompressor/index.d.ts

@@ -182,7 +182,7 @@ export type ImageCompressorEmits = {
   /**
    * On apply the image cropper.
    */
-  'apply': [value: ImageCompressorPayload];
+  'apply': [value: ImageCompressorPayload, index?: number];
   /**
    * On apply image from props.
    */

package/inputbadge/InputBadge.fm.md

@@ -0,0 +1,34 @@
+# InputBadge
+type reference: ./index.d.ts
+
+Append a `InputBadge` component when the figma context contains:
+
+- A figma component or instance named "Input Badge" or similar, consisting of a text input area containing multiple badge chips (with close buttons), optionally paired with a label, required asterisk, and info icon.
+
+## Metadata Shape (Component)
+
+Append this component to the `components` array of the returned JSON.
+
+## Metadata Shape (Properties)
+
+Append these properties to the `props` object of this component.
+
+### Properties definitions
+
+- `label` (string)
+  The text of the label displayed above the input badge area.
+
+- `placeholder` (string | undefined)
+  The placeholder text inside the input (e.g. "Enter"). When badges are present, the placeholder is replaced by badge chips. Omit if no placeholder text is visible.
+
+- `mandatory` (boolean | undefined)
+  Whether a red asterisk `*` is present next to the label, indicating the field is required. Omit if absent.
+
+- `fieldInfo` (string | undefined)
+  Whether an info icon (`information-line`) is present next to the label. Omit if absent.
+
+- `invalid` (boolean | undefined)
+  Whether the input shows an error state (red border, red caption text). Omit if the field is not in error state.
+
+- `disabled` (boolean | undefined)
+  Whether the input shows a disabled state (gray background, gray text). Omit if the field is not disabled.

package/inputbadge/index.d.ts

@@ -118,6 +118,10 @@ export interface InputBadgeProps {
    * Otherwise, the badge will be fully removed, shifting subsequent items.
    */
   preserveDeletedIndex?: boolean;
+  /**
+   * Maximum length for the input text and badge editing.
+   */
+  maxlength?: number;
 }
 
 /**

package/inputcurrency/index.d.ts

@@ -35,6 +35,14 @@ export interface InputCurrencyProps {
    */
   modelValue?: CurrencyValue;
 
+  /**
+   * Sets the initial value of the field.
+   * This will only available with option 'useValidator'.
+   *
+   * In usecase like edit form, you need to display the previous inputted value.
+   */
+  value?: number;
+
   /**
    * The input label. Tell the user what input is this.
    */
@@ -95,6 +103,12 @@ export interface InputCurrencyProps {
    */
   fieldInfo?: string;
   inputnNumberId?: string;
+
+  /**
+   * Whether the currency dropdown should be selectable or not.
+   * @defaultValue false
+   */
+  selectable?: boolean;
 }
 
 /**

package/inputnumber/InputNumber.fm.md

@@ -0,0 +1,39 @@
+# InputNumber
+type reference: ./index.d.ts
+
+Append a `InputNumber` component when the figma context contains:
+
+- A figma component or instance named "Input Number" or similar, consisting of a numeric input field optionally paired with a label, required asterisk, info icon, increment/decrement buttons, and addon slots.
+
+## Metadata Shape (Component)
+
+Append this component to the `components` array of the returned JSON.
+
+## Metadata Shape (Properties)
+
+Append these properties to the `props` object of this component.
+
+### Properties definitions
+
+- `label` (string)
+  The text of the label displayed above the input field.
+
+- `placeholder` (string | undefined)
+  The placeholder text inside the input field (e.g. "Enter number" or "0"). Omit if no placeholder text is visible.
+
+- `mandatory` (boolean | undefined)
+  Whether a red asterisk `*` is present next to the label. Omit if absent.
+
+- `fieldInfo` (string | undefined)
+  Whether an info icon (`information-line`) is present next to the label. Omit if absent.
+
+- `invalid` (boolean | undefined)
+  Whether the input field shows an error state (red border, red caption text). Omit if the field is not in error state.
+
+- `disabled` (boolean | undefined)
+  Whether the input field shows a disabled state (gray background, gray text). Omit if the field is not disabled.
+
+- `showButtons` (boolean | undefined)
+  Whether increment (`add-line`) and decrement (`subtract-line`) icons are present on the left and right sides of the input. Infer from the Figma type:
+  - Type `"Button Horizontal"` or `"Button Vertical"` → `true`
+  - Types without buttons (`"Default"`, `"Double Field"`, `"Addon Right"`, `"Addon Left"`, etc.) → omit this field

package/inputpassword/InputPassword.fm.md

@@ -0,0 +1,28 @@
+# InputPassword
+type reference: ./index.d.ts
+
+Append a `InputPassword` component when the figma context contains:
+
+- A figma component or instance named "Input Password" or similar, consisting of a password input field showing masked dots (e.g. "**********") and an `eye-line` icon for toggling visibility, optionally paired with a label, required asterisk, and info icon.
+
+## Metadata Shape (Component)
+
+Append this component to the `components` array of the returned JSON.
+
+## Metadata Shape (Properties)
+
+Append these properties to the `props` object of this component.
+
+### Properties definitions
+
+- `label` (string)
+  The text of the label displayed above the password input.
+
+- `placeholder` (string | undefined)
+  The placeholder text inside the password input (e.g. "Enter password"). When a password is entered, the placeholder is replaced with masked dots. Omit if no placeholder text is visible.
+
+- `mandatory` (boolean | undefined)
+  Whether a red asterisk `*` is present next to the label, indicating the field is required. Omit if absent.
+
+- `invalid` (boolean | undefined)
+  Whether the password input shows an error state (red border, red caption text). Omit if the field is not in error state.

package/inputpassword/index.d.ts

@@ -6,6 +6,10 @@ export interface InputPasswordProps {
    * Two way data binding of component.
    */
   modelValue?: string;
+  /**
+   * Unique id for the input element.
+   */
+  inputId?: string;
   /**
    * The label for input field.
    */

package/inputphonenumber/InputPhoneNumber.fm.md

@@ -0,0 +1,34 @@
+# InputPhoneNumber
+type reference: ./index.d.ts
+
+Append a `InputPhoneNumber` component when the figma context contains:
+
+- A figma component or instance named "Input Phone Number" or similar, consisting of a two-part segmented input: a dial code dropdown (e.g. "+62" with a dropdown arrow) on the left and a phone number text field on the right, optionally paired with a label, required asterisk, and info icon.
+
+## Metadata Shape (Component)
+
+Append this component to the `components` array of the returned JSON.
+
+## Metadata Shape (Properties)
+
+Append these properties to the `props` object of this component.
+
+### Properties definitions
+
+- `label` (string)
+  The text of the label displayed above the phone number input.
+
+- `placeholder` (string | undefined)
+  The placeholder text inside the phone number field (e.g. "Enter phone number"). When a number is entered, the placeholder is replaced with the phone digits. Omit if no placeholder text is visible.
+
+- `mandatory` (boolean | undefined)
+  Whether a red asterisk `*` is present next to the label, indicating the field is required. Omit if absent.
+
+- `fieldInfo` (string | undefined)
+  Whether an info icon (`information-line`) is present next to the label. Omit if absent.
+
+- `invalid` (boolean | undefined)
+  Whether the input shows an error state (red border, red caption text). Omit if the field is not in error state.
+
+- `disabled` (boolean | undefined)
+  Whether the input shows a disabled state (gray background, gray text). Omit if the field is not disabled.

package/inputrangenumber/InputRangeNumber.fm.md

@@ -0,0 +1,31 @@
+# InputRangeNumber
+type reference: ./index.d.ts
+
+Append a `InputRangeNumber` component when the figma context contains:
+
+- A figma component or instance named "Input Range Number" or similar, consisting of two number input fields separated by a dash (`--`) separator, optionally paired with a label, required asterisk, and info icon.
+
+## Metadata Shape (Component)
+
+Append this component to the `components` array of the returned JSON.
+
+## Metadata Shape (Properties)
+
+Append these properties to the `props` object of this component.
+
+### Properties definitions
+
+- `label` (string)
+  The text of the label displayed above the range inputs.
+
+- `placeholder` (string | undefined)
+  The placeholder text inside both number inputs (e.g. "Enter"). When a value is entered, the placeholder is replaced with the number. Omit if no placeholder text is visible.
+
+- `mandatory` (boolean | undefined)
+  Whether a red asterisk `*` is present next to the label, indicating the field is required. Omit if absent.
+
+- `invalid` (boolean | undefined)
+  Whether the range inputs show an error state (red borders, red caption text). Omit if the field is not in error state.
+
+- `disabled` (boolean | undefined)
+  Whether the range inputs show a disabled state (gray background, gray text). Omit if the field is not disabled.

package/inputtext/InputText.fm.md

@@ -0,0 +1,34 @@
+# InputText
+type reference: ./index.d.ts
+
+Append a `InputText` component when the figma context contains:
+
+- A figma component or instance named "Input Text" or similar, consisting of a text input field optionally paired with a label, required asterisk, and info icon.
+
+## Metadata Shape (Component)
+
+Append this component to the `components` array of the returned JSON.
+
+## Metadata Shape (Properties)
+
+Append these properties to the `props` object of this component.
+
+### Properties definitions
+
+- `label` (string)
+  The text of the label displayed above the input field.
+
+- `placeholder` (string | undefined)
+  The placeholder text inside the input field. In the default state, the field shows a placeholder like "Enter". When a value is present, the placeholder is replaced with the filled text. Omit if no placeholder text is visible.
+
+- `mandatory` (boolean | undefined)
+  Whether a red asterisk `*` is present next to the label, indicating the field is required. Omit if absent.
+
+- `fieldInfo` (string | undefined)
+  Whether an info icon (`information-line`) is present next to the label. Omit if absent.
+
+- `invalid` (boolean | undefined)
+  Whether the input field shows an error state (red border, red caption text). Omit if the field is not in error state.
+
+- `disabled` (boolean | undefined)
+  Whether the input field shows a disabled state (gray background, gray text). Omit if the field is not disabled.

package/mcp/components.json

@@ -1,6 +1,6 @@
 {
   "metadata": {
-    "generatedAt": "2026-02-09T18:17:29.340Z",
+    "generatedAt": "2026-07-01T09:29:34.294Z",
     "version": "1.0.0",
     "totalComponents": 68,
     "packagePath": "../../packages/globalsettings-tagsamurai"
@@ -1915,39 +1915,31 @@
       "responsive": false
     },
     {
-      "id": "inputotp",
-      "name": "Inputotp",
-      "description": "Inputotp component",
-      "category": "input",
+      "id": "inputotp-fallback",
+      "name": "inputotp",
+      "description": "inputotp component (fallback metadata due to parsing error)",
+      "category": "utility",
       "tags": [
-        "input",
-        "form"
+        "fallback",
+        "parsing-error"
       ],
       "source": "unknown",
       "overridesBase": false,
       "overrideType": "none",
-      "overrideSummary": "No override detected",
-      "inheritanceChain": [
-        {
-          "componentName": "Inputotp",
-          "source": "base",
-          "definitionPath": "library/components/inputotp/Inputotp.vue.d.ts",
-          "childComponents": [],
-          "overrideLevel": 0
-        }
-      ],
-      "inheritanceReport": "Base: Inputotp (library/components/inputotp/Inputotp.vue.d.ts)",
-      "vueFilePath": "library/components/inputotp/Inputotp.vue",
-      "definitionFilePath": "inputotp/index.d.ts",
+      "overrideSummary": "",
+      "inheritanceChain": [],
+      "inheritanceReport": "",
+      "vueFilePath": "",
+      "definitionFilePath": "C:\\Users\\ASUS ROG STRIK\\Documents\\Frontend\\wangsvue\\packages\\globalsettings-tagsamurai\\dist\\inputotp\\index.d.ts",
       "importInfo": {
         "packageName": "@fewangsit/wangsvue-gsts",
-        "importPath": "import { Inputotp } from '@fewangsit/wangsvue-gsts'",
+        "importPath": "import { inputotp } from '@fewangsit/wangsvue-gsts'",
         "treeshakable": true
       },
       "examples": [],
       "useCases": [],
       "dependencies": [],
-      "status": "stable",
+      "status": "unknown",
       "accessibility": {
         "ariaSupport": false,
         "keyboardNavigation": false,
@@ -2899,7 +2891,8 @@
       "Paginator",
       "TagType",
       "ToggleSwitch",
-      "UserName"
+      "UserName",
+      "inputotp"
     ],
     "navigation": [
       "Breadcrumb",
@@ -2926,7 +2919,6 @@
       "InputRangeNumber",
       "InputText",
       "InputURL",
-      "Inputotp",
       "InvisibleField",
       "Textarea"
     ],
@@ -3254,7 +3246,7 @@
         "inputrangenumber"
       ],
       "inputotp": [
-        "inputotp"
+        "inputotp-fallback"
       ],
       "inputpassword": [
         "inputpassword"
@@ -3436,7 +3428,6 @@
         "inputcurrency",
         "inputemail",
         "inputnumber",
-        "inputotp",
         "inputpassword",
         "inputphonenumber",
         "inputrangenumber",
@@ -3448,12 +3439,17 @@
         "inputcurrency",
         "inputemail",
         "inputnumber",
-        "inputotp",
         "inputpassword",
         "inputphonenumber",
         "inputrangenumber",
         "inputtext",
         "inputurl"
+      ],
+      "fallback": [
+        "inputotp-fallback"
+      ],
+      "parsing-error": [
+        "inputotp-fallback"
       ]
     },
     "byCategory": {
@@ -3474,6 +3470,7 @@
         "editor",
         "fileupload",
         "icon",
+        "inputotp-fallback",
         "litedropdown",
         "multiselect",
         "paginator",
@@ -3501,7 +3498,6 @@
         "inputbadge",
         "inputemail",
         "inputnumber",
-        "inputotp",
         "inputpassword",
         "inputphonenumber",
         "inputrangenumber",
@@ -3585,7 +3581,7 @@
         "inlinemessage",
         "inputbadge",
         "inputcurrency",
-        "inputotp",
+        "inputotp-fallback",
         "invisiblefield",
         "languageswitcher",
         "litedropdown",
@@ -4507,7 +4503,23 @@
         "inputemail"
       ],
       "inputotp": [
-        "inputotp"
+        "inputotp-fallback"
+      ],
+      "fallback": [
+        "inputotp-fallback"
+      ],
+      "metadata": [
+        "inputotp-fallback"
+      ],
+      "due": [
+        "inputotp-fallback"
+      ],
+      "parsing": [
+        "inputotp-fallback"
+      ],
+      "error": [
+        "inputotp-fallback",
+        "validatormessage"
       ],
       "password": [
         "inputpassword"
@@ -4718,18 +4730,15 @@
       ],
       "validatormessage": [
         "validatormessage"
-      ],
-      "error": [
-        "validatormessage"
       ]
     }
   },
   "statistics": {
     "totalComponents": 68,
     "componentsByCategory": {
-      "utility": 22,
+      "utility": 23,
       "navigation": 3,
-      "input": 22,
+      "input": 21,
       "integration": 1,
       "data-display": 6,
       "overlay": 5,

package/mcp/components.summary.txt

@@ -1,5 +1,5 @@
 Component Data Source Summary
-Generated: 2026-02-09T18:17:29.340Z
+Generated: 2026-07-01T09:29:34.294Z
 Version: 1.0.0
 Total Components: 68
 Package: ../../packages/globalsettings-tagsamurai
@@ -9,12 +9,12 @@ Statistics:
 - Overrides: 7
 - Accessible Components: 0
 - Total Examples: 0
-- Unresolved Components: 0
+- Unresolved Components: 1
 
 Components by Category:
-- utility: 22
+- utility: 23
 - navigation: 3
-- input: 22
+- input: 21
 - integration: 1
 - data-display: 6
 - overlay: 5
@@ -22,3 +22,6 @@ Components by Category:
 - layout: 1
 - feedback: 3
 - localization: 2
+
+Unresolved Components (Fallback):
+- inputotp-fallback