@wix/headless-forms 0.0.16 → 0.0.17

package/README.md

@@ -27,16 +27,9 @@ All changes should be documented using `jsdoc` and updating `docs/api/FORM_INTER
 ## Publishing
 
 1. **Update Version**
-   - Update version in `package.json`
-   - Create PR and merge to main branch
+ The version will be updated automatically by Falcon after merging to master
 
-2. **Publish to NPM**
-   - Go to GitHub Actions
-   - Run "Publish Package" workflow
-   - Enter package name: `forms`
-   - Monitor the workflow for successful completion
-
-3. **Update SDK Exports**
+2. **Update SDK Exports**
    - Go to Form app in Wix Dev Center
    - Update SDK exports extensions:
      - "Forms SDK Exports Components"

package/cjs/dist/react/index.d.ts

@@ -1,3 +1,3 @@
 export * as Form from './Form.js';
 export * from './types.js';
-export * from './Phone.js';
+export { PhoneField } from '@wix/form-public';

package/cjs/dist/react/index.js

@@ -36,7 +36,8 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Form = void 0;
+exports.PhoneField = exports.Form = void 0;
 exports.Form = __importStar(require("./Form.js"));
 __exportStar(require("./types.js"), exports);
-__exportStar(require("./Phone.js"), exports);
+var form_public_1 = require("@wix/form-public");
+Object.defineProperty(exports, "PhoneField", { enumerable: true, get: function () { return form_public_1.PhoneField; } });

package/dist/react/index.d.ts

@@ -1,3 +1,3 @@
 export * as Form from './Form.js';
 export * from './types.js';
-export * from './Phone.js';
+export { PhoneField } from '@wix/form-public';

package/dist/react/index.js

@@ -1,3 +1,3 @@
 export * as Form from './Form.js';
 export * from './types.js';
-export * from './Phone.js';
+export { PhoneField } from '@wix/form-public';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/headless-forms",
-  "version": "0.0.16",
+  "version": "0.0.17",
   "license": "MIT",
   "type": "module",
   "scripts": {
@@ -42,11 +42,12 @@
     "vitest": "^3.1.4"
   },
   "dependencies": {
-    "@wix/form-public": "^0.55.0",
+    "@wix/form-public": "^0.64.0",
     "@wix/forms": "^1.0.331",
     "@wix/headless-utils": "0.0.7",
     "@wix/services-definitions": "^0.1.4",
-    "@wix/services-manager-react": "^0.1.26"
+    "@wix/services-manager-react": "^0.1.26",
+    "react-aria-components": "^1.13.0"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
@@ -58,5 +59,5 @@
       "groupId": "com.wixpress.headless-components"
     }
   },
-  "falconPackageHash": "8cb5d395518afd8d76e474d88a52dc1b8fcac24810e523dd18de3672"
+  "falconPackageHash": "32d2f15a3874199a26e6700b141253e4f332c4fb8dafbc4bcbc1fcbf"
 }

package/cjs/dist/react/Phone.d.ts

@@ -1,47 +0,0 @@
-import React from 'react';
-export interface PhoneFieldProps {
-    id: string;
-    children: React.ReactNode;
-    asChild?: boolean;
-    className?: string;
-}
-export interface PhoneLabelProps {
-    children: React.ReactNode;
-    asChild?: boolean;
-    className?: string;
-}
-export interface PhoneLabelRequiredProps {
-    required?: boolean;
-    children?: React.ReactNode;
-    asChild?: boolean;
-    className?: string;
-}
-export declare const Required: React.ForwardRefExoticComponent<PhoneLabelRequiredProps & React.RefAttributes<HTMLSpanElement>>;
-interface PhoneLabelComponent extends React.ForwardRefExoticComponent<PhoneLabelProps & React.RefAttributes<HTMLDivElement>> {
-    Required: typeof Required;
-}
-export declare const Label: PhoneLabelComponent;
-export interface PhoneErrorProps {
-    children?: React.ReactNode;
-    asChild?: boolean;
-    className?: string;
-}
-declare const Error: React.ForwardRefExoticComponent<PhoneErrorProps & React.RefAttributes<HTMLDivElement>>;
-export interface CountryCodeProps {
-    asChild?: boolean;
-    className?: string;
-}
-declare const CountryCode: React.ForwardRefExoticComponent<CountryCodeProps & React.RefAttributes<HTMLDivElement>>;
-export interface PhoneFieldInputProps {
-    asChild?: boolean;
-    className?: string;
-}
-declare const Input: React.ForwardRefExoticComponent<PhoneFieldInputProps & React.RefAttributes<HTMLDivElement>>;
-interface PhoneFieldComponent extends React.ForwardRefExoticComponent<PhoneFieldProps & React.RefAttributes<HTMLDivElement>> {
-    Label: typeof Label;
-    Error: typeof Error;
-    Input: typeof Input;
-    CountryCode: typeof CountryCode;
-}
-export declare const PhoneField: PhoneFieldComponent;
-export {};

package/cjs/dist/react/Phone.js

@@ -1,56 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PhoneField = exports.Label = exports.Required = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = __importDefault(require("react"));
-const react_2 = require("@wix/headless-forms/react");
-const form_public_1 = require("@wix/form-public");
-const Root = react_1.default.forwardRef((props, ref) => {
-    const { id, children, asChild, className } = props;
-    const { description } = (0, form_public_1.useFieldProps)();
-    return ((0, jsx_runtime_1.jsx)(react_2.Form.Field, { ref: ref, id: id, asChild: asChild, className: className, children: (0, jsx_runtime_1.jsx)(react_2.Form.Field.InputWrapper, { children: (0, jsx_runtime_1.jsx)(react_2.Form.Field.Input, { description: description, children: children }) }) }));
-});
-Root.displayName = 'PhoneField';
-const LabelRoot = react_1.default.forwardRef((props, ref) => {
-    const { asChild, className, children } = props;
-    const { id, label, showLabel } = (0, form_public_1.useFieldProps)();
-    if (!showLabel) {
-        return null;
-    }
-    return ((0, jsx_runtime_1.jsx)(react_2.Form.Field.Label, { ref: ref, asChild: asChild, className: className, children: (0, jsx_runtime_1.jsxs)("label", { htmlFor: id, children: [label, children] }) }));
-});
-LabelRoot.displayName = 'PhoneField.Label';
-exports.Required = react_1.default.forwardRef((props, ref) => {
-    const { required } = (0, form_public_1.useFieldProps)();
-    return (0, jsx_runtime_1.jsx)(react_2.Form.Field.Label.Required, { ...props, ref: ref, required: required });
-});
-exports.Required.displayName = 'PhoneField.Label.Required';
-exports.Label = LabelRoot;
-exports.Label.Required = exports.Required;
-const Error = react_1.default.forwardRef((props, ref) => {
-    const { children, ...rest } = props;
-    const { errorMessage } = (0, form_public_1.useFieldProps)();
-    return ((0, jsx_runtime_1.jsx)(react_2.Form.Field.Error, { ref: ref, ...rest, children: errorMessage }));
-});
-Error.displayName = 'PhoneField.Error';
-const CountryCode = react_1.default.forwardRef((props, ref) => {
-    const { asChild, className, ...rest } = props;
-    const { id, countryCodes, defaultCountryCode, readOnly, onChange, onBlur, onFocus, } = (0, form_public_1.useFieldProps)();
-    return ((0, jsx_runtime_1.jsx)(react_2.Form.Field.Input, { ref: ref, asChild: asChild, className: className, ...rest, children: (0, jsx_runtime_1.jsx)("select", { id: `${id}-country`, defaultValue: defaultCountryCode || '', disabled: readOnly, onChange: (e) => onChange?.(e.target.value), onBlur: () => onBlur?.(), onFocus: () => onFocus?.(), children: countryCodes?.map((code) => ((0, jsx_runtime_1.jsx)("option", { value: code, children: code }, code))) }) }));
-});
-CountryCode.displayName = 'PhoneField.CountryCode';
-const Input = react_1.default.forwardRef((props, ref) => {
-    const { asChild, className, ...rest } = props;
-    const { id, value, required, readOnly, placeholder, onChange, onBlur, onFocus, description, } = (0, form_public_1.useFieldProps)();
-    const descriptionId = description ? `${id}-description` : undefined;
-    return ((0, jsx_runtime_1.jsx)(react_2.Form.Field.Input, { ref: ref, asChild: asChild, className: className, ...rest, children: (0, jsx_runtime_1.jsx)("input", { id: id, type: "tel", value: value || '', required: required, readOnly: readOnly, placeholder: placeholder, "aria-describedby": descriptionId, "aria-invalid": !!(required && !value), "aria-required": required, onChange: (e) => onChange?.(e.target.value), onBlur: () => onBlur?.(), onFocus: () => onFocus?.() }) }));
-});
-Input.displayName = 'PhoneField.Input';
-exports.PhoneField = Root;
-exports.PhoneField.Label = exports.Label;
-exports.PhoneField.Error = Error;
-exports.PhoneField.Input = Input;
-exports.PhoneField.CountryCode = CountryCode;

package/dist/react/Phone.d.ts

@@ -1,47 +0,0 @@
-import React from 'react';
-export interface PhoneFieldProps {
-    id: string;
-    children: React.ReactNode;
-    asChild?: boolean;
-    className?: string;
-}
-export interface PhoneLabelProps {
-    children: React.ReactNode;
-    asChild?: boolean;
-    className?: string;
-}
-export interface PhoneLabelRequiredProps {
-    required?: boolean;
-    children?: React.ReactNode;
-    asChild?: boolean;
-    className?: string;
-}
-export declare const Required: React.ForwardRefExoticComponent<PhoneLabelRequiredProps & React.RefAttributes<HTMLSpanElement>>;
-interface PhoneLabelComponent extends React.ForwardRefExoticComponent<PhoneLabelProps & React.RefAttributes<HTMLDivElement>> {
-    Required: typeof Required;
-}
-export declare const Label: PhoneLabelComponent;
-export interface PhoneErrorProps {
-    children?: React.ReactNode;
-    asChild?: boolean;
-    className?: string;
-}
-declare const Error: React.ForwardRefExoticComponent<PhoneErrorProps & React.RefAttributes<HTMLDivElement>>;
-export interface CountryCodeProps {
-    asChild?: boolean;
-    className?: string;
-}
-declare const CountryCode: React.ForwardRefExoticComponent<CountryCodeProps & React.RefAttributes<HTMLDivElement>>;
-export interface PhoneFieldInputProps {
-    asChild?: boolean;
-    className?: string;
-}
-declare const Input: React.ForwardRefExoticComponent<PhoneFieldInputProps & React.RefAttributes<HTMLDivElement>>;
-interface PhoneFieldComponent extends React.ForwardRefExoticComponent<PhoneFieldProps & React.RefAttributes<HTMLDivElement>> {
-    Label: typeof Label;
-    Error: typeof Error;
-    Input: typeof Input;
-    CountryCode: typeof CountryCode;
-}
-export declare const PhoneField: PhoneFieldComponent;
-export {};

package/dist/react/Phone.js

@@ -1,50 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import { Form } from '@wix/headless-forms/react';
-import { useFieldProps } from '@wix/form-public';
-const Root = React.forwardRef((props, ref) => {
-    const { id, children, asChild, className } = props;
-    const { description } = useFieldProps();
-    return (_jsx(Form.Field, { ref: ref, id: id, asChild: asChild, className: className, children: _jsx(Form.Field.InputWrapper, { children: _jsx(Form.Field.Input, { description: description, children: children }) }) }));
-});
-Root.displayName = 'PhoneField';
-const LabelRoot = React.forwardRef((props, ref) => {
-    const { asChild, className, children } = props;
-    const { id, label, showLabel } = useFieldProps();
-    if (!showLabel) {
-        return null;
-    }
-    return (_jsx(Form.Field.Label, { ref: ref, asChild: asChild, className: className, children: _jsxs("label", { htmlFor: id, children: [label, children] }) }));
-});
-LabelRoot.displayName = 'PhoneField.Label';
-export const Required = React.forwardRef((props, ref) => {
-    const { required } = useFieldProps();
-    return _jsx(Form.Field.Label.Required, { ...props, ref: ref, required: required });
-});
-Required.displayName = 'PhoneField.Label.Required';
-export const Label = LabelRoot;
-Label.Required = Required;
-const Error = React.forwardRef((props, ref) => {
-    const { children, ...rest } = props;
-    const { errorMessage } = useFieldProps();
-    return (_jsx(Form.Field.Error, { ref: ref, ...rest, children: errorMessage }));
-});
-Error.displayName = 'PhoneField.Error';
-const CountryCode = React.forwardRef((props, ref) => {
-    const { asChild, className, ...rest } = props;
-    const { id, countryCodes, defaultCountryCode, readOnly, onChange, onBlur, onFocus, } = useFieldProps();
-    return (_jsx(Form.Field.Input, { ref: ref, asChild: asChild, className: className, ...rest, children: _jsx("select", { id: `${id}-country`, defaultValue: defaultCountryCode || '', disabled: readOnly, onChange: (e) => onChange?.(e.target.value), onBlur: () => onBlur?.(), onFocus: () => onFocus?.(), children: countryCodes?.map((code) => (_jsx("option", { value: code, children: code }, code))) }) }));
-});
-CountryCode.displayName = 'PhoneField.CountryCode';
-const Input = React.forwardRef((props, ref) => {
-    const { asChild, className, ...rest } = props;
-    const { id, value, required, readOnly, placeholder, onChange, onBlur, onFocus, description, } = useFieldProps();
-    const descriptionId = description ? `${id}-description` : undefined;
-    return (_jsx(Form.Field.Input, { ref: ref, asChild: asChild, className: className, ...rest, children: _jsx("input", { id: id, type: "tel", value: value || '', required: required, readOnly: readOnly, placeholder: placeholder, "aria-describedby": descriptionId, "aria-invalid": !!(required && !value), "aria-required": required, onChange: (e) => onChange?.(e.target.value), onBlur: () => onBlur?.(), onFocus: () => onFocus?.() }) }));
-});
-Input.displayName = 'PhoneField.Input';
-export const PhoneField = Root;
-PhoneField.Label = Label;
-PhoneField.Error = Error;
-PhoneField.Input = Input;
-PhoneField.CountryCode = CountryCode;