@mirohq/design-system-form 0.2.30 → 1.0.0-pdl-removing-ffs.0

package/dist/main.js

@@ -8,7 +8,6 @@ var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var designSystemBaseForm = require('@mirohq/design-system-base-form');
 var designSystemUtils = require('@mirohq/design-system-utils');
-var designSystemExperiments = require('@mirohq/design-system-experiments');
 var designSystemIcons = require('@mirohq/design-system-icons');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -23,14 +22,9 @@ const StyledForm = designSystemStitches.styled(designSystemPrimitive.Primitive.f
 const StyledLabel = designSystemStitches.styled(designSystemPrimitive.Primitive.label, {
   fontSize: "$200",
   lineHeight: 1.5,
-  marginBottom: "$100",
+  marginBottom: "$50",
   display: "block",
   variants: {
-    v1: {
-      true: {
-        marginBottom: "$50"
-      }
-    },
     visuallyHidden: {
       true: {
         // todo MDS-1003: replace with shared styles
@@ -50,56 +44,38 @@ const StyledAsterisk = designSystemStitches.styled(designSystemPrimitive.Primiti
   color: "$text-danger"
 });
 
-const Label = React__default["default"].forwardRef(
-  ({
-    floating: floatingProp = true,
-    visuallyHidden = false,
-    children,
-    ...restProps
-  }, forwardRef) => {
-    const {
-      setLabel,
-      setIsFloatingLabel,
-      setIsHiddenLabel,
-      formElementId,
-      required = false,
-      v1
-    } = designSystemBaseForm.useFormFieldContext();
-    const floating = v1 ? false : floatingProp;
-    const label = React.useMemo(
-      () => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        children,
-        required && /* @__PURE__ */ jsxRuntime.jsx(StyledAsterisk, { children: "*" })
-      ] }),
-      [children, required]
-    );
-    React.useEffect(() => {
-      setLabel(label);
-    }, [setLabel, label]);
-    React.useEffect(
-      () => setIsFloatingLabel(floating),
-      [setIsFloatingLabel, floating]
-    );
-    React.useEffect(
-      () => setIsHiddenLabel(visuallyHidden),
-      [setIsHiddenLabel, visuallyHidden]
-    );
-    if (floating && !v1) {
-      return null;
+const Label = React__default["default"].forwardRef(({ visuallyHidden = false, children, ...restProps }, forwardRef) => {
+  const {
+    setLabel,
+    setIsHiddenLabel,
+    formElementId,
+    required = false
+  } = designSystemBaseForm.useFormFieldContext();
+  const label = React.useMemo(
+    () => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      children,
+      required && /* @__PURE__ */ jsxRuntime.jsx(StyledAsterisk, { children: "*" })
+    ] }),
+    [children, required]
+  );
+  React.useEffect(() => {
+    setLabel(label);
+  }, [setLabel, label]);
+  React.useEffect(
+    () => setIsHiddenLabel(visuallyHidden),
+    [setIsHiddenLabel, visuallyHidden]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    StyledLabel,
+    {
+      htmlFor: formElementId,
+      ...restProps,
+      ref: forwardRef,
+      visuallyHidden,
+      children: label
     }
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      StyledLabel,
-      {
-        htmlFor: formElementId,
-        ...restProps,
-        ref: forwardRef,
-        visuallyHidden,
-        v1,
-        children: label
-      }
-    );
-  }
-);
+  );
+});
 
 const StyledDescription = designSystemStitches.styled(designSystemPrimitive.Primitive.p, {
   fontSize: "$175",
@@ -215,10 +191,7 @@ const Root = React__default["default"].forwardRef(
     );
   }
 );
-const Field = React__default["default"].forwardRef(({ id, status, ...restProps }, forwardRef) => {
-  const [v1] = designSystemExperiments.useNewDesignLanguage();
-  return /* @__PURE__ */ jsxRuntime.jsx(designSystemBaseForm.FormFieldProvider, { status, id, v1, children: /* @__PURE__ */ jsxRuntime.jsx(Root, { status, ...restProps, ref: forwardRef }) });
-});
+const Field = React__default["default"].forwardRef(({ id, status, ...restProps }, forwardRef) => /* @__PURE__ */ jsxRuntime.jsx(designSystemBaseForm.FormFieldProvider, { status, id, children: /* @__PURE__ */ jsxRuntime.jsx(Root, { status, ...restProps, ref: forwardRef }) }));
 
 const Helper = React__default["default"].forwardRef((props, forwardRef) => {
   var _a;
@@ -230,7 +203,7 @@ const Helper = React__default["default"].forwardRef((props, forwardRef) => {
 
 const Message = React__default["default"].forwardRef(({ children, ...restProps }, forwardRef) => {
   var _a;
-  const { messageId, setMessageId, status, v1 } = designSystemBaseForm.useFormFieldContext();
+  const { messageId, setMessageId, status } = designSystemBaseForm.useFormFieldContext();
   const id = (_a = restProps.id) != null ? _a : messageId;
   React.useEffect(() => setMessageId(id), [setMessageId, id]);
   if (status !== designSystemBaseForm.FORM_FIELD_STATUS.invalid && status !== designSystemBaseForm.FORM_FIELD_STATUS.valid) {
@@ -245,8 +218,8 @@ const Message = React__default["default"].forwardRef(({ children, ...restProps }
       status,
       ref: forwardRef,
       children: [
-        v1 && status === "valid" && /* @__PURE__ */ jsxRuntime.jsx(designSystemIcons.IconCheckMark, { size: "small", weight: "thin", color: "icon-success" }),
-        v1 && status === "invalid" && /* @__PURE__ */ jsxRuntime.jsx(
+        status === "valid" && /* @__PURE__ */ jsxRuntime.jsx(designSystemIcons.IconCheckMark, { size: "small", weight: "thin", color: "icon-success" }),
+        status === "invalid" && /* @__PURE__ */ jsxRuntime.jsx(
           designSystemIcons.IconExclamationPointCircle,
           {
             size: "small",

package/dist/main.js.map

@@ -1 +1 @@
-{"version":3,"file":"main.js","sources":["../src/form.styled.tsx","../src/partials/label.styled.tsx","../src/partials/label.tsx","../src/partials/description.styled.tsx","../src/partials/helper.styled.tsx","../src/partials/message.styled.tsx","../src/partials/field.styled.tsx","../src/partials/field.tsx","../src/partials/helper.tsx","../src/partials/message.tsx","../src/partials/description.tsx","../src/form.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledForm = styled(Primitive.form, {\n  all: 'unset',\n  width: '100%',\n})\n\nexport type StyledFormProps = ComponentPropsWithRef<typeof StyledForm>\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledLabel = styled(Primitive.label, {\n  fontSize: '$200',\n  lineHeight: 1.5,\n  marginBottom: '$100',\n  display: 'block',\n\n  variants: {\n    v1: {\n      true: {\n        marginBottom: '$50',\n      },\n    },\n    visuallyHidden: {\n      true: {\n        // todo MDS-1003: replace with shared styles\n        border: '0',\n        clip: 'rect(0 0 0 0)',\n        height: '1px',\n        margin: '-1px',\n        overflow: 'hidden',\n        padding: '0',\n        position: 'absolute',\n        width: '1px',\n      },\n    },\n  },\n})\n\nexport const StyledAsterisk = styled(Primitive.span, {\n  color: '$text-danger',\n})\n\nexport type StyledLabelProps = ComponentPropsWithRef<typeof StyledLabel>\n","import React, { useMemo, useEffect } from 'react'\nimport type { ElementRef } from 'react'\nimport { useFormFieldContext } from '@mirohq/design-system-base-form'\n\nimport { StyledAsterisk, StyledLabel } from './label.styled'\nimport type { StyledLabelProps } from './label.styled'\n\nexport interface LabelProps extends Omit<StyledLabelProps, 'v1'> {\n  /**\n   * The content\n   */\n  children: React.ReactNode\n\n  /**\n   * Whether the label should float above the input\n   * @default true\n   * @deprecated will be removed with Design Language release\n   */\n  floating?: boolean\n\n  /**\n   * To hide the label visually and still keep it accessible for screen readers and other assistive technology\n   * @default false\n   */\n  visuallyHidden?: boolean\n}\n\nexport const Label = React.forwardRef<\n  ElementRef<typeof StyledLabel>,\n  LabelProps\n>(\n  (\n    {\n      floating: floatingProp = true,\n      visuallyHidden = false,\n      children,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    const {\n      setLabel,\n      setIsFloatingLabel,\n      setIsHiddenLabel,\n      formElementId,\n      required = false,\n      v1,\n    } = useFormFieldContext()\n\n    const floating = v1 ? false : floatingProp\n\n    const label = useMemo(\n      () => (\n        <>\n          {children}\n          {required && <StyledAsterisk>*</StyledAsterisk>}\n        </>\n      ),\n      [children, required]\n    )\n\n    useEffect(() => {\n      setLabel(label)\n    }, [setLabel, label])\n\n    useEffect(\n      () => setIsFloatingLabel(floating),\n      [setIsFloatingLabel, floating]\n    )\n    useEffect(\n      () => setIsHiddenLabel(visuallyHidden),\n      [setIsHiddenLabel, visuallyHidden]\n    )\n\n    // floating labels are managed in the form elements\n    if (floating && !v1) {\n      return null\n    }\n\n    return (\n      <StyledLabel\n        htmlFor={formElementId}\n        {...restProps}\n        ref={forwardRef}\n        visuallyHidden={visuallyHidden}\n        v1={v1}\n      >\n        {label}\n      </StyledLabel>\n    )\n  }\n)\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledDescription = styled(Primitive.p, {\n  fontSize: '$175',\n  lineHeight: 1.5,\n  margin: 0,\n  marginBottom: '$150',\n})\n\nexport type StyledDescriptionProps = ComponentPropsWithRef<\n  typeof StyledDescription\n>\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledHelper = styled(Primitive.div, {\n  fontSize: '$150',\n  lineHeight: 1.5,\n  marginTop: '$50',\n})\n\nexport type StyledHelperProps = ComponentPropsWithRef<typeof StyledHelper>\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledMessage = styled(Primitive.div, {\n  fontSize: '$150',\n  lineHeight: 1.5,\n  marginTop: '$50',\n  display: 'flex',\n  alignItems: 'center',\n  gap: '$50',\n  variants: {\n    status: {\n      valid: {\n        color: '$text-success',\n      },\n      invalid: {\n        color: '$text-danger',\n      },\n      dirty: {},\n      pristine: {},\n      touched: {},\n    },\n  },\n})\n\nexport type StyledMessageProps = ComponentPropsWithRef<typeof StyledMessage>\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nimport { StyledLabel } from './label.styled'\nimport { StyledDescription } from './description.styled'\nimport { StyledHelper } from './helper.styled'\nimport { StyledMessage } from './message.styled'\n\nexport const StyledField = styled(Primitive.div, {\n  marginBottom: '$300',\n  position: 'relative',\n  '&[data-disabled]': {\n    [`${StyledLabel}, ${StyledDescription}, ${StyledHelper}, ${StyledMessage}`]:\n      {\n        color: '$text-neutrals-disabled',\n        svg: {\n          color: '$icon-neutrals-disabled',\n        },\n      },\n  },\n  '&[data-readonly]': {\n    [`${StyledLabel}, ${StyledDescription}, ${StyledHelper}, ${StyledMessage}`]:\n      {\n        color: '$text-neutrals-subtle',\n        svg: {\n          color: '$icon-neutrals-disabled',\n        },\n      },\n  },\n})\n\nexport type StyledFieldProps = ComponentPropsWithRef<typeof StyledField>\n","import React, { useEffect, useRef } from 'react'\nimport type { ElementRef } from 'react'\nimport { booleanishAttrValue } from '@mirohq/design-system-utils'\nimport {\n  useFormFieldContext,\n  FormFieldProvider,\n  FORM_FIELD_STATUS,\n} from '@mirohq/design-system-base-form'\nimport type { FormFieldProviderProps } from '@mirohq/design-system-base-form'\nimport { useNewDesignLanguage } from '@mirohq/design-system-experiments'\n\nimport type { StyledFieldProps } from './field.styled'\nimport { StyledField } from './field.styled'\n\nexport interface FieldProps\n  extends Omit<StyledFieldProps, 'v1'>,\n    Omit<FormFieldProviderProps, 'v1'> {}\n\nconst Root = React.forwardRef<ElementRef<typeof StyledField>, FieldProps>(\n  ({ onFocus, onBlur, status: statusProps, ...restProps }, forwardRef) => {\n    const {\n      id,\n      status: formFieldStatus,\n      setStatus,\n      required,\n      focused,\n      setFocused,\n      disabled,\n      ariaDisabled,\n      readOnly,\n      formElementRef,\n    } = useFormFieldContext()\n\n    const status = statusProps ?? formFieldStatus\n    const initialValueRef = useRef<string>()\n\n    if (\n      formElementRef.current?.value !== undefined &&\n      initialValueRef.current === undefined\n    ) {\n      initialValueRef.current = formElementRef.current.value\n    }\n\n    useEffect(() => {\n      if (statusProps !== undefined) {\n        setStatus(statusProps)\n      }\n    }, [statusProps, setStatus])\n\n    return (\n      <StyledField\n        data-status={status}\n        data-required={booleanishAttrValue(required)}\n        data-focused={booleanishAttrValue(focused)}\n        data-disabled={booleanishAttrValue(\n          disabled === true || ariaDisabled === true\n        )}\n        data-readonly={booleanishAttrValue(readOnly)}\n        onFocus={e => {\n          setFocused(true)\n          onFocus?.(e)\n        }}\n        onBlur={e => {\n          if (statusProps === undefined) {\n            setStatus(\n              initialValueRef.current !== formElementRef.current?.value\n                ? FORM_FIELD_STATUS.dirty\n                : FORM_FIELD_STATUS.touched\n            )\n          } else {\n            setStatus(statusProps)\n          }\n\n          setFocused(false)\n          onBlur?.(e)\n        }}\n        {...restProps}\n        id={id}\n        ref={forwardRef}\n      />\n    )\n  }\n)\n\nexport const Field = React.forwardRef<\n  ElementRef<typeof StyledField>,\n  FieldProps\n>(({ id, status, ...restProps }, forwardRef) => {\n  const [v1] = useNewDesignLanguage()\n\n  return (\n    <FormFieldProvider status={status} id={id} v1={v1}>\n      {/* explicit use status as props because the provider will add a default */}\n      <Root status={status} {...restProps} ref={forwardRef} />\n    </FormFieldProvider>\n  )\n})\n","import React, { useEffect } from 'react'\nimport type { ElementRef } from 'react'\nimport { useFormFieldContext } from '@mirohq/design-system-base-form'\n\nimport type { StyledHelperProps } from './helper.styled'\nimport { StyledHelper } from './helper.styled'\n\nexport interface HelperProps extends StyledHelperProps {\n  /**\n   * The content\n   */\n  children: React.ReactNode\n}\n\nexport const Helper = React.forwardRef<\n  ElementRef<typeof StyledHelper>,\n  HelperProps\n>((props, forwardRef) => {\n  const { helperId, setHelperId } = useFormFieldContext()\n\n  const id = props.id ?? helperId\n  useEffect(() => setHelperId(id), [setHelperId, id])\n\n  return <StyledHelper {...props} id={id} ref={forwardRef} />\n})\n","import React, { useEffect } from 'react'\nimport type { ElementRef } from 'react'\nimport {\n  useFormFieldContext,\n  FORM_FIELD_STATUS,\n} from '@mirohq/design-system-base-form'\nimport {\n  IconExclamationPointCircle,\n  IconCheckMark,\n} from '@mirohq/design-system-icons'\n\nimport type { StyledMessageProps } from './message.styled'\nimport { StyledMessage } from './message.styled'\n\nexport interface MessageProps extends Omit<StyledMessageProps, 'status'> {\n  chidren?: React.ReactNode\n}\n\nexport const Message = React.forwardRef<\n  ElementRef<typeof StyledMessage>,\n  MessageProps\n>(({ children, ...restProps }, forwardRef) => {\n  const { messageId, setMessageId, status, v1 } = useFormFieldContext()\n\n  const id = restProps.id ?? messageId\n  useEffect(() => setMessageId(id), [setMessageId, id])\n\n  if (\n    status !== FORM_FIELD_STATUS.invalid &&\n    status !== FORM_FIELD_STATUS.valid\n  ) {\n    return null\n  }\n\n  return (\n    <StyledMessage\n      role='alert'\n      {...restProps}\n      id={id}\n      status={status}\n      ref={forwardRef}\n    >\n      {v1 && status === 'valid' && (\n        <IconCheckMark size='small' weight='thin' color='icon-success' />\n      )}\n      {v1 && status === 'invalid' && (\n        <IconExclamationPointCircle\n          size='small'\n          weight='thin'\n          color='icon-danger'\n        />\n      )}\n      {children}\n    </StyledMessage>\n  )\n})\n","import React, { useEffect } from 'react'\nimport type { ElementRef } from 'react'\nimport { useFormFieldContext } from '@mirohq/design-system-base-form'\n\nimport type { StyledDescriptionProps } from './description.styled'\nimport { StyledDescription } from './description.styled'\n\nexport interface DescriptionProps extends StyledDescriptionProps {\n  /**\n   * The content\n   */\n  children: React.ReactNode\n}\n\nexport const Description = React.forwardRef<\n  ElementRef<typeof StyledDescription>,\n  DescriptionProps\n>((props, forwardRef) => {\n  const { descriptionId, setDescriptionId } = useFormFieldContext()\n\n  const id = props.id ?? descriptionId\n  useEffect(() => setDescriptionId(id), [setDescriptionId, id])\n\n  return <StyledDescription {...props} id={id} ref={forwardRef} />\n})\n","import type { ForwardRefExoticComponent } from 'react'\n\nimport { StyledForm } from './form.styled'\nimport type { StyledFormProps } from './form.styled'\nimport { Label } from './partials/label'\nimport { Field } from './partials/field'\nimport { Helper } from './partials/helper'\nimport { Message } from './partials/message'\nimport { Description } from './partials/description'\n\nexport interface FormProps extends StyledFormProps {\n  /**\n   * The content\n   */\n  children: React.ReactNode\n}\n\nexport const Form = StyledForm as any as ForwardRefExoticComponent<FormProps> &\n  Partials\n\n// Partials\n// -----------------------------------------------------------------------------\n\nexport interface Partials {\n  Label: typeof Label\n  Field: typeof Field\n  Helper: typeof Helper\n  Message: typeof Message\n  Description: typeof Description\n}\n\nForm.Label = Label\nForm.Field = Field\nForm.Helper = Helper\nForm.Message = Message\nForm.Description = Description\n"],"names":["styled","Primitive","React","useFormFieldContext","useMemo","jsxs","Fragment","jsx","useEffect","useRef","booleanishAttrValue","_a","FORM_FIELD_STATUS","useNewDesignLanguage","FormFieldProvider","IconCheckMark","IconExclamationPointCircle"],"mappings":"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"}
+{"version":3,"file":"main.js","sources":["../src/form.styled.tsx","../src/partials/label.styled.tsx","../src/partials/label.tsx","../src/partials/description.styled.tsx","../src/partials/helper.styled.tsx","../src/partials/message.styled.tsx","../src/partials/field.styled.tsx","../src/partials/field.tsx","../src/partials/helper.tsx","../src/partials/message.tsx","../src/partials/description.tsx","../src/form.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledForm = styled(Primitive.form, {\n  all: 'unset',\n  width: '100%',\n})\n\nexport type StyledFormProps = ComponentPropsWithRef<typeof StyledForm>\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledLabel = styled(Primitive.label, {\n  fontSize: '$200',\n  lineHeight: 1.5,\n  marginBottom: '$50',\n  display: 'block',\n\n  variants: {\n    visuallyHidden: {\n      true: {\n        // todo MDS-1003: replace with shared styles\n        border: '0',\n        clip: 'rect(0 0 0 0)',\n        height: '1px',\n        margin: '-1px',\n        overflow: 'hidden',\n        padding: '0',\n        position: 'absolute',\n        width: '1px',\n      },\n    },\n  },\n})\n\nexport const StyledAsterisk = styled(Primitive.span, {\n  color: '$text-danger',\n})\n\nexport type StyledLabelProps = ComponentPropsWithRef<typeof StyledLabel>\n","import React, { useMemo, useEffect } from 'react'\nimport type { ElementRef } from 'react'\nimport { useFormFieldContext } from '@mirohq/design-system-base-form'\n\nimport { StyledAsterisk, StyledLabel } from './label.styled'\nimport type { StyledLabelProps } from './label.styled'\n\nexport interface LabelProps extends StyledLabelProps {\n  /**\n   * The content\n   */\n  children: React.ReactNode\n\n  /**\n   * Whether the label should float above the input\n   * @default true\n   * @deprecated will be removed with Design Language release\n   */\n\n  /**\n   * To hide the label visually and still keep it accessible for screen readers and other assistive technology\n   * @default false\n   */\n  visuallyHidden?: boolean\n}\n\nexport const Label = React.forwardRef<\n  ElementRef<typeof StyledLabel>,\n  LabelProps\n>(({ visuallyHidden = false, children, ...restProps }, forwardRef) => {\n  const {\n    setLabel,\n    setIsHiddenLabel,\n    formElementId,\n    required = false,\n  } = useFormFieldContext()\n\n  const label = useMemo(\n    () => (\n      <>\n        {children}\n        {required && <StyledAsterisk>*</StyledAsterisk>}\n      </>\n    ),\n    [children, required]\n  )\n\n  useEffect(() => {\n    setLabel(label)\n  }, [setLabel, label])\n\n  useEffect(\n    () => setIsHiddenLabel(visuallyHidden),\n    [setIsHiddenLabel, visuallyHidden]\n  )\n\n  return (\n    <StyledLabel\n      htmlFor={formElementId}\n      {...restProps}\n      ref={forwardRef}\n      visuallyHidden={visuallyHidden}\n    >\n      {label}\n    </StyledLabel>\n  )\n})\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledDescription = styled(Primitive.p, {\n  fontSize: '$175',\n  lineHeight: 1.5,\n  margin: 0,\n  marginBottom: '$150',\n})\n\nexport type StyledDescriptionProps = ComponentPropsWithRef<\n  typeof StyledDescription\n>\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledHelper = styled(Primitive.div, {\n  fontSize: '$150',\n  lineHeight: 1.5,\n  marginTop: '$50',\n})\n\nexport type StyledHelperProps = ComponentPropsWithRef<typeof StyledHelper>\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledMessage = styled(Primitive.div, {\n  fontSize: '$150',\n  lineHeight: 1.5,\n  marginTop: '$50',\n  display: 'flex',\n  alignItems: 'center',\n  gap: '$50',\n  variants: {\n    status: {\n      valid: {\n        color: '$text-success',\n      },\n      invalid: {\n        color: '$text-danger',\n      },\n      dirty: {},\n      pristine: {},\n      touched: {},\n    },\n  },\n})\n\nexport type StyledMessageProps = ComponentPropsWithRef<typeof StyledMessage>\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nimport { StyledLabel } from './label.styled'\nimport { StyledDescription } from './description.styled'\nimport { StyledHelper } from './helper.styled'\nimport { StyledMessage } from './message.styled'\n\nexport const StyledField = styled(Primitive.div, {\n  marginBottom: '$300',\n  position: 'relative',\n  '&[data-disabled]': {\n    [`${StyledLabel}, ${StyledDescription}, ${StyledHelper}, ${StyledMessage}`]:\n      {\n        color: '$text-neutrals-disabled',\n        svg: {\n          color: '$icon-neutrals-disabled',\n        },\n      },\n  },\n  '&[data-readonly]': {\n    [`${StyledLabel}, ${StyledDescription}, ${StyledHelper}, ${StyledMessage}`]:\n      {\n        color: '$text-neutrals-subtle',\n        svg: {\n          color: '$icon-neutrals-disabled',\n        },\n      },\n  },\n})\n\nexport type StyledFieldProps = ComponentPropsWithRef<typeof StyledField>\n","import React, { useEffect, useRef } from 'react'\nimport type { ElementRef } from 'react'\nimport { booleanishAttrValue } from '@mirohq/design-system-utils'\nimport {\n  useFormFieldContext,\n  FormFieldProvider,\n  FORM_FIELD_STATUS,\n} from '@mirohq/design-system-base-form'\nimport type { FormFieldProviderProps } from '@mirohq/design-system-base-form'\n\nimport type { StyledFieldProps } from './field.styled'\nimport { StyledField } from './field.styled'\n\nexport interface FieldProps extends StyledFieldProps, FormFieldProviderProps {}\n\nconst Root = React.forwardRef<ElementRef<typeof StyledField>, FieldProps>(\n  ({ onFocus, onBlur, status: statusProps, ...restProps }, forwardRef) => {\n    const {\n      id,\n      status: formFieldStatus,\n      setStatus,\n      required,\n      focused,\n      setFocused,\n      disabled,\n      ariaDisabled,\n      readOnly,\n      formElementRef,\n    } = useFormFieldContext()\n\n    const status = statusProps ?? formFieldStatus\n    const initialValueRef = useRef<string>()\n\n    if (\n      formElementRef.current?.value !== undefined &&\n      initialValueRef.current === undefined\n    ) {\n      initialValueRef.current = formElementRef.current.value\n    }\n\n    useEffect(() => {\n      if (statusProps !== undefined) {\n        setStatus(statusProps)\n      }\n    }, [statusProps, setStatus])\n\n    return (\n      <StyledField\n        data-status={status}\n        data-required={booleanishAttrValue(required)}\n        data-focused={booleanishAttrValue(focused)}\n        data-disabled={booleanishAttrValue(\n          disabled === true || ariaDisabled === true\n        )}\n        data-readonly={booleanishAttrValue(readOnly)}\n        onFocus={e => {\n          setFocused(true)\n          onFocus?.(e)\n        }}\n        onBlur={e => {\n          if (statusProps === undefined) {\n            setStatus(\n              initialValueRef.current !== formElementRef.current?.value\n                ? FORM_FIELD_STATUS.dirty\n                : FORM_FIELD_STATUS.touched\n            )\n          } else {\n            setStatus(statusProps)\n          }\n\n          setFocused(false)\n          onBlur?.(e)\n        }}\n        {...restProps}\n        id={id}\n        ref={forwardRef}\n      />\n    )\n  }\n)\n\nexport const Field = React.forwardRef<\n  ElementRef<typeof StyledField>,\n  FieldProps\n>(({ id, status, ...restProps }, forwardRef) => (\n  <FormFieldProvider status={status} id={id}>\n    {/* explicit use status as props because the provider will add a default */}\n    <Root status={status} {...restProps} ref={forwardRef} />\n  </FormFieldProvider>\n))\n","import React, { useEffect } from 'react'\nimport type { ElementRef } from 'react'\nimport { useFormFieldContext } from '@mirohq/design-system-base-form'\n\nimport type { StyledHelperProps } from './helper.styled'\nimport { StyledHelper } from './helper.styled'\n\nexport interface HelperProps extends StyledHelperProps {\n  /**\n   * The content\n   */\n  children: React.ReactNode\n}\n\nexport const Helper = React.forwardRef<\n  ElementRef<typeof StyledHelper>,\n  HelperProps\n>((props, forwardRef) => {\n  const { helperId, setHelperId } = useFormFieldContext()\n\n  const id = props.id ?? helperId\n  useEffect(() => setHelperId(id), [setHelperId, id])\n\n  return <StyledHelper {...props} id={id} ref={forwardRef} />\n})\n","import React, { useEffect } from 'react'\nimport type { ElementRef } from 'react'\nimport {\n  useFormFieldContext,\n  FORM_FIELD_STATUS,\n} from '@mirohq/design-system-base-form'\nimport {\n  IconExclamationPointCircle,\n  IconCheckMark,\n} from '@mirohq/design-system-icons'\n\nimport type { StyledMessageProps } from './message.styled'\nimport { StyledMessage } from './message.styled'\n\nexport interface MessageProps extends Omit<StyledMessageProps, 'status'> {\n  chidren?: React.ReactNode\n}\n\nexport const Message = React.forwardRef<\n  ElementRef<typeof StyledMessage>,\n  MessageProps\n>(({ children, ...restProps }, forwardRef) => {\n  const { messageId, setMessageId, status } = useFormFieldContext()\n\n  const id = restProps.id ?? messageId\n  useEffect(() => setMessageId(id), [setMessageId, id])\n\n  if (\n    status !== FORM_FIELD_STATUS.invalid &&\n    status !== FORM_FIELD_STATUS.valid\n  ) {\n    return null\n  }\n\n  return (\n    <StyledMessage\n      role='alert'\n      {...restProps}\n      id={id}\n      status={status}\n      ref={forwardRef}\n    >\n      {status === 'valid' && (\n        <IconCheckMark size='small' weight='thin' color='icon-success' />\n      )}\n      {status === 'invalid' && (\n        <IconExclamationPointCircle\n          size='small'\n          weight='thin'\n          color='icon-danger'\n        />\n      )}\n      {children}\n    </StyledMessage>\n  )\n})\n","import React, { useEffect } from 'react'\nimport type { ElementRef } from 'react'\nimport { useFormFieldContext } from '@mirohq/design-system-base-form'\n\nimport type { StyledDescriptionProps } from './description.styled'\nimport { StyledDescription } from './description.styled'\n\nexport interface DescriptionProps extends StyledDescriptionProps {\n  /**\n   * The content\n   */\n  children: React.ReactNode\n}\n\nexport const Description = React.forwardRef<\n  ElementRef<typeof StyledDescription>,\n  DescriptionProps\n>((props, forwardRef) => {\n  const { descriptionId, setDescriptionId } = useFormFieldContext()\n\n  const id = props.id ?? descriptionId\n  useEffect(() => setDescriptionId(id), [setDescriptionId, id])\n\n  return <StyledDescription {...props} id={id} ref={forwardRef} />\n})\n","import type { ForwardRefExoticComponent } from 'react'\n\nimport { StyledForm } from './form.styled'\nimport type { StyledFormProps } from './form.styled'\nimport { Label } from './partials/label'\nimport { Field } from './partials/field'\nimport { Helper } from './partials/helper'\nimport { Message } from './partials/message'\nimport { Description } from './partials/description'\n\nexport interface FormProps extends StyledFormProps {\n  /**\n   * The content\n   */\n  children: React.ReactNode\n}\n\nexport const Form = StyledForm as any as ForwardRefExoticComponent<FormProps> &\n  Partials\n\n// Partials\n// -----------------------------------------------------------------------------\n\nexport interface Partials {\n  Label: typeof Label\n  Field: typeof Field\n  Helper: typeof Helper\n  Message: typeof Message\n  Description: typeof Description\n}\n\nForm.Label = Label\nForm.Field = Field\nForm.Helper = Helper\nForm.Message = Message\nForm.Description = Description\n"],"names":["styled","Primitive","React","useFormFieldContext","useMemo","jsxs","Fragment","jsx","useEffect","useRef","booleanishAttrValue","_a","FORM_FIELD_STATUS","FormFieldProvider","IconCheckMark","IconExclamationPointCircle"],"mappings":"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"}

package/dist/module.js

@@ -4,7 +4,6 @@ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import React, { useMemo, useEffect, useRef } from 'react';
 import { useFormFieldContext, FORM_FIELD_STATUS, FormFieldProvider } from '@mirohq/design-system-base-form';
 import { booleanishAttrValue } from '@mirohq/design-system-utils';
-import { useNewDesignLanguage } from '@mirohq/design-system-experiments';
 import { IconCheckMark, IconExclamationPointCircle } from '@mirohq/design-system-icons';
 
 const StyledForm = styled(Primitive.form, {
@@ -15,14 +14,9 @@ const StyledForm = styled(Primitive.form, {
 const StyledLabel = styled(Primitive.label, {
   fontSize: "$200",
   lineHeight: 1.5,
-  marginBottom: "$100",
+  marginBottom: "$50",
   display: "block",
   variants: {
-    v1: {
-      true: {
-        marginBottom: "$50"
-      }
-    },
     visuallyHidden: {
       true: {
         // todo MDS-1003: replace with shared styles
@@ -42,56 +36,38 @@ const StyledAsterisk = styled(Primitive.span, {
   color: "$text-danger"
 });
 
-const Label = React.forwardRef(
-  ({
-    floating: floatingProp = true,
-    visuallyHidden = false,
-    children,
-    ...restProps
-  }, forwardRef) => {
-    const {
-      setLabel,
-      setIsFloatingLabel,
-      setIsHiddenLabel,
-      formElementId,
-      required = false,
-      v1
-    } = useFormFieldContext();
-    const floating = v1 ? false : floatingProp;
-    const label = useMemo(
-      () => /* @__PURE__ */ jsxs(Fragment, { children: [
-        children,
-        required && /* @__PURE__ */ jsx(StyledAsterisk, { children: "*" })
-      ] }),
-      [children, required]
-    );
-    useEffect(() => {
-      setLabel(label);
-    }, [setLabel, label]);
-    useEffect(
-      () => setIsFloatingLabel(floating),
-      [setIsFloatingLabel, floating]
-    );
-    useEffect(
-      () => setIsHiddenLabel(visuallyHidden),
-      [setIsHiddenLabel, visuallyHidden]
-    );
-    if (floating && !v1) {
-      return null;
+const Label = React.forwardRef(({ visuallyHidden = false, children, ...restProps }, forwardRef) => {
+  const {
+    setLabel,
+    setIsHiddenLabel,
+    formElementId,
+    required = false
+  } = useFormFieldContext();
+  const label = useMemo(
+    () => /* @__PURE__ */ jsxs(Fragment, { children: [
+      children,
+      required && /* @__PURE__ */ jsx(StyledAsterisk, { children: "*" })
+    ] }),
+    [children, required]
+  );
+  useEffect(() => {
+    setLabel(label);
+  }, [setLabel, label]);
+  useEffect(
+    () => setIsHiddenLabel(visuallyHidden),
+    [setIsHiddenLabel, visuallyHidden]
+  );
+  return /* @__PURE__ */ jsx(
+    StyledLabel,
+    {
+      htmlFor: formElementId,
+      ...restProps,
+      ref: forwardRef,
+      visuallyHidden,
+      children: label
     }
-    return /* @__PURE__ */ jsx(
-      StyledLabel,
-      {
-        htmlFor: formElementId,
-        ...restProps,
-        ref: forwardRef,
-        visuallyHidden,
-        v1,
-        children: label
-      }
-    );
-  }
-);
+  );
+});
 
 const StyledDescription = styled(Primitive.p, {
   fontSize: "$175",
@@ -207,10 +183,7 @@ const Root = React.forwardRef(
     );
   }
 );
-const Field = React.forwardRef(({ id, status, ...restProps }, forwardRef) => {
-  const [v1] = useNewDesignLanguage();
-  return /* @__PURE__ */ jsx(FormFieldProvider, { status, id, v1, children: /* @__PURE__ */ jsx(Root, { status, ...restProps, ref: forwardRef }) });
-});
+const Field = React.forwardRef(({ id, status, ...restProps }, forwardRef) => /* @__PURE__ */ jsx(FormFieldProvider, { status, id, children: /* @__PURE__ */ jsx(Root, { status, ...restProps, ref: forwardRef }) }));
 
 const Helper = React.forwardRef((props, forwardRef) => {
   var _a;
@@ -222,7 +195,7 @@ const Helper = React.forwardRef((props, forwardRef) => {
 
 const Message = React.forwardRef(({ children, ...restProps }, forwardRef) => {
   var _a;
-  const { messageId, setMessageId, status, v1 } = useFormFieldContext();
+  const { messageId, setMessageId, status } = useFormFieldContext();
   const id = (_a = restProps.id) != null ? _a : messageId;
   useEffect(() => setMessageId(id), [setMessageId, id]);
   if (status !== FORM_FIELD_STATUS.invalid && status !== FORM_FIELD_STATUS.valid) {
@@ -237,8 +210,8 @@ const Message = React.forwardRef(({ children, ...restProps }, forwardRef) => {
       status,
       ref: forwardRef,
       children: [
-        v1 && status === "valid" && /* @__PURE__ */ jsx(IconCheckMark, { size: "small", weight: "thin", color: "icon-success" }),
-        v1 && status === "invalid" && /* @__PURE__ */ jsx(
+        status === "valid" && /* @__PURE__ */ jsx(IconCheckMark, { size: "small", weight: "thin", color: "icon-success" }),
+        status === "invalid" && /* @__PURE__ */ jsx(
           IconExclamationPointCircle,
           {
             size: "small",

package/dist/module.js.map

@@ -1 +1 @@
-{"version":3,"file":"module.js","sources":["../src/form.styled.tsx","../src/partials/label.styled.tsx","../src/partials/label.tsx","../src/partials/description.styled.tsx","../src/partials/helper.styled.tsx","../src/partials/message.styled.tsx","../src/partials/field.styled.tsx","../src/partials/field.tsx","../src/partials/helper.tsx","../src/partials/message.tsx","../src/partials/description.tsx","../src/form.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledForm = styled(Primitive.form, {\n  all: 'unset',\n  width: '100%',\n})\n\nexport type StyledFormProps = ComponentPropsWithRef<typeof StyledForm>\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledLabel = styled(Primitive.label, {\n  fontSize: '$200',\n  lineHeight: 1.5,\n  marginBottom: '$100',\n  display: 'block',\n\n  variants: {\n    v1: {\n      true: {\n        marginBottom: '$50',\n      },\n    },\n    visuallyHidden: {\n      true: {\n        // todo MDS-1003: replace with shared styles\n        border: '0',\n        clip: 'rect(0 0 0 0)',\n        height: '1px',\n        margin: '-1px',\n        overflow: 'hidden',\n        padding: '0',\n        position: 'absolute',\n        width: '1px',\n      },\n    },\n  },\n})\n\nexport const StyledAsterisk = styled(Primitive.span, {\n  color: '$text-danger',\n})\n\nexport type StyledLabelProps = ComponentPropsWithRef<typeof StyledLabel>\n","import React, { useMemo, useEffect } from 'react'\nimport type { ElementRef } from 'react'\nimport { useFormFieldContext } from '@mirohq/design-system-base-form'\n\nimport { StyledAsterisk, StyledLabel } from './label.styled'\nimport type { StyledLabelProps } from './label.styled'\n\nexport interface LabelProps extends Omit<StyledLabelProps, 'v1'> {\n  /**\n   * The content\n   */\n  children: React.ReactNode\n\n  /**\n   * Whether the label should float above the input\n   * @default true\n   * @deprecated will be removed with Design Language release\n   */\n  floating?: boolean\n\n  /**\n   * To hide the label visually and still keep it accessible for screen readers and other assistive technology\n   * @default false\n   */\n  visuallyHidden?: boolean\n}\n\nexport const Label = React.forwardRef<\n  ElementRef<typeof StyledLabel>,\n  LabelProps\n>(\n  (\n    {\n      floating: floatingProp = true,\n      visuallyHidden = false,\n      children,\n      ...restProps\n    },\n    forwardRef\n  ) => {\n    const {\n      setLabel,\n      setIsFloatingLabel,\n      setIsHiddenLabel,\n      formElementId,\n      required = false,\n      v1,\n    } = useFormFieldContext()\n\n    const floating = v1 ? false : floatingProp\n\n    const label = useMemo(\n      () => (\n        <>\n          {children}\n          {required && <StyledAsterisk>*</StyledAsterisk>}\n        </>\n      ),\n      [children, required]\n    )\n\n    useEffect(() => {\n      setLabel(label)\n    }, [setLabel, label])\n\n    useEffect(\n      () => setIsFloatingLabel(floating),\n      [setIsFloatingLabel, floating]\n    )\n    useEffect(\n      () => setIsHiddenLabel(visuallyHidden),\n      [setIsHiddenLabel, visuallyHidden]\n    )\n\n    // floating labels are managed in the form elements\n    if (floating && !v1) {\n      return null\n    }\n\n    return (\n      <StyledLabel\n        htmlFor={formElementId}\n        {...restProps}\n        ref={forwardRef}\n        visuallyHidden={visuallyHidden}\n        v1={v1}\n      >\n        {label}\n      </StyledLabel>\n    )\n  }\n)\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledDescription = styled(Primitive.p, {\n  fontSize: '$175',\n  lineHeight: 1.5,\n  margin: 0,\n  marginBottom: '$150',\n})\n\nexport type StyledDescriptionProps = ComponentPropsWithRef<\n  typeof StyledDescription\n>\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledHelper = styled(Primitive.div, {\n  fontSize: '$150',\n  lineHeight: 1.5,\n  marginTop: '$50',\n})\n\nexport type StyledHelperProps = ComponentPropsWithRef<typeof StyledHelper>\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledMessage = styled(Primitive.div, {\n  fontSize: '$150',\n  lineHeight: 1.5,\n  marginTop: '$50',\n  display: 'flex',\n  alignItems: 'center',\n  gap: '$50',\n  variants: {\n    status: {\n      valid: {\n        color: '$text-success',\n      },\n      invalid: {\n        color: '$text-danger',\n      },\n      dirty: {},\n      pristine: {},\n      touched: {},\n    },\n  },\n})\n\nexport type StyledMessageProps = ComponentPropsWithRef<typeof StyledMessage>\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nimport { StyledLabel } from './label.styled'\nimport { StyledDescription } from './description.styled'\nimport { StyledHelper } from './helper.styled'\nimport { StyledMessage } from './message.styled'\n\nexport const StyledField = styled(Primitive.div, {\n  marginBottom: '$300',\n  position: 'relative',\n  '&[data-disabled]': {\n    [`${StyledLabel}, ${StyledDescription}, ${StyledHelper}, ${StyledMessage}`]:\n      {\n        color: '$text-neutrals-disabled',\n        svg: {\n          color: '$icon-neutrals-disabled',\n        },\n      },\n  },\n  '&[data-readonly]': {\n    [`${StyledLabel}, ${StyledDescription}, ${StyledHelper}, ${StyledMessage}`]:\n      {\n        color: '$text-neutrals-subtle',\n        svg: {\n          color: '$icon-neutrals-disabled',\n        },\n      },\n  },\n})\n\nexport type StyledFieldProps = ComponentPropsWithRef<typeof StyledField>\n","import React, { useEffect, useRef } from 'react'\nimport type { ElementRef } from 'react'\nimport { booleanishAttrValue } from '@mirohq/design-system-utils'\nimport {\n  useFormFieldContext,\n  FormFieldProvider,\n  FORM_FIELD_STATUS,\n} from '@mirohq/design-system-base-form'\nimport type { FormFieldProviderProps } from '@mirohq/design-system-base-form'\nimport { useNewDesignLanguage } from '@mirohq/design-system-experiments'\n\nimport type { StyledFieldProps } from './field.styled'\nimport { StyledField } from './field.styled'\n\nexport interface FieldProps\n  extends Omit<StyledFieldProps, 'v1'>,\n    Omit<FormFieldProviderProps, 'v1'> {}\n\nconst Root = React.forwardRef<ElementRef<typeof StyledField>, FieldProps>(\n  ({ onFocus, onBlur, status: statusProps, ...restProps }, forwardRef) => {\n    const {\n      id,\n      status: formFieldStatus,\n      setStatus,\n      required,\n      focused,\n      setFocused,\n      disabled,\n      ariaDisabled,\n      readOnly,\n      formElementRef,\n    } = useFormFieldContext()\n\n    const status = statusProps ?? formFieldStatus\n    const initialValueRef = useRef<string>()\n\n    if (\n      formElementRef.current?.value !== undefined &&\n      initialValueRef.current === undefined\n    ) {\n      initialValueRef.current = formElementRef.current.value\n    }\n\n    useEffect(() => {\n      if (statusProps !== undefined) {\n        setStatus(statusProps)\n      }\n    }, [statusProps, setStatus])\n\n    return (\n      <StyledField\n        data-status={status}\n        data-required={booleanishAttrValue(required)}\n        data-focused={booleanishAttrValue(focused)}\n        data-disabled={booleanishAttrValue(\n          disabled === true || ariaDisabled === true\n        )}\n        data-readonly={booleanishAttrValue(readOnly)}\n        onFocus={e => {\n          setFocused(true)\n          onFocus?.(e)\n        }}\n        onBlur={e => {\n          if (statusProps === undefined) {\n            setStatus(\n              initialValueRef.current !== formElementRef.current?.value\n                ? FORM_FIELD_STATUS.dirty\n                : FORM_FIELD_STATUS.touched\n            )\n          } else {\n            setStatus(statusProps)\n          }\n\n          setFocused(false)\n          onBlur?.(e)\n        }}\n        {...restProps}\n        id={id}\n        ref={forwardRef}\n      />\n    )\n  }\n)\n\nexport const Field = React.forwardRef<\n  ElementRef<typeof StyledField>,\n  FieldProps\n>(({ id, status, ...restProps }, forwardRef) => {\n  const [v1] = useNewDesignLanguage()\n\n  return (\n    <FormFieldProvider status={status} id={id} v1={v1}>\n      {/* explicit use status as props because the provider will add a default */}\n      <Root status={status} {...restProps} ref={forwardRef} />\n    </FormFieldProvider>\n  )\n})\n","import React, { useEffect } from 'react'\nimport type { ElementRef } from 'react'\nimport { useFormFieldContext } from '@mirohq/design-system-base-form'\n\nimport type { StyledHelperProps } from './helper.styled'\nimport { StyledHelper } from './helper.styled'\n\nexport interface HelperProps extends StyledHelperProps {\n  /**\n   * The content\n   */\n  children: React.ReactNode\n}\n\nexport const Helper = React.forwardRef<\n  ElementRef<typeof StyledHelper>,\n  HelperProps\n>((props, forwardRef) => {\n  const { helperId, setHelperId } = useFormFieldContext()\n\n  const id = props.id ?? helperId\n  useEffect(() => setHelperId(id), [setHelperId, id])\n\n  return <StyledHelper {...props} id={id} ref={forwardRef} />\n})\n","import React, { useEffect } from 'react'\nimport type { ElementRef } from 'react'\nimport {\n  useFormFieldContext,\n  FORM_FIELD_STATUS,\n} from '@mirohq/design-system-base-form'\nimport {\n  IconExclamationPointCircle,\n  IconCheckMark,\n} from '@mirohq/design-system-icons'\n\nimport type { StyledMessageProps } from './message.styled'\nimport { StyledMessage } from './message.styled'\n\nexport interface MessageProps extends Omit<StyledMessageProps, 'status'> {\n  chidren?: React.ReactNode\n}\n\nexport const Message = React.forwardRef<\n  ElementRef<typeof StyledMessage>,\n  MessageProps\n>(({ children, ...restProps }, forwardRef) => {\n  const { messageId, setMessageId, status, v1 } = useFormFieldContext()\n\n  const id = restProps.id ?? messageId\n  useEffect(() => setMessageId(id), [setMessageId, id])\n\n  if (\n    status !== FORM_FIELD_STATUS.invalid &&\n    status !== FORM_FIELD_STATUS.valid\n  ) {\n    return null\n  }\n\n  return (\n    <StyledMessage\n      role='alert'\n      {...restProps}\n      id={id}\n      status={status}\n      ref={forwardRef}\n    >\n      {v1 && status === 'valid' && (\n        <IconCheckMark size='small' weight='thin' color='icon-success' />\n      )}\n      {v1 && status === 'invalid' && (\n        <IconExclamationPointCircle\n          size='small'\n          weight='thin'\n          color='icon-danger'\n        />\n      )}\n      {children}\n    </StyledMessage>\n  )\n})\n","import React, { useEffect } from 'react'\nimport type { ElementRef } from 'react'\nimport { useFormFieldContext } from '@mirohq/design-system-base-form'\n\nimport type { StyledDescriptionProps } from './description.styled'\nimport { StyledDescription } from './description.styled'\n\nexport interface DescriptionProps extends StyledDescriptionProps {\n  /**\n   * The content\n   */\n  children: React.ReactNode\n}\n\nexport const Description = React.forwardRef<\n  ElementRef<typeof StyledDescription>,\n  DescriptionProps\n>((props, forwardRef) => {\n  const { descriptionId, setDescriptionId } = useFormFieldContext()\n\n  const id = props.id ?? descriptionId\n  useEffect(() => setDescriptionId(id), [setDescriptionId, id])\n\n  return <StyledDescription {...props} id={id} ref={forwardRef} />\n})\n","import type { ForwardRefExoticComponent } from 'react'\n\nimport { StyledForm } from './form.styled'\nimport type { StyledFormProps } from './form.styled'\nimport { Label } from './partials/label'\nimport { Field } from './partials/field'\nimport { Helper } from './partials/helper'\nimport { Message } from './partials/message'\nimport { Description } from './partials/description'\n\nexport interface FormProps extends StyledFormProps {\n  /**\n   * The content\n   */\n  children: React.ReactNode\n}\n\nexport const Form = StyledForm as any as ForwardRefExoticComponent<FormProps> &\n  Partials\n\n// Partials\n// -----------------------------------------------------------------------------\n\nexport interface Partials {\n  Label: typeof Label\n  Field: typeof Field\n  Helper: typeof Helper\n  Message: typeof Message\n  Description: typeof Description\n}\n\nForm.Label = Label\nForm.Field = Field\nForm.Helper = Helper\nForm.Message = Message\nForm.Description = Description\n"],"names":["_a"],"mappings":"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"}
+{"version":3,"file":"module.js","sources":["../src/form.styled.tsx","../src/partials/label.styled.tsx","../src/partials/label.tsx","../src/partials/description.styled.tsx","../src/partials/helper.styled.tsx","../src/partials/message.styled.tsx","../src/partials/field.styled.tsx","../src/partials/field.tsx","../src/partials/helper.tsx","../src/partials/message.tsx","../src/partials/description.tsx","../src/form.tsx"],"sourcesContent":["import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledForm = styled(Primitive.form, {\n  all: 'unset',\n  width: '100%',\n})\n\nexport type StyledFormProps = ComponentPropsWithRef<typeof StyledForm>\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledLabel = styled(Primitive.label, {\n  fontSize: '$200',\n  lineHeight: 1.5,\n  marginBottom: '$50',\n  display: 'block',\n\n  variants: {\n    visuallyHidden: {\n      true: {\n        // todo MDS-1003: replace with shared styles\n        border: '0',\n        clip: 'rect(0 0 0 0)',\n        height: '1px',\n        margin: '-1px',\n        overflow: 'hidden',\n        padding: '0',\n        position: 'absolute',\n        width: '1px',\n      },\n    },\n  },\n})\n\nexport const StyledAsterisk = styled(Primitive.span, {\n  color: '$text-danger',\n})\n\nexport type StyledLabelProps = ComponentPropsWithRef<typeof StyledLabel>\n","import React, { useMemo, useEffect } from 'react'\nimport type { ElementRef } from 'react'\nimport { useFormFieldContext } from '@mirohq/design-system-base-form'\n\nimport { StyledAsterisk, StyledLabel } from './label.styled'\nimport type { StyledLabelProps } from './label.styled'\n\nexport interface LabelProps extends StyledLabelProps {\n  /**\n   * The content\n   */\n  children: React.ReactNode\n\n  /**\n   * Whether the label should float above the input\n   * @default true\n   * @deprecated will be removed with Design Language release\n   */\n\n  /**\n   * To hide the label visually and still keep it accessible for screen readers and other assistive technology\n   * @default false\n   */\n  visuallyHidden?: boolean\n}\n\nexport const Label = React.forwardRef<\n  ElementRef<typeof StyledLabel>,\n  LabelProps\n>(({ visuallyHidden = false, children, ...restProps }, forwardRef) => {\n  const {\n    setLabel,\n    setIsHiddenLabel,\n    formElementId,\n    required = false,\n  } = useFormFieldContext()\n\n  const label = useMemo(\n    () => (\n      <>\n        {children}\n        {required && <StyledAsterisk>*</StyledAsterisk>}\n      </>\n    ),\n    [children, required]\n  )\n\n  useEffect(() => {\n    setLabel(label)\n  }, [setLabel, label])\n\n  useEffect(\n    () => setIsHiddenLabel(visuallyHidden),\n    [setIsHiddenLabel, visuallyHidden]\n  )\n\n  return (\n    <StyledLabel\n      htmlFor={formElementId}\n      {...restProps}\n      ref={forwardRef}\n      visuallyHidden={visuallyHidden}\n    >\n      {label}\n    </StyledLabel>\n  )\n})\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledDescription = styled(Primitive.p, {\n  fontSize: '$175',\n  lineHeight: 1.5,\n  margin: 0,\n  marginBottom: '$150',\n})\n\nexport type StyledDescriptionProps = ComponentPropsWithRef<\n  typeof StyledDescription\n>\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledHelper = styled(Primitive.div, {\n  fontSize: '$150',\n  lineHeight: 1.5,\n  marginTop: '$50',\n})\n\nexport type StyledHelperProps = ComponentPropsWithRef<typeof StyledHelper>\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nexport const StyledMessage = styled(Primitive.div, {\n  fontSize: '$150',\n  lineHeight: 1.5,\n  marginTop: '$50',\n  display: 'flex',\n  alignItems: 'center',\n  gap: '$50',\n  variants: {\n    status: {\n      valid: {\n        color: '$text-success',\n      },\n      invalid: {\n        color: '$text-danger',\n      },\n      dirty: {},\n      pristine: {},\n      touched: {},\n    },\n  },\n})\n\nexport type StyledMessageProps = ComponentPropsWithRef<typeof StyledMessage>\n","import type { ComponentPropsWithRef } from 'react'\nimport { Primitive } from '@mirohq/design-system-primitive'\nimport { styled } from '@mirohq/design-system-stitches'\n\nimport { StyledLabel } from './label.styled'\nimport { StyledDescription } from './description.styled'\nimport { StyledHelper } from './helper.styled'\nimport { StyledMessage } from './message.styled'\n\nexport const StyledField = styled(Primitive.div, {\n  marginBottom: '$300',\n  position: 'relative',\n  '&[data-disabled]': {\n    [`${StyledLabel}, ${StyledDescription}, ${StyledHelper}, ${StyledMessage}`]:\n      {\n        color: '$text-neutrals-disabled',\n        svg: {\n          color: '$icon-neutrals-disabled',\n        },\n      },\n  },\n  '&[data-readonly]': {\n    [`${StyledLabel}, ${StyledDescription}, ${StyledHelper}, ${StyledMessage}`]:\n      {\n        color: '$text-neutrals-subtle',\n        svg: {\n          color: '$icon-neutrals-disabled',\n        },\n      },\n  },\n})\n\nexport type StyledFieldProps = ComponentPropsWithRef<typeof StyledField>\n","import React, { useEffect, useRef } from 'react'\nimport type { ElementRef } from 'react'\nimport { booleanishAttrValue } from '@mirohq/design-system-utils'\nimport {\n  useFormFieldContext,\n  FormFieldProvider,\n  FORM_FIELD_STATUS,\n} from '@mirohq/design-system-base-form'\nimport type { FormFieldProviderProps } from '@mirohq/design-system-base-form'\n\nimport type { StyledFieldProps } from './field.styled'\nimport { StyledField } from './field.styled'\n\nexport interface FieldProps extends StyledFieldProps, FormFieldProviderProps {}\n\nconst Root = React.forwardRef<ElementRef<typeof StyledField>, FieldProps>(\n  ({ onFocus, onBlur, status: statusProps, ...restProps }, forwardRef) => {\n    const {\n      id,\n      status: formFieldStatus,\n      setStatus,\n      required,\n      focused,\n      setFocused,\n      disabled,\n      ariaDisabled,\n      readOnly,\n      formElementRef,\n    } = useFormFieldContext()\n\n    const status = statusProps ?? formFieldStatus\n    const initialValueRef = useRef<string>()\n\n    if (\n      formElementRef.current?.value !== undefined &&\n      initialValueRef.current === undefined\n    ) {\n      initialValueRef.current = formElementRef.current.value\n    }\n\n    useEffect(() => {\n      if (statusProps !== undefined) {\n        setStatus(statusProps)\n      }\n    }, [statusProps, setStatus])\n\n    return (\n      <StyledField\n        data-status={status}\n        data-required={booleanishAttrValue(required)}\n        data-focused={booleanishAttrValue(focused)}\n        data-disabled={booleanishAttrValue(\n          disabled === true || ariaDisabled === true\n        )}\n        data-readonly={booleanishAttrValue(readOnly)}\n        onFocus={e => {\n          setFocused(true)\n          onFocus?.(e)\n        }}\n        onBlur={e => {\n          if (statusProps === undefined) {\n            setStatus(\n              initialValueRef.current !== formElementRef.current?.value\n                ? FORM_FIELD_STATUS.dirty\n                : FORM_FIELD_STATUS.touched\n            )\n          } else {\n            setStatus(statusProps)\n          }\n\n          setFocused(false)\n          onBlur?.(e)\n        }}\n        {...restProps}\n        id={id}\n        ref={forwardRef}\n      />\n    )\n  }\n)\n\nexport const Field = React.forwardRef<\n  ElementRef<typeof StyledField>,\n  FieldProps\n>(({ id, status, ...restProps }, forwardRef) => (\n  <FormFieldProvider status={status} id={id}>\n    {/* explicit use status as props because the provider will add a default */}\n    <Root status={status} {...restProps} ref={forwardRef} />\n  </FormFieldProvider>\n))\n","import React, { useEffect } from 'react'\nimport type { ElementRef } from 'react'\nimport { useFormFieldContext } from '@mirohq/design-system-base-form'\n\nimport type { StyledHelperProps } from './helper.styled'\nimport { StyledHelper } from './helper.styled'\n\nexport interface HelperProps extends StyledHelperProps {\n  /**\n   * The content\n   */\n  children: React.ReactNode\n}\n\nexport const Helper = React.forwardRef<\n  ElementRef<typeof StyledHelper>,\n  HelperProps\n>((props, forwardRef) => {\n  const { helperId, setHelperId } = useFormFieldContext()\n\n  const id = props.id ?? helperId\n  useEffect(() => setHelperId(id), [setHelperId, id])\n\n  return <StyledHelper {...props} id={id} ref={forwardRef} />\n})\n","import React, { useEffect } from 'react'\nimport type { ElementRef } from 'react'\nimport {\n  useFormFieldContext,\n  FORM_FIELD_STATUS,\n} from '@mirohq/design-system-base-form'\nimport {\n  IconExclamationPointCircle,\n  IconCheckMark,\n} from '@mirohq/design-system-icons'\n\nimport type { StyledMessageProps } from './message.styled'\nimport { StyledMessage } from './message.styled'\n\nexport interface MessageProps extends Omit<StyledMessageProps, 'status'> {\n  chidren?: React.ReactNode\n}\n\nexport const Message = React.forwardRef<\n  ElementRef<typeof StyledMessage>,\n  MessageProps\n>(({ children, ...restProps }, forwardRef) => {\n  const { messageId, setMessageId, status } = useFormFieldContext()\n\n  const id = restProps.id ?? messageId\n  useEffect(() => setMessageId(id), [setMessageId, id])\n\n  if (\n    status !== FORM_FIELD_STATUS.invalid &&\n    status !== FORM_FIELD_STATUS.valid\n  ) {\n    return null\n  }\n\n  return (\n    <StyledMessage\n      role='alert'\n      {...restProps}\n      id={id}\n      status={status}\n      ref={forwardRef}\n    >\n      {status === 'valid' && (\n        <IconCheckMark size='small' weight='thin' color='icon-success' />\n      )}\n      {status === 'invalid' && (\n        <IconExclamationPointCircle\n          size='small'\n          weight='thin'\n          color='icon-danger'\n        />\n      )}\n      {children}\n    </StyledMessage>\n  )\n})\n","import React, { useEffect } from 'react'\nimport type { ElementRef } from 'react'\nimport { useFormFieldContext } from '@mirohq/design-system-base-form'\n\nimport type { StyledDescriptionProps } from './description.styled'\nimport { StyledDescription } from './description.styled'\n\nexport interface DescriptionProps extends StyledDescriptionProps {\n  /**\n   * The content\n   */\n  children: React.ReactNode\n}\n\nexport const Description = React.forwardRef<\n  ElementRef<typeof StyledDescription>,\n  DescriptionProps\n>((props, forwardRef) => {\n  const { descriptionId, setDescriptionId } = useFormFieldContext()\n\n  const id = props.id ?? descriptionId\n  useEffect(() => setDescriptionId(id), [setDescriptionId, id])\n\n  return <StyledDescription {...props} id={id} ref={forwardRef} />\n})\n","import type { ForwardRefExoticComponent } from 'react'\n\nimport { StyledForm } from './form.styled'\nimport type { StyledFormProps } from './form.styled'\nimport { Label } from './partials/label'\nimport { Field } from './partials/field'\nimport { Helper } from './partials/helper'\nimport { Message } from './partials/message'\nimport { Description } from './partials/description'\n\nexport interface FormProps extends StyledFormProps {\n  /**\n   * The content\n   */\n  children: React.ReactNode\n}\n\nexport const Form = StyledForm as any as ForwardRefExoticComponent<FormProps> &\n  Partials\n\n// Partials\n// -----------------------------------------------------------------------------\n\nexport interface Partials {\n  Label: typeof Label\n  Field: typeof Field\n  Helper: typeof Helper\n  Message: typeof Message\n  Description: typeof Description\n}\n\nForm.Label = Label\nForm.Field = Field\nForm.Helper = Helper\nForm.Message = Message\nForm.Description = Description\n"],"names":["_a"],"mappings":"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"}

package/dist/types.d.ts

@@ -8,16 +8,14 @@ import { FormFieldProviderProps } from '@mirohq/design-system-base-form';
 declare const StyledForm: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"form">>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLFormElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"form">>, {}, {}>;
 type StyledFormProps = ComponentPropsWithRef<typeof StyledForm>;
 
-declare const StyledLabel: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"label">>>, "v1" | "visuallyHidden"> & _stitches_react_types_styled_component.TransformProps<{
-    v1?: boolean | "true" | undefined;
+declare const StyledLabel: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"label">>>, "visuallyHidden"> & _stitches_react_types_styled_component.TransformProps<{
     visuallyHidden?: boolean | "true" | undefined;
 }, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLLabelElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"label">>, {
-    v1?: boolean | "true" | undefined;
     visuallyHidden?: boolean | "true" | undefined;
 }, {}>;
 type StyledLabelProps = ComponentPropsWithRef<typeof StyledLabel>;
 
-interface LabelProps extends Omit<StyledLabelProps, 'v1'> {
+interface LabelProps extends StyledLabelProps {
     /**
      * The content
      */
@@ -27,7 +25,6 @@ interface LabelProps extends Omit<StyledLabelProps, 'v1'> {
      * @default true
      * @deprecated will be removed with Design Language release
      */
-    floating?: boolean;
     /**
      * To hide the label visually and still keep it accessible for screen readers and other assistive technology
      * @default false
@@ -39,7 +36,7 @@ declare const Label: react__default.ForwardRefExoticComponent<Omit<LabelProps, "
 declare const StyledField: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {}, {}>;
 type StyledFieldProps = ComponentPropsWithRef<typeof StyledField>;
 
-interface FieldProps extends Omit<StyledFieldProps, 'v1'>, Omit<FormFieldProviderProps, 'v1'> {
+interface FieldProps extends StyledFieldProps, FormFieldProviderProps {
 }
 declare const Field: react__default.ForwardRefExoticComponent<Omit<FieldProps, "ref"> & react__default.RefAttributes<HTMLDivElement>>;
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mirohq/design-system-form",
-  "version": "0.2.30",
+  "version": "1.0.0-pdl-removing-ffs.0",
   "description": "",
   "author": "Miro",
   "source": "src/index.ts",
@@ -26,12 +26,11 @@
     "react": "^16.14 || ^17 || ^18"
   },
   "dependencies": {
-    "@mirohq/design-system-base-form": "^0.3.14",
-    "@mirohq/design-system-experiments": "^0.4.0",
-    "@mirohq/design-system-stitches": "^2.6.40",
-    "@mirohq/design-system-utils": "^0.15.6",
-    "@mirohq/design-system-icons": "^0.74.3",
-    "@mirohq/design-system-primitive": "^1.1.2"
+    "@mirohq/design-system-base-form": "^1.0.0-pdl-removing-ffs.0",
+    "@mirohq/design-system-primitive": "^2.0.0-pdl-removing-ffs.0",
+    "@mirohq/design-system-icons": "^1.0.0-pdl-removing-ffs.0",
+    "@mirohq/design-system-utils": "^1.0.0-pdl-removing-ffs.0",
+    "@mirohq/design-system-stitches": "^3.0.0-pdl-removing-ffs.0"
   },
   "scripts": {
     "build": "rollup -c ../../../rollup.config.js",