@mirohq/design-system-base-input - npm Package Compare versions

Comparing version 0.0.3-forms.0 to 0.1.0-forms.1

dist/main.js

@@ -6,2 +6,4 @@ 'use strict';
 var designSystemUtils = require('@mirohq/design-system-utils');
+var designSystemStitches = require('@mirohq/design-system-stitches');
+var designSystemPrimitive = require('@mirohq/design-system-primitive');
 
@@ -92,4 +94,68 @@ const styles = {
 
+const FloatingLabel = designSystemStitches.styled(designSystemPrimitive.Primitive.label, {
+  transitionProperty: "transform, left, top, font-size",
+  transitionDuration: "200ms",
+  transitionTimingFunction: "cubic-bezier(0, 0, 0.2, 1)",
+  variants: {
+    floating: {
+      true: {
+        transform: "translate(2px, -8px)",
+        fontSize: "$150",
+        lineHeight: 1.5,
+        height: "1.5em",
+        color: "$text-neutrals-subtle",
+        padding: "0 2px",
+        backgroundColor: "$background-neutrals-container"
+      },
+      false: {
+        transform: "translate(0, 0)",
+        fontSize: "$200",
+        lineHeight: 1.5,
+        height: "1.5em",
+        ...styles.base.placeholder
+      }
+    },
+    size: {
+      large: {},
+      "x-large": {}
+    }
+  },
+  compoundVariants: [
+    {
+      size: "large",
+      floating: false,
+      css: {
+        top: "7px"
+      }
+    },
+    {
+      size: "x-large",
+      floating: false,
+      css: {
+        top: "11px",
+        left: "$200"
+      }
+    }
+  ],
+  defaultVariants: {
+    size: "large"
+  }
+});
+
+const inputSymbol = Symbol.for("input");
+const isInputComponent = (inputComponent) => {
+  var _a, _b;
+  return Boolean(
+    (_b = inputComponent[inputSymbol]) != null ? _b : (
+      // @ts-expect-error
+      (_a = inputComponent == null ? void 0 : inputComponent.type) == null ? void 0 : _a[inputSymbol]
+    )
+  );
+};
+
+exports.FloatingLabel = FloatingLabel;
+exports.inputSymbol = inputSymbol;
+exports.isInputComponent = isInputComponent;
 exports.styles = styles;
 exports.useAriaDisabled = useAriaDisabled;
 //# sourceMappingURL=main.js.map

dist/module.js

 import { booleanify, removeEventProps } from '@mirohq/design-system-utils';
+import { styled } from '@mirohq/design-system-stitches';
+import { Primitive } from '@mirohq/design-system-primitive';
 
@@ -87,3 +89,64 @@ const styles = {
 
-export { styles, useAriaDisabled };
+const FloatingLabel = styled(Primitive.label, {
+  transitionProperty: "transform, left, top, font-size",
+  transitionDuration: "200ms",
+  transitionTimingFunction: "cubic-bezier(0, 0, 0.2, 1)",
+  variants: {
+    floating: {
+      true: {
+        transform: "translate(2px, -8px)",
+        fontSize: "$150",
+        lineHeight: 1.5,
+        height: "1.5em",
+        color: "$text-neutrals-subtle",
+        padding: "0 2px",
+        backgroundColor: "$background-neutrals-container"
+      },
+      false: {
+        transform: "translate(0, 0)",
+        fontSize: "$200",
+        lineHeight: 1.5,
+        height: "1.5em",
+        ...styles.base.placeholder
+      }
+    },
+    size: {
+      large: {},
+      "x-large": {}
+    }
+  },
+  compoundVariants: [
+    {
+      size: "large",
+      floating: false,
+      css: {
+        top: "7px"
+      }
+    },
+    {
+      size: "x-large",
+      floating: false,
+      css: {
+        top: "11px",
+        left: "$200"
+      }
+    }
+  ],
+  defaultVariants: {
+    size: "large"
+  }
+});
+
+const inputSymbol = Symbol.for("input");
+const isInputComponent = (inputComponent) => {
+  var _a, _b;
+  return Boolean(
+    (_b = inputComponent[inputSymbol]) != null ? _b : (
+      // @ts-expect-error
+      (_a = inputComponent == null ? void 0 : inputComponent.type) == null ? void 0 : _a[inputSymbol]
+    )
+  );
+};
+
+export { FloatingLabel, inputSymbol, isInputComponent, styles, useAriaDisabled };
 //# sourceMappingURL=module.js.map

dist/types.d.ts

@@ -0,3 +1,8 @@
+import * as react from 'react';
 import { InputHTMLAttributes } from 'react';
 import { Booleanish } from '@mirohq/design-system-types';
+import * as _mirohq_design_system_stitches from '@mirohq/design-system-stitches';
+import * as _stitches_react_types_styled_component from '@stitches/react/types/styled-component';
+import * as _stitches_react_types_css_util from '@stitches/react/types/css-util';
+import * as _mirohq_design_system_primitive from '@mirohq/design-system-primitive';
 
@@ -71,2 +76,506 @@ declare const styles: {
 
-export { styles, useAriaDisabled };
+declare const FloatingLabel: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<_stitches_react_types_styled_component.StyledComponent<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"label">>, {}, {}, _stitches_react_types_css_util.CSS<{}, {
+    'border-widths': {
+        readonly none: 0;
+        readonly sm: "1px";
+        readonly md: "2px";
+        readonly lg: "4px";
+    };
+    colors: {
+        readonly black: any;
+        readonly 'blue-100': any;
+        readonly 'blue-200': any;
+        readonly 'blue-300': any;
+        readonly 'blue-400': any;
+        readonly 'blue-500': any;
+        readonly 'blue-600': any;
+        readonly 'blue-700': any;
+        readonly 'blue-800': any;
+        readonly 'blue-900': any;
+        readonly 'blue-1000': any;
+        readonly 'gray-100': any;
+        readonly 'gray-200': any;
+        readonly 'gray-300': any;
+        readonly 'gray-400': any;
+        readonly 'gray-500': any;
+        readonly 'gray-600': any;
+        readonly 'gray-700': any;
+        readonly 'gray-800': any;
+        readonly 'gray-900': any;
+        readonly 'green-100': any;
+        readonly 'green-200': any;
+        readonly 'green-300': any;
+        readonly 'green-400': any;
+        readonly 'green-500': any;
+        readonly 'green-600': any;
+        readonly 'green-700': any;
+        readonly 'green-800': any;
+        readonly 'green-900': any;
+        readonly 'indigo-100': any;
+        readonly 'indigo-200': any;
+        readonly 'indigo-300': any;
+        readonly 'indigo-400': any;
+        readonly 'indigo-500': any;
+        readonly 'indigo-600': any;
+        readonly 'indigo-700': any;
+        readonly 'indigo-800': any;
+        readonly 'indigo-900': any;
+        readonly 'red-100': any;
+        readonly 'red-200': any;
+        readonly 'red-300': any;
+        readonly 'red-400': any;
+        readonly 'red-500': any;
+        readonly 'red-600': any;
+        readonly 'red-700': any;
+        readonly 'red-800': any;
+        readonly 'red-900': any;
+        readonly transparent: any;
+        readonly white: any;
+        readonly 'yellow-100': any;
+        readonly 'yellow-200': any;
+        readonly 'yellow-300': any;
+        readonly 'yellow-400': any;
+        readonly 'yellow-500': any;
+        readonly 'yellow-600': any;
+        readonly 'yellow-700': any;
+        readonly 'yellow-800': any;
+        readonly 'yellow-900': any;
+        "background-alpha-active"?: any;
+        "background-alpha-hover"?: any;
+        "background-danger-prominent"?: any;
+        "background-danger-prominent-active"?: any;
+        "background-danger-prominent-hover"?: any;
+        "background-danger-subtle"?: any;
+        "background-danger-subtle-active"?: any;
+        "background-danger-subtle-hover"?: any;
+        "background-neutrals"?: any;
+        "background-neutrals-active"?: any;
+        "background-neutrals-container"?: any;
+        "background-neutrals-controls-disabled"?: any;
+        "background-neutrals-disabled"?: any;
+        "background-neutrals-hover"?: any;
+        "background-neutrals-inactive"?: any;
+        "background-neutrals-inactive-hover"?: any;
+        "background-neutrals-inverted"?: any;
+        "background-neutrals-inverted-subtle"?: any;
+        "background-neutrals-page"?: any;
+        "background-neutrals-page-subtle"?: any;
+        "background-neutrals-scrolls"?: any;
+        "background-neutrals-scrolls-expanded"?: any;
+        "background-neutrals-scrolls-hover"?: any;
+        "background-neutrals-scrolls-pressed"?: any;
+        "background-neutrals-scrolls-pressed-hover"?: any;
+        "background-neutrals-subtle"?: any;
+        "background-neutrals-subtle-active"?: any;
+        "background-neutrals-subtle-hover"?: any;
+        "background-primary-prominent"?: any;
+        "background-primary-prominent-active"?: any;
+        "background-primary-prominent-expanded"?: any;
+        "background-primary-prominent-hover"?: any;
+        "background-primary-prominent-pressed"?: any;
+        "background-primary-prominent-pressed-hover"?: any;
+        "background-primary-prominent-selected"?: any;
+        "background-primary-subtle"?: any;
+        "background-primary-subtle-active"?: any;
+        "background-primary-subtle-expanded"?: any;
+        "background-primary-subtle-hover"?: any;
+        "background-primary-subtle-pressed"?: any;
+        "background-primary-subtle-pressed-hover"?: any;
+        "background-primary-subtle-selected"?: any;
+        "background-success"?: any;
+        "background-success-prominent"?: any;
+        "background-success-prominent-active"?: any;
+        "background-success-prominent-hover"?: any;
+        "background-warning-prominent"?: any;
+        "background-warning-subtle"?: any;
+        "border-danger"?: any;
+        "border-danger-active"?: any;
+        "border-danger-hover"?: any;
+        "border-focus-inner"?: any;
+        "border-focus-middle"?: any;
+        "border-focus-outer"?: any;
+        "border-neutrals"?: any;
+        "border-neutrals-active"?: any;
+        "border-neutrals-controls"?: any;
+        "border-neutrals-controls-disabled"?: any;
+        "border-neutrals-disabled"?: any;
+        "border-neutrals-hover"?: any;
+        "border-neutrals-inverted"?: any;
+        "border-neutrals-subtle"?: any;
+        "border-neutrals-text"?: any;
+        "border-neutrals-text-active"?: any;
+        "border-neutrals-text-hover"?: any;
+        "border-neutrals-text-subtle"?: any;
+        "border-neutrals-text-subtle-active"?: any;
+        "border-neutrals-text-subtle-hover"?: any;
+        "border-neutrals-transparent"?: any;
+        "border-primary"?: any;
+        "border-primary-active"?: any;
+        "border-primary-hover"?: any;
+        "border-primary-inverted"?: any;
+        "border-success"?: any;
+        "border-success-active"?: any;
+        "border-success-hover"?: any;
+        "border-warning"?: any;
+        "icon-danger"?: any;
+        "icon-danger-active"?: any;
+        "icon-danger-hover"?: any;
+        "icon-danger-inverted"?: any;
+        "icon-neutrals"?: any;
+        "icon-neutrals-disabled"?: any;
+        "icon-neutrals-inactive"?: any;
+        "icon-neutrals-inactive-hover"?: any;
+        "icon-neutrals-inverted"?: any;
+        "icon-neutrals-search"?: any;
+        "icon-neutrals-subtle"?: any;
+        "icon-neutrals-text"?: any;
+        "icon-primary"?: any;
+        "icon-primary-active"?: any;
+        "icon-primary-hover"?: any;
+        "icon-primary-inverted"?: any;
+        "icon-primary-selected"?: any;
+        "icon-success"?: any;
+        "icon-success-active"?: any;
+        "icon-success-hover"?: any;
+        "icon-success-inverted"?: any;
+        "icon-warning"?: any;
+        "icon-warning-prominent"?: any;
+        "icon-warning-subtle"?: any;
+        "text-danger"?: any;
+        "text-danger-active"?: any;
+        "text-danger-hover"?: any;
+        "text-danger-inverted"?: any;
+        "text-neutrals"?: any;
+        "text-neutrals-active"?: any;
+        "text-neutrals-disabled"?: any;
+        "text-neutrals-hover"?: any;
+        "text-neutrals-inverted"?: any;
+        "text-neutrals-placeholder"?: any;
+        "text-neutrals-placeholder-only"?: any;
+        "text-neutrals-subtle"?: any;
+        "text-neutrals-subtle-active"?: any;
+        "text-neutrals-subtle-hover"?: any;
+        "text-primary"?: any;
+        "text-primary-active"?: any;
+        "text-primary-hover"?: any;
+        "text-primary-inverted"?: any;
+        "text-primary-inverted-subtle"?: any;
+        "text-primary-selected"?: any;
+        "text-success"?: any;
+        "text-success-active"?: any;
+        "text-success-hover"?: any;
+        "text-success-inverted"?: any;
+        "text-warning"?: any;
+        "text-warning-subtle"?: any;
+    };
+    'font-sizes': {
+        readonly 150: "0.75rem";
+        readonly 175: "0.875rem";
+        readonly 200: "1rem";
+        readonly 225: "1.125rem";
+        readonly 250: "1.25rem";
+        readonly 300: "1.5rem";
+        readonly 400: "2rem";
+        readonly 500: "2.5rem";
+        readonly 600: "3rem";
+        readonly 800: "4rem";
+        readonly 900: "4.5rem";
+    };
+    fonts: {
+        readonly heading: "Roobert, sans-serif";
+        readonly body: "Open Sans, sans-serif";
+    };
+    radii: {
+        readonly none: 0;
+        readonly half: "999em";
+        readonly 25: "2px";
+        readonly 50: "4px";
+        readonly 75: "6px";
+        readonly 100: "8px";
+        readonly 200: "16px";
+    };
+    shadows: {
+        readonly 'focus-small': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-inner";
+        readonly 'focus-small-outline': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 1px $colors$border-focus-middle, inset 0 0 0 2px $colors$border-focus-inner";
+        readonly 'focus-large': "0 0 0 4px $colors$border-focus-inner, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-outer";
+        readonly 'focus-controls': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-focus-middle, 0 0 0 5px $colors$border-focus-outer";
+        readonly 'focus-controls-error': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-danger, 0 0 0 5px $colors$background-danger-subtle-hover";
+        readonly 'focus-controls-success': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$background-success-prominent, 0 0 0 5px $colors$background-success";
+    };
+    sizes: {
+        readonly number: string;
+        readonly 'icon-200': "16px";
+        readonly 'icon-300': "24px";
+        readonly 'icon-400': "32px";
+    };
+    space: {
+        readonly 0: "0px";
+        readonly 25: "2px";
+        readonly 50: "4px";
+        readonly 100: "8px";
+        readonly 150: "12px";
+        readonly 200: "16px";
+        readonly 300: "24px";
+        readonly 400: "32px";
+        readonly 500: "40px";
+        readonly 600: "48px";
+        readonly 700: "56px";
+        readonly 800: "64px";
+        readonly 1200: "96px";
+        readonly 1600: "128px";
+    };
+    'space-gap': {
+        readonly 0: any;
+        readonly 50: any;
+        readonly 100: any;
+        readonly 200: any;
+        readonly 300: any;
+    };
+    'space-inset': {
+        readonly 0: any;
+        readonly 50: any;
+        readonly 100: any;
+        readonly 150: any;
+        readonly 200: any;
+        readonly 300: any;
+        readonly 400: any;
+        readonly 500: any;
+        readonly 600: any;
+        readonly 700: any;
+        readonly 800: any;
+        readonly 1200: any;
+        readonly 1600: any;
+    };
+    'space-offset': {
+        readonly 0: any;
+        readonly 50: any;
+        readonly 100: any;
+        readonly 150: any;
+        readonly 200: any;
+        readonly 300: any;
+        readonly 400: any;
+        readonly 600: any;
+        readonly 800: any;
+        readonly 1200: any;
+        readonly 1600: any;
+        readonly 'stacking-0': any;
+        readonly 'stacking-100': any;
+        readonly 'stacking-200': any;
+        readonly 'stacking-300': any;
+        readonly 'stacking-400': any;
+        readonly 'stacking-500': any;
+        readonly 'stacking-800': any;
+    };
+    'stroke-width': {
+        readonly thin: "1.5px";
+        readonly normal: "2px";
+        readonly bold: "4px";
+    };
+    'z-indices': {
+        readonly dropdownMenu: 100;
+        readonly select: 200;
+        readonly popover: 300;
+        readonly tooltip: 400;
+    };
+}, {
+    readonly background: "colors";
+    readonly backgroundColor: "colors";
+    readonly backgroundImage: "colors";
+    readonly blockSize: "sizes";
+    readonly border: "colors";
+    readonly borderBlock: "colors";
+    readonly borderBlockEnd: "colors";
+    readonly borderBlockStart: "colors";
+    readonly borderBottom: "colors";
+    readonly borderBottomColor: "colors";
+    readonly borderBottomLeftRadius: "radii";
+    readonly borderBottomRightRadius: "radii";
+    readonly borderBottomStyle: "border-styles";
+    readonly borderBottomWidth: "border-widths";
+    readonly borderColor: "colors";
+    readonly borderImage: "colors";
+    readonly borderInline: "colors";
+    readonly borderInlineEnd: "colors";
+    readonly borderInlineStart: "colors";
+    readonly borderLeft: "colors";
+    readonly borderLeftColor: "colors";
+    readonly borderLeftStyle: "border-styles";
+    readonly borderLeftWidth: "border-widths";
+    readonly borderRadius: "radii";
+    readonly borderRight: "colors";
+    readonly borderRightColor: "colors";
+    readonly borderRightStyle: "border-styles";
+    readonly borderRightWidth: "border-widths";
+    readonly borderSpacing: "space-offset";
+    readonly borderStyle: "border-styles";
+    readonly borderTop: "colors";
+    readonly borderTopColor: "colors";
+    readonly borderTopLeftRadius: "radii";
+    readonly borderTopRightRadius: "radii";
+    readonly borderTopStyle: "border-styles";
+    readonly borderTopWidth: "border-widths";
+    readonly borderWidth: "border-widths";
+    readonly bottom: "space";
+    readonly boxShadow: "shadows";
+    readonly caretColor: "colors";
+    readonly color: "colors";
+    readonly columnGap: "space-gap";
+    readonly columnRuleColor: "colors";
+    readonly fill: "colors";
+    readonly flexBasis: "sizes";
+    readonly fontFamily: "fonts";
+    readonly fontSize: "font-sizes";
+    readonly fontWeight: "font-weights";
+    readonly gap: "space-gap";
+    readonly gridColumnGap: "space-gap";
+    readonly gridGap: "space-gap";
+    readonly gridRowGap: "space-gap";
+    readonly gridTemplateColumns: "sizes";
+    readonly gridTemplateRows: "sizes";
+    readonly height: "sizes";
+    readonly inlineSize: "sizes";
+    readonly inset: "space-inset";
+    readonly insetBlock: "space-inset";
+    readonly insetBlockEnd: "space-inset";
+    readonly insetBlockStart: "space-inset";
+    readonly insetInline: "space-inset";
+    readonly insetInlineEnd: "space-inset";
+    readonly insetInlineStart: "space-inset";
+    readonly left: "space";
+    readonly letterSpacing: "letter-spacings";
+    readonly lineHeight: "line-heights";
+    readonly margin: "space-offset";
+    readonly marginBlock: "space-offset";
+    readonly marginBlockEnd: "space-offset";
+    readonly marginBlockStart: "space-offset";
+    readonly marginBottom: "space-offset";
+    readonly marginInline: "space-offset";
+    readonly marginInlineEnd: "space-offset";
+    readonly marginInlineStart: "space-offset";
+    readonly marginLeft: "space-offset";
+    readonly marginRight: "space-offset";
+    readonly marginTop: "space-offset";
+    readonly maxBlockSize: "sizes";
+    readonly maxHeight: "sizes";
+    readonly maxInlineSize: "sizes";
+    readonly maxWidth: "sizes";
+    readonly minBlockSize: "sizes";
+    readonly minHeight: "sizes";
+    readonly minInlineSize: "sizes";
+    readonly minWidth: "sizes";
+    readonly outline: "colors";
+    readonly outlineColor: "colors";
+    readonly padding: "space-inset";
+    readonly paddingBlock: "space-inset";
+    readonly paddingBlockEnd: "space-inset";
+    readonly paddingBlockStart: "space-inset";
+    readonly paddingBottom: "space-inset";
+    readonly paddingInline: "space-inset";
+    readonly paddingInlineEnd: "space-inset";
+    readonly paddingInlineStart: "space-inset";
+    readonly paddingLeft: "space-inset";
+    readonly paddingRight: "space-inset";
+    readonly paddingTop: "space-inset";
+    readonly right: "space";
+    readonly rowGap: "space-gap";
+    readonly scrollMargin: "space-offset";
+    readonly scrollMarginBlock: "space-offset";
+    readonly scrollMarginBlockEnd: "space-offset";
+    readonly scrollMarginBlockStart: "space-offset";
+    readonly scrollMarginBottom: "space-offset";
+    readonly scrollMarginInline: "space-offset";
+    readonly scrollMarginInlineEnd: "space-offset";
+    readonly scrollMarginInlineStart: "space-offset";
+    readonly scrollMarginLeft: "space-offset";
+    readonly scrollMarginRight: "space-offset";
+    readonly scrollMarginTop: "space-offset";
+    readonly scrollPadding: "space-inset";
+    readonly scrollPaddingBlock: "space-inset";
+    readonly scrollPaddingBlockEnd: "space-inset";
+    readonly scrollPaddingBlockStart: "space-inset";
+    readonly scrollPaddingBottom: "space-inset";
+    readonly scrollPaddingInline: "space-inset";
+    readonly scrollPaddingInlineEnd: "space-inset";
+    readonly scrollPaddingInlineStart: "space-inset";
+    readonly scrollPaddingLeft: "space-inset";
+    readonly scrollPaddingRight: "space-inset";
+    readonly scrollPaddingTop: "space-inset";
+    readonly stroke: "colors";
+    readonly strokeWidth: "stroke-width";
+    readonly textDecorationColor: "colors";
+    readonly textShadow: "shadows";
+    readonly top: "space";
+    readonly transition: "transitions";
+    readonly width: "sizes";
+    readonly zIndex: "z-indices";
+}, {
+    paddingX: (value: {
+        readonly [$$PropertyValue]: "padding";
+    }) => {
+        paddingLeft: {
+            readonly [$$PropertyValue]: "padding";
+        };
+        paddingRight: {
+            readonly [$$PropertyValue]: "padding";
+        };
+    };
+    paddingY: (value: {
+        readonly [$$PropertyValue]: "padding";
+    }) => {
+        paddingTop: {
+            readonly [$$PropertyValue]: "padding";
+        };
+        paddingBottom: {
+            readonly [$$PropertyValue]: "padding";
+        };
+    };
+    marginX: (value: {
+        readonly [$$PropertyValue]: "margin";
+    }) => {
+        marginLeft: {
+            readonly [$$PropertyValue]: "margin";
+        };
+        marginRight: {
+            readonly [$$PropertyValue]: "margin";
+        };
+    };
+    marginY: (value: {
+        readonly [$$PropertyValue]: "margin";
+    }) => {
+        marginTop: {
+            readonly [$$PropertyValue]: "margin";
+        };
+        marginBottom: {
+            readonly [$$PropertyValue]: "margin";
+        };
+    };
+    square: (value: {
+        readonly [$$PropertyValue]: "width";
+    }) => {
+        width: {
+            readonly [$$PropertyValue]: "width";
+        };
+        height: {
+            readonly [$$PropertyValue]: "width";
+        };
+    };
+    _hover: (css: _stitches_react_types_css_util.CSSProperties) => {
+        '&:hover, &[data-hovered]': _stitches_react_types_css_util.CSSProperties;
+    };
+}>>>, "size" | "floating"> & _stitches_react_types_styled_component.TransformProps<{
+    floating?: boolean | "false" | "true" | undefined;
+    size?: "large" | "x-large" | undefined;
+}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLLabelElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"label">>, {
+    floating?: boolean | "false" | "true" | undefined;
+    size?: "large" | "x-large" | undefined;
+}, {}>;
+
+declare const inputSymbol: unique symbol;
+declare type InputReactElement = React.ReactElement & {
+    [inputSymbol]?: boolean;
+};
+declare const isInputComponent: <T>(inputComponent: T & {
+    [inputSymbol]?: boolean | undefined;
+}) => boolean;
+
+export { FloatingLabel, InputReactElement, inputSymbol, isInputComponent, styles, useAriaDisabled };

package.json

 {
   "name": "@mirohq/design-system-base-input",
-  "version": "0.0.3-forms.0",
+  "version": "0.1.0-forms.1",
   "description": "",
@@ -29,2 +29,4 @@ "author": "Miro",
   "dependencies": {
+    "@mirohq/design-system-primitive": "^1.1.2-forms.0",
+    "@mirohq/design-system-stitches": "^2.6.0",
     "@mirohq/design-system-types": "^0.6.2",
@@ -31,0 +33,0 @@ "@mirohq/design-system-utils": "^0.15.0-forms.0"

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

44246

increased by191.3%

Lines of code

874

increased by262.66%

Worsened metrics

Dependency count

6

increased by50%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Added@mirohq/design-system-primitive@^1.1.2-forms.0

• + Added@mirohq/design-system-stitches@^2.6.0

• + Added@mirohq/design-system-primitive@1.1.2(transitive)

• + Added@mirohq/design-system-stitches@2.6.30(transitive)

• + Added@mirohq/design-system-themes@0.13.1(transitive)

• + Added@mirohq/design-tokens@6.5.1(transitive)

• + Added@radix-ui/react-compose-refs@1.1.1(transitive)

• + Added@radix-ui/react-slot@1.1.1(transitive)

• + Addedlodash.merge@4.6.2(transitive)