@vinyasa/form 1.0.22

package/dist/esm/2995.css

@@ -0,0 +1,135 @@
+.sbqkrx0 {
+  width: 100%;
+  font-family: var(--vinyasa-font-family-sans);
+  color: var(--vinyasa-on-secondary);
+  border: var(--vinyasa-border-width-thin) solid var(--vinyasa-border-color-default);
+  border-radius: var(--vinyasa-radius-sm);
+  transition: border-color var(--vinyasa-motion-duration-fast) var(--vinyasa-motion-easing-standard);
+  background-color: #0000;
+  display: block;
+}
+
+.sbqkrx0::placeholder {
+  color: var(--vinyasa-text-muted);
+}
+
+.sbqkrx0:focus-visible {
+  border-color: var(--vinyasa-focus);
+  box-shadow: 0 0 0 1px var(--vinyasa-focus), 0 0 0 4px color-mix(in srgb, var(--vinyasa-focus) 16%, transparent);
+  outline: none;
+}
+
+.sbqkrx0:disabled {
+  opacity: var(--vinyasa-opacity-disabled);
+  cursor: not-allowed;
+}
+
+.sbqkrx1 {
+  padding: var(--vinyasa-space1) var(--vinyasa-space2);
+  font-size: var(--vinyasa-font-size-sm);
+}
+
+.sbqkrx2 {
+  padding: var(--vinyasa-space2) var(--vinyasa-space3);
+  font-size: var(--vinyasa-font-size-sm);
+}
+
+.sbqkrx3 {
+  padding: var(--vinyasa-space3) var(--vinyasa-space4);
+  font-size: var(--vinyasa-font-size-md);
+}
+
+.sbqkrx4 {
+  border-color: var(--vinyasa-error);
+}
+
+.sbqkrx5 {
+  align-items: stretch;
+  display: flex;
+  position: relative;
+}
+
+.sbqkrx6 {
+  left: var(--vinyasa-space3);
+  color: var(--vinyasa-text-muted);
+  pointer-events: none;
+  display: flex;
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+}
+
+.sbqkrx7 {
+  right: var(--vinyasa-space2);
+  align-items: center;
+  display: flex;
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+}
+
+.sbqkrx8 {
+  padding-left: 2.25rem;
+}
+
+.sbqkrx9 {
+  padding-right: 2.25rem;
+}
+
+.sbqkrxa {
+  color: var(--vinyasa-text-muted);
+  cursor: pointer;
+  background: none;
+  border: none;
+  align-items: center;
+  margin: 0;
+  padding: 0;
+  display: inline-flex;
+}
+
+.sbqkrxa:hover {
+  color: var(--vinyasa-on-secondary);
+}
+
+.sbqkrxa:disabled {
+  cursor: not-allowed;
+  opacity: var(--vinyasa-opacity-disabled);
+}
+
+.sbqkrxb {
+  font-size: var(--vinyasa-font-size-sm);
+  font-weight: var(--vinyasa-font-weight-medium);
+  color: var(--vinyasa-on-secondary);
+  margin-bottom: var(--vinyasa-space1);
+  display: block;
+}
+
+.sbqkrxc {
+  color: var(--vinyasa-error);
+  margin-left: .125rem;
+}
+
+.sbqkrxd {
+  font-size: var(--vinyasa-font-size-xs);
+  color: var(--vinyasa-text-muted);
+  margin-top: var(--vinyasa-space1);
+}
+
+.sbqkrxe {
+  font-size: var(--vinyasa-font-size-xs);
+  color: var(--vinyasa-error);
+  margin-top: var(--vinyasa-space1);
+}
+
+.sbqkrxf {
+  align-items: center;
+  gap: var(--vinyasa-space2);
+  display: inline-flex;
+}
+
+.sbqkrxg {
+  font-size: var(--vinyasa-font-size-sm);
+  color: var(--vinyasa-on-secondary);
+  cursor: pointer;
+}
+

package/dist/esm/2995.js

@@ -0,0 +1,117 @@
+import "./2995.css";
+function toPrimitive(t, r) {
+    if ("object" != typeof t || !t) return t;
+    var e = t[Symbol.toPrimitive];
+    if (void 0 !== e) {
+        var i = e.call(t, r || "default");
+        if ("object" != typeof i) return i;
+        throw new TypeError("@@toPrimitive must return a primitive value.");
+    }
+    return ("string" === r ? String : Number)(t);
+}
+function toPropertyKey(t) {
+    var i = toPrimitive(t, "string");
+    return "symbol" == typeof i ? i : String(i);
+}
+function _defineProperty(obj, key, value) {
+    key = toPropertyKey(key);
+    if (key in obj) Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+    });
+    else obj[key] = value;
+    return obj;
+}
+function ownKeys(e, r) {
+    var t = Object.keys(e);
+    if (Object.getOwnPropertySymbols) {
+        var o = Object.getOwnPropertySymbols(e);
+        r && (o = o.filter(function(r) {
+            return Object.getOwnPropertyDescriptor(e, r).enumerable;
+        })), t.push.apply(t, o);
+    }
+    return t;
+}
+function _objectSpread2(e) {
+    for(var r = 1; r < arguments.length; r++){
+        var t = null != arguments[r] ? arguments[r] : {};
+        r % 2 ? ownKeys(Object(t), !0).forEach(function(r) {
+            _defineProperty(e, r, t[r]);
+        }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r) {
+            Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
+        });
+    }
+    return e;
+}
+function mapValues(input, fn) {
+    var result = {};
+    for(var _key in input)result[_key] = fn(input[_key], _key);
+    return result;
+}
+var shouldApplyCompound = (compoundCheck, selections, defaultVariants)=>{
+    for (var key of Object.keys(compoundCheck)){
+        var _selections$key;
+        if (compoundCheck[key] !== (null != (_selections$key = selections[key]) ? _selections$key : defaultVariants[key])) return false;
+    }
+    return true;
+};
+var createRuntimeFn = (config)=>{
+    var runtimeFn = (options)=>{
+        var className = config.defaultClassName;
+        var selections = _objectSpread2(_objectSpread2({}, config.defaultVariants), options);
+        for(var variantName in selections){
+            var _selections$variantNa;
+            var variantSelection = null != (_selections$variantNa = selections[variantName]) ? _selections$variantNa : config.defaultVariants[variantName];
+            if (null != variantSelection) {
+                var selection = variantSelection;
+                if ('boolean' == typeof selection) selection = true === selection ? 'true' : 'false';
+                var selectionClassName = config.variantClassNames[variantName][selection];
+                if (selectionClassName) className += ' ' + selectionClassName;
+            }
+        }
+        for (var [compoundCheck, compoundClassName] of config.compoundVariants)if (shouldApplyCompound(compoundCheck, selections, config.defaultVariants)) className += ' ' + compoundClassName;
+        return className;
+    };
+    runtimeFn.variants = ()=>Object.keys(config.variantClassNames);
+    runtimeFn.classNames = {
+        get base () {
+            return config.defaultClassName.split(' ')[0];
+        },
+        get variants () {
+            return mapValues(config.variantClassNames, (classNames)=>mapValues(classNames, (className)=>className.split(' ')[0]));
+        }
+    };
+    return runtimeFn;
+};
+var controlLabel = 'sbqkrxg';
+var controlRow = 'sbqkrxf';
+var descriptionText = 'sbqkrxd';
+var errorText = 'sbqkrxe';
+var fieldControl = createRuntimeFn({
+    defaultClassName: 'sbqkrx0',
+    variantClassNames: {
+        size: {
+            sm: 'sbqkrx1',
+            md: 'sbqkrx2',
+            lg: 'sbqkrx3'
+        },
+        invalid: {
+            true: 'sbqkrx4'
+        }
+    },
+    defaultVariants: {
+        size: 'md'
+    },
+    compoundVariants: []
+});
+var fieldControlWithLeadingIcon = 'sbqkrx8';
+var fieldControlWithTrailingIcon = 'sbqkrx9';
+var fieldGroup = 'sbqkrx5';
+var fieldIconButton = 'sbqkrxa';
+var fieldIconLeading = 'sbqkrx6';
+var fieldIconTrailing = 'sbqkrx7';
+var label = 'sbqkrxb';
+var requiredMark = 'sbqkrxc';
+export { controlLabel, controlRow, createRuntimeFn, descriptionText, errorText, fieldControl, fieldControlWithLeadingIcon, fieldControlWithTrailingIcon, fieldGroup, fieldIconButton, fieldIconLeading, fieldIconTrailing, label, requiredMark };

package/dist/esm/3876.js

@@ -0,0 +1,27 @@
+import { jsx } from "react/jsx-runtime";
+import _vinyasa_button from "@vinyasa/button";
+import { forwardRef, useState } from "react";
+import * as __rspack_external__radix_ui_react_toggle_5760592b from "@radix-ui/react-toggle";
+const ToggleButton = /*#__PURE__*/ forwardRef(({ pressed, defaultPressed = false, onPressedChange, pressedVariant = 'primary', unpressedVariant = 'outline', ...buttonProps }, ref)=>{
+    const [uncontrolledPressed, setUncontrolledPressed] = useState(defaultPressed);
+    const isControlled = void 0 !== pressed;
+    const currentPressed = isControlled ? pressed : uncontrolledPressed;
+    const handlePressedChange = (next)=>{
+        if (!isControlled) setUncontrolledPressed(next);
+        onPressedChange?.(next);
+    };
+    return /*#__PURE__*/ jsx(__rspack_external__radix_ui_react_toggle_5760592b.Root, {
+        pressed: pressed,
+        defaultPressed: defaultPressed,
+        onPressedChange: handlePressedChange,
+        asChild: true,
+        children: /*#__PURE__*/ jsx(_vinyasa_button, {
+            ref: ref,
+            variant: currentPressed ? pressedVariant : unpressedVariant,
+            ...buttonProps
+        })
+    });
+});
+ToggleButton.displayName = 'ToggleButton';
+const toggle_button_ToggleButton = ToggleButton;
+export { toggle_button_ToggleButton };

package/dist/esm/4557.js

@@ -0,0 +1,39 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { label as field_css_label, errorText, descriptionText, requiredMark } from "./2995.js";
+const describedByIds = (id, { description, error })=>{
+    const ids = [];
+    if (description) ids.push(`${id}-description`);
+    if (error) ids.push(`${id}-error`);
+    return ids.length > 0 ? ids.join(' ') : void 0;
+};
+const FieldChrome = ({ id, label, description, error, required, children, disableLabelFor = false })=>/*#__PURE__*/ jsxs("div", {
+        children: [
+            label ? /*#__PURE__*/ jsxs("label", {
+                htmlFor: disableLabelFor ? void 0 : id,
+                id: `${id}-label`,
+                className: field_css_label,
+                children: [
+                    label,
+                    required ? /*#__PURE__*/ jsx("span", {
+                        className: requiredMark,
+                        "aria-hidden": "true",
+                        children: "*"
+                    }) : null
+                ]
+            }) : null,
+            children,
+            description ? /*#__PURE__*/ jsx("p", {
+                id: `${id}-description`,
+                className: descriptionText,
+                children: description
+            }) : null,
+            error ? /*#__PURE__*/ jsx("p", {
+                id: `${id}-error`,
+                className: errorText,
+                role: "alert",
+                children: error
+            }) : null
+        ]
+    });
+const field = FieldChrome;
+export { describedByIds, field };

package/dist/esm/6720.css

@@ -0,0 +1,164 @@
+._1u69cbs0 {
+  z-index: var(--vinyasa-z-index-dropdown);
+  width: var(--radix-popper-anchor-width);
+  background-color: var(--vinyasa-surface);
+  border: var(--vinyasa-border-width-thin) solid var(--vinyasa-border-color-default);
+  border-radius: var(--vinyasa-radius-md);
+  min-width: 16rem;
+  box-shadow: var(--vinyasa-elevation-overlay);
+  overflow: hidden;
+}
+
+._1u69cbs1 {
+  max-height: 16rem;
+  padding: var(--vinyasa-space1);
+  overflow-y: auto;
+}
+
+._1u69cbs2 {
+  justify-content: space-between;
+  align-items: center;
+  gap: var(--vinyasa-space2);
+  padding: var(--vinyasa-space2) var(--vinyasa-space3);
+  border-radius: var(--vinyasa-radius-sm);
+  font-size: var(--vinyasa-font-size-sm);
+  color: var(--vinyasa-on-secondary);
+  cursor: pointer;
+  -webkit-user-select: none;
+  user-select: none;
+  display: flex;
+}
+
+._1u69cbs2[data-selected="true"] {
+  background-color: var(--vinyasa-secondary);
+  outline: none;
+}
+
+._1u69cbs2[data-disabled="true"] {
+  opacity: var(--vinyasa-opacity-disabled);
+  cursor: not-allowed;
+}
+
+._1u69cbs3 {
+  color: var(--vinyasa-primary);
+  display: flex;
+}
+
+._1u69cbs4 {
+  padding: var(--vinyasa-space3) var(--vinyasa-space3);
+  font-size: var(--vinyasa-font-size-sm);
+  color: var(--vinyasa-text-muted);
+  text-align: center;
+}
+
+._1u69cbs5 {
+  color: var(--vinyasa-text-muted);
+}
+
+._1u69cbs6 {
+  justify-content: space-between;
+  align-items: center;
+  gap: var(--vinyasa-space2);
+  text-align: left;
+  cursor: pointer;
+  background-color: #0000;
+  width: 100%;
+  min-width: 10rem;
+  max-width: 20rem;
+  display: inline-flex;
+}
+
+._1u69cbs7 {
+  color: var(--vinyasa-text-muted);
+  flex-shrink: 0;
+  display: flex;
+}
+
+._1u69cbs8 {
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+}
+
+._1u69cbs9 {
+  align-items: center;
+  gap: var(--vinyasa-space2);
+  padding: var(--vinyasa-space2) var(--vinyasa-space3);
+  border-bottom: var(--vinyasa-border-width-thin) solid var(--vinyasa-border-color-default);
+  display: flex;
+}
+
+._1u69cbsa {
+  color: var(--vinyasa-text-muted);
+  flex-shrink: 0;
+  display: flex;
+}
+
+._1u69cbsb {
+  min-width: 0;
+  font-family: var(--vinyasa-font-family-sans);
+  font-size: var(--vinyasa-font-size-sm);
+  color: var(--vinyasa-on-secondary);
+  background: none;
+  border: none;
+  outline: none;
+  flex: 1;
+}
+
+._1u69cbsb::placeholder {
+  color: var(--vinyasa-text-muted);
+}
+
+._1u69cbsc {
+  cursor: text;
+  align-items: center;
+  min-width: 10rem;
+  min-height: 2.5rem;
+  display: flex;
+}
+
+._1u69cbsd {
+  align-items: center;
+  gap: var(--vinyasa-space1);
+  flex-wrap: wrap;
+  min-height: 1.25rem;
+  display: flex;
+}
+
+._1u69cbse {
+  align-items: center;
+  gap: var(--vinyasa-space1);
+  padding: .125rem var(--vinyasa-space2);
+  border-radius: var(--vinyasa-radius-sm);
+  background-color: var(--vinyasa-secondary);
+  color: var(--vinyasa-on-secondary);
+  font-size: var(--vinyasa-font-size-xs);
+  display: inline-flex;
+}
+
+._1u69cbsf {
+  padding: .125rem var(--vinyasa-space2);
+  border-radius: var(--vinyasa-radius-sm);
+  background-color: var(--vinyasa-secondary);
+  color: var(--vinyasa-text-muted);
+  font-size: var(--vinyasa-font-size-xs);
+  font-weight: var(--vinyasa-font-weight-medium);
+  align-items: center;
+  display: inline-flex;
+}
+
+._1u69cbsg {
+  color: inherit;
+  cursor: pointer;
+  background: none;
+  border: none;
+  padding: 0;
+  display: inline-flex;
+}
+
+._1u69cbsg:hover {
+  color: var(--vinyasa-error);
+}
+

package/dist/esm/6720.js

@@ -0,0 +1,19 @@
+import "./6720.css";
+var chip = '_1u69cbse';
+var chipOverflow = '_1u69cbsf';
+var chipRemove = '_1u69cbsg';
+var chipRow = '_1u69cbsd';
+var content = '_1u69cbs0';
+var empty = '_1u69cbs4';
+var item = '_1u69cbs2';
+var itemIndicator = '_1u69cbs3';
+var list = '_1u69cbs1';
+var placeholder = '_1u69cbs5';
+var searchIcon = '_1u69cbsa';
+var searchInput = '_1u69cbsb';
+var searchWrapper = '_1u69cbs9';
+var trigger = '_1u69cbs6';
+var triggerBox = '_1u69cbsc';
+var triggerIcon = '_1u69cbs7';
+var triggerText = '_1u69cbs8';
+export { chip, chipOverflow, chipRemove, chipRow, content, empty, item, itemIndicator, list, placeholder, searchIcon, searchInput, searchWrapper, trigger, triggerBox, triggerIcon, triggerText };

package/dist/esm/autocomplete.d.ts

@@ -0,0 +1,2 @@
+export * from './components/autocomplete/index';
+export { default } from './components/autocomplete/index';

package/dist/esm/autocomplete.js

@@ -0,0 +1,95 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Command } from "cmdk";
+import { useId, useState } from "react";
+import { field, describedByIds } from "./4557.js";
+import { fieldControl } from "./2995.js";
+import { empty, list, content, item } from "./6720.js";
+import * as __rspack_external__radix_ui_react_popover_e2827c9f from "@radix-ui/react-popover";
+const Autocomplete = ({ suggestions, value, defaultValue = '', onValueChange, placeholder, label, description, error, required, size, emptyMessage = 'No suggestions.', id: idProp })=>{
+    const [internalValue, setInternalValue] = useState(defaultValue);
+    const isControlled = void 0 !== value;
+    const currentValue = isControlled ? value : internalValue;
+    const [open, setOpen] = useState(false);
+    const generatedId = useId();
+    const id = idProp ?? generatedId;
+    const setValue = (next)=>{
+        if (!isControlled) setInternalValue(next);
+        onValueChange?.(next);
+    };
+    return /*#__PURE__*/ jsx(field, {
+        id: id,
+        label: label,
+        description: description,
+        error: error,
+        required: required,
+        disableLabelFor: true,
+        children: /*#__PURE__*/ jsx(Command, {
+            loop: true,
+            shouldFilter: true,
+            label: 'string' == typeof label ? label : void 0,
+            children: /*#__PURE__*/ jsxs(__rspack_external__radix_ui_react_popover_e2827c9f.Root, {
+                open: open,
+                onOpenChange: setOpen,
+                children: [
+                    /*#__PURE__*/ jsx(__rspack_external__radix_ui_react_popover_e2827c9f.Trigger, {
+                        asChild: true,
+                        children: /*#__PURE__*/ jsx(Command.Input, {
+                            id: id,
+                            value: currentValue,
+                            onClick: (event)=>{
+                                event.preventDefault();
+                            },
+                            onValueChange: (next)=>{
+                                setValue(next);
+                                setOpen(true);
+                            },
+                            onFocus: ()=>{
+                                setOpen(true);
+                            },
+                            placeholder: placeholder,
+                            className: fieldControl({
+                                size,
+                                invalid: Boolean(error)
+                            }),
+                            "aria-describedby": describedByIds(id, {
+                                description,
+                                error
+                            })
+                        })
+                    }),
+                    /*#__PURE__*/ jsx(__rspack_external__radix_ui_react_popover_e2827c9f.Content, {
+                        className: content,
+                        align: "start",
+                        sideOffset: 4,
+                        onOpenAutoFocus: (event)=>{
+                            event.preventDefault();
+                        },
+                        children: /*#__PURE__*/ jsxs(Command.List, {
+                            className: list,
+                            children: [
+                                /*#__PURE__*/ jsx(Command.Empty, {
+                                    className: empty,
+                                    children: emptyMessage
+                                }),
+                                suggestions.map((suggestion)=>/*#__PURE__*/ jsx(Command.Item, {
+                                        value: suggestion,
+                                        onSelect: ()=>{
+                                            setValue(suggestion);
+                                            setOpen(false);
+                                        },
+                                        className: item,
+                                        children: suggestion
+                                    }, suggestion))
+                            ]
+                        })
+                    })
+                ]
+            })
+        })
+    });
+};
+Autocomplete.displayName = 'Autocomplete';
+const autocomplete_Autocomplete = Autocomplete;
+const autocomplete = autocomplete_Autocomplete;
+export default autocomplete;
+export { autocomplete as Autocomplete };

package/dist/esm/checkbox.css

@@ -0,0 +1,36 @@
+._7ele600 {
+  all: unset;
+  border: var(--vinyasa-border-width-thin) solid var(--vinyasa-border-color-default);
+  border-radius: var(--vinyasa-radius-sm);
+  cursor: pointer;
+  background-color: #0000;
+  flex-shrink: 0;
+  justify-content: center;
+  align-items: center;
+  width: 1.125rem;
+  height: 1.125rem;
+  display: inline-flex;
+}
+
+._7ele600[data-state="checked"] {
+  background-color: var(--vinyasa-primary);
+  border-color: var(--vinyasa-primary);
+}
+
+._7ele600:focus-visible {
+  border-color: var(--vinyasa-focus);
+  box-shadow: 0 0 0 1px var(--vinyasa-focus), 0 0 0 4px color-mix(in srgb, var(--vinyasa-focus) 16%, transparent);
+  outline: none;
+}
+
+._7ele600[data-disabled] {
+  opacity: var(--vinyasa-opacity-disabled);
+  cursor: not-allowed;
+}
+
+._7ele601 {
+  color: var(--vinyasa-on-primary);
+  font-size: .75rem;
+  display: flex;
+}
+

package/dist/esm/checkbox.d.ts

@@ -0,0 +1,2 @@
+export * from './components/checkbox/index';
+export { default } from './components/checkbox/index';

package/dist/esm/checkbox.js

@@ -0,0 +1,38 @@
+import "./checkbox.css";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { CheckIcon } from "@vinyasa/icons";
+import { forwardRef, useId } from "react";
+import { controlRow, controlLabel } from "./2995.js";
+import * as __rspack_external__radix_ui_react_checkbox_76684228 from "@radix-ui/react-checkbox";
+var indicator = '_7ele601';
+var root = '_7ele600';
+const Checkbox = /*#__PURE__*/ forwardRef(({ label, id: idProp, className, ...rest }, ref)=>{
+    const generatedId = useId();
+    const id = idProp ?? generatedId;
+    const classes = className ? `${root} ${className}` : root;
+    return /*#__PURE__*/ jsxs("div", {
+        className: controlRow,
+        children: [
+            /*#__PURE__*/ jsx(__rspack_external__radix_ui_react_checkbox_76684228.Root, {
+                ref: ref,
+                id: id,
+                className: classes,
+                ...rest,
+                children: /*#__PURE__*/ jsx(__rspack_external__radix_ui_react_checkbox_76684228.Indicator, {
+                    className: indicator,
+                    children: /*#__PURE__*/ jsx(CheckIcon, {})
+                })
+            }),
+            label ? /*#__PURE__*/ jsx("label", {
+                htmlFor: id,
+                className: controlLabel,
+                children: label
+            }) : null
+        ]
+    });
+});
+Checkbox.displayName = 'Checkbox';
+const checkbox_Checkbox = Checkbox;
+const components_checkbox = checkbox_Checkbox;
+export default components_checkbox;
+export { components_checkbox as Checkbox };