ropav 0.2.0 → 0.3.0

package/dist/input.css

@@ -1,123 +0,0 @@
-@layer ropav.components {
-.rp-input[data-v-803913b6] {
-    --_rp-input-height: var(--rp-size-control-md);
-    --_rp-input-padding-x: calc(var(--rp-size-control-md) / 3);
-    --_rp-input-font-size: var(--rp-font-size-md);
-    --_rp-input-radius: var(--rp-radius-sm);
-    --_rp-input-valid-border: var(--rp-color-green-outline);
-    --_rp-input-valid-ring: color-mix(in srgb, var(--rp-color-green-outline) 32%, transparent);
-    --_rp-input-invalid-border: var(--rp-color-red-outline);
-    --_rp-input-invalid-ring: color-mix(in srgb, var(--rp-color-red-outline) 32%, transparent);
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    box-sizing: border-box;
-    gap: var(--rp-spacing-2);
-    font-family: var(--rp-font-family);
-    font-weight: var(--rp-font-weight-normal);
-    background-color: var(--rp-color-control-bg);
-    border: var(--rp-border-width-thin) solid var(--rp-color-control-border);
-    cursor: text;
-    transition: border-color var(--rp-transition-fast), box-shadow var(--rp-transition-fast);
-}
-.rp-input[data-v-803913b6]:hover:not(.rp-input--disabled):not(.rp-input--invalid):not(.rp-input--valid) {
-    border-color: var(--rp-color-control-border-hover);
-}
-.rp-input[data-v-803913b6]:focus-within:not(.rp-input--disabled):not(.rp-input--invalid):not(.rp-input--valid) {
-    border-color: var(--rp-color-control-border-focus);
-    box-shadow: 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
-}
-.rp-input[data-v-803913b6] {
-    height: var(--_rp-input-height);
-    padding: 0 var(--_rp-input-padding-x);
-    font-size: var(--_rp-input-font-size);
-    border-radius: var(--_rp-input-radius);
-}
-.rp-input--size-xs[data-v-803913b6] {
-    --_rp-input-height: var(--rp-size-control-xs);
-    --_rp-input-padding-x: calc(var(--rp-size-control-xs) / 3);
-    --_rp-input-font-size: var(--rp-font-size-xs);
-}
-.rp-input--size-sm[data-v-803913b6] {
-    --_rp-input-height: var(--rp-size-control-sm);
-    --_rp-input-padding-x: calc(var(--rp-size-control-sm) / 3);
-    --_rp-input-font-size: var(--rp-font-size-sm);
-}
-.rp-input--size-md[data-v-803913b6] {
-    --_rp-input-height: var(--rp-size-control-md);
-    --_rp-input-padding-x: calc(var(--rp-size-control-md) / 3);
-    --_rp-input-font-size: var(--rp-font-size-md);
-}
-.rp-input--size-lg[data-v-803913b6] {
-    --_rp-input-height: var(--rp-size-control-lg);
-    --_rp-input-padding-x: calc(var(--rp-size-control-lg) / 3);
-    --_rp-input-font-size: var(--rp-font-size-lg);
-}
-.rp-input--size-xl[data-v-803913b6] {
-    --_rp-input-height: var(--rp-size-control-xl);
-    --_rp-input-padding-x: calc(var(--rp-size-control-xl) / 3);
-    --_rp-input-font-size: var(--rp-font-size-xl);
-}
-.rp-input--radius-xs[data-v-803913b6] {
-    --_rp-input-radius: var(--rp-radius-xs);
-}
-.rp-input--radius-sm[data-v-803913b6] {
-    --_rp-input-radius: var(--rp-radius-sm);
-}
-.rp-input--radius-md[data-v-803913b6] {
-    --_rp-input-radius: var(--rp-radius-md);
-}
-.rp-input--radius-lg[data-v-803913b6] {
-    --_rp-input-radius: var(--rp-radius-lg);
-}
-.rp-input--radius-xl[data-v-803913b6] {
-    --_rp-input-radius: var(--rp-radius-xl);
-}
-.rp-input--disabled[data-v-803913b6] {
-    opacity: var(--rp-opacity-disabled);
-    cursor: not-allowed;
-}
-.rp-input--valid[data-v-803913b6] {
-    border-color: var(--_rp-input-valid-border);
-}
-.rp-input--valid[data-v-803913b6]:focus-within:not(.rp-input--disabled) {
-    border-color: var(--_rp-input-valid-border);
-    box-shadow: 0 0 0 var(--rp-border-width-medium) var(--_rp-input-valid-ring);
-}
-.rp-input--invalid[data-v-803913b6] {
-    border-color: var(--_rp-input-invalid-border);
-}
-.rp-input--invalid[data-v-803913b6]:focus-within:not(.rp-input--disabled) {
-    border-color: var(--_rp-input-invalid-border);
-    box-shadow: 0 0 0 var(--rp-border-width-medium) var(--_rp-input-invalid-ring);
-}
-.rp-input--readonly[data-v-803913b6] {
-    background-color: var(--rp-color-control-readonly-bg);
-}
-.rp-input__native[data-v-803913b6] {
-    box-sizing: border-box;
-    flex: 1;
-    width: 100%;
-    height: 100%;
-    min-width: 0;
-    padding: 0;
-    border: none;
-    outline: none;
-    background: transparent;
-    font: inherit;
-    color: var(--rp-color-control-fg);
-    line-height: 1;
-}
-.rp-input__native[data-v-803913b6]::placeholder {
-    color: var(--rp-color-control-placeholder);
-}
-.rp-input__native[data-v-803913b6]:disabled {
-    cursor: not-allowed;
-}
-.rp-input__left[data-v-803913b6], .rp-input__right[data-v-803913b6] {
-    display: inline-flex;
-    align-items: center;
-    flex-shrink: 0;
-    color: var(--rp-color-control-icon);
-}
-}

package/dist/input.js

@@ -1,169 +0,0 @@
-import './input.css';
-import { t as useControllableValue } from "./useControllableValue.js";
-import { t as useStylesApi } from "./styles-api.js";
-import { n as toPresenceAttribute } from "./attributes.js";
-import { t as bem } from "./bem.js";
-import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
-import { a as useTextFormControl, t as claimNestedFormControlOwner } from "./useFormControl.js";
-import { o as splitCompatibilityAttributes, t as composeEventHandlers } from "./attributes2.js";
-import { t as useControlState } from "./useControlState.js";
-import { t as isInteractiveElement } from "./interactive.js";
-import { child, computed, createIf, createSlot, defineVaporComponent, ref, renderEffect, setDynamicProps, setInsertionState, setStaticTemplateRef, template, unref } from "vue";
-//#region src/components/input/useInput.ts
-var NATIVE_INPUT_SELECTOR = ".rp-input__native";
-function useInput(props, emitUpdate) {
-	const inputRef = ref(null);
-	const control = useControlState(props);
-	const rootClass = computed(() => bem("rp-input", {
-		[`size-${props.size}`]: Boolean(props.size),
-		[`radius-${props.radius}`]: Boolean(props.radius),
-		disabled: control.disabled,
-		invalid: control.invalid,
-		valid: control.valid && !control.invalid,
-		readonly: props.readonly
-	}));
-	function onInput(e) {
-		emitUpdate(e.target.value);
-	}
-	function focusInput(e) {
-		if (control.disabled) return;
-		if (isInteractiveElement(e.target, NATIVE_INPUT_SELECTOR)) return;
-		inputRef.value?.focus();
-	}
-	return {
-		inputRef,
-		control,
-		rootClass,
-		onInput,
-		focusInput
-	};
-}
-//#endregion
-//#region src/components/input/input.vue?vue&type=script&setup=true&vapor=true&lang.ts
-var t0 = template("<span data-v-803913b6>");
-var t1 = template("<div data-v-803913b6><input data-v-803913b6>", 1);
-//#endregion
-//#region src/components/input/input.vue
-var input_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineVaporComponent({
-	name: "RpInput",
-	inheritAttrs: false,
-	__name: "input",
-	props: {
-		id: {},
-		name: {},
-		form: {},
-		modelValue: { default: void 0 },
-		defaultValue: { default: "" },
-		type: { default: "text" },
-		size: {},
-		radius: {},
-		placeholder: { default: "" },
-		disabled: {
-			type: Boolean,
-			default: void 0
-		},
-		readonly: {
-			type: Boolean,
-			default: false
-		},
-		required: {
-			type: Boolean,
-			default: void 0
-		},
-		invalid: {
-			type: Boolean,
-			default: void 0
-		},
-		valid: {
-			type: Boolean,
-			default: void 0
-		},
-		ariaLabel: {},
-		describedby: {},
-		labelledby: {},
-		inputAttrs: {},
-		validationMessage: {},
-		classNames: {},
-		styles: {}
-	},
-	emits: ["update:modelValue"],
-	setup(__props, { expose: __expose, emit: __emit, slots: $slots }) {
-		const props = __props;
-		const emit = __emit;
-		const controllable = useControllableValue({
-			modelValue: () => props.modelValue,
-			defaultValue: () => props.defaultValue,
-			onChange: (value) => emit("update:modelValue", value)
-		});
-		const { inputRef, control, rootClass, onInput, focusInput } = useInput(props, (value) => {
-			controllable.setValue(value);
-		});
-		if (!claimNestedFormControlOwner()) useTextFormControl(() => inputRef.value, controllable, () => props.validationMessage);
-		const { getPartAttrs, getRootAttrs } = useStylesApi(props, "root");
-		const rootAttrs = computed(() => getRootAttrs({
-			class: rootClass.value,
-			onMousedown: focusInput,
-			"data-disabled": toPresenceAttribute(control.disabled),
-			"data-readonly": toPresenceAttribute(props.readonly),
-			"data-invalid": toPresenceAttribute(control.invalid)
-		}));
-		const nativeInputAttrs = computed(() => {
-			const attrs = props.inputAttrs ?? {};
-			const { compatibilityClass, compatibilityStyle, forwardedAttributes } = splitCompatibilityAttributes(attrs);
-			return {
-				...forwardedAttributes,
-				...getPartAttrs("input", {
-					class: "rp-input__native",
-					compatibilityClass,
-					compatibilityStyle
-				}),
-				id: control.id,
-				name: props.name,
-				form: control.form ?? forwardedAttributes.form,
-				type: props.type,
-				value: controllable.value.value,
-				placeholder: props.placeholder,
-				disabled: control.disabled || void 0,
-				readonly: props.readonly || void 0,
-				required: control.required || void 0,
-				"aria-label": props.ariaLabel || void 0,
-				"aria-labelledby": control.ariaLabelledby,
-				"aria-describedby": control.ariaDescribedby,
-				"aria-invalid": control.invalid || void 0,
-				"aria-required": control.required || void 0,
-				"data-disabled": toPresenceAttribute(control.disabled),
-				"data-readonly": toPresenceAttribute(props.readonly),
-				"data-invalid": toPresenceAttribute(control.invalid),
-				onInput: composeEventHandlers(onInput, attrs.onInput)
-			};
-		});
-		__expose({
-			nativeElement: inputRef,
-			focus: () => inputRef.value?.focus()
-		});
-		const n9 = t1();
-		const n4 = child(n9, 1);
-		renderEffect(() => setDynamicProps(n9, [rootAttrs.value]));
-		setInsertionState(n9, 0);
-		createIf(() => $slots.left, () => {
-			const n3 = t0();
-			renderEffect(() => setDynamicProps(n3, [unref(getPartAttrs)("left", { class: "rp-input__left" })]));
-			setInsertionState(n3, null, 0);
-			createSlot("left", null, null, 1);
-			return n3;
-		});
-		setStaticTemplateRef(n4, inputRef, null, "inputRef");
-		renderEffect(() => setDynamicProps(n4, [nativeInputAttrs.value]));
-		setInsertionState(n9, null, 2);
-		createIf(() => $slots.right, () => {
-			const n8 = t0();
-			renderEffect(() => setDynamicProps(n8, [unref(getPartAttrs)("right", { class: "rp-input__right" })]));
-			setInsertionState(n8, null, 0);
-			createSlot("right", null, null, 1);
-			return n8;
-		});
-		return n9;
-	}
-}), [["__scopeId", "data-v-803913b6"]]);
-//#endregion
-export { input_default as t };

package/dist/input2.js

@@ -1,9 +0,0 @@
-//#region src/components/input/types.ts
-var inputParts = [
-	"root",
-	"input",
-	"left",
-	"right"
-];
-//#endregion
-export { inputParts as t };

package/dist/interactive.js

@@ -1,18 +0,0 @@
-import { t as isElement } from "./query.js";
-//#region src/utils/dom/interactive.ts
-var INTERACTIVE_ELEMENT_SELECTOR = [
-	"button",
-	"a[href]",
-	"input",
-	"select",
-	"textarea",
-	"[contenteditable=\"true\"]",
-	"[tabindex]:not([tabindex=\"-1\"])"
-].join(",");
-function isInteractiveElement(target, ignoredSelector) {
-	if (!isElement(target)) return false;
-	const interactiveElement = target.closest(INTERACTIVE_ELEMENT_SELECTOR);
-	return Boolean(interactiveElement && (!ignoredSelector || !interactiveElement.matches(ignoredSelector)));
-}
-//#endregion
-export { isInteractiveElement as t };

package/dist/internal/composables/useOverlayLayer.d.ts

@@ -1,44 +0,0 @@
-import { ComputedRef, MaybeRefOrGetter, Ref, ShallowRef } from 'vue';
-export interface OverlayLayerInteraction {
-    inside?: MaybeRefOrGetter<readonly (Element | null | undefined)[]>;
-    escapeKeyDown?: (event: KeyboardEvent) => void;
-    pointerDownOutside?: (event: PointerEvent) => void;
-    focusOutside?: (event: FocusEvent) => void;
-    clickOutside?: (event: MouseEvent) => void;
-}
-export interface OverlayLayerInteractionConnection {
-    (): void;
-    refresh: () => void;
-}
-export interface OverlayLayerContext {
-    id: symbol;
-    element: Ref<HTMLElement | null>;
-    active: ComputedRef<boolean>;
-    modal: ComputedRef<boolean>;
-    modalEffects: boolean;
-    preventScroll: ComputedRef<boolean>;
-    branches: Readonly<ShallowRef<readonly HTMLElement[]>>;
-    focusBranches: Readonly<ShallowRef<readonly HTMLElement[]>>;
-    zIndex: Readonly<Ref<number>>;
-    isTopLayer: () => boolean;
-    isInside: (event: Event, additional?: readonly (Element | null | undefined)[]) => boolean;
-    registerBranch: (element: HTMLElement, options?: {
-        focus?: boolean;
-        inside?: boolean;
-    }) => () => void;
-    connectInteraction: (interaction: OverlayLayerInteraction) => OverlayLayerInteractionConnection;
-}
-export interface UseOverlayLayerOptions {
-    active: MaybeRefOrGetter<boolean>;
-    element: Ref<HTMLElement | null>;
-    modal?: MaybeRefOrGetter<boolean>;
-    modalEffects?: boolean;
-    preventScroll?: MaybeRefOrGetter<boolean>;
-    baseZIndex?: MaybeRefOrGetter<number>;
-}
-export declare function useOverlayLayer(options: UseOverlayLayerOptions): OverlayLayerContext;
-export declare function useOverlayLayerBranch(element: Ref<HTMLElement | null>, options?: {
-    focus?: boolean;
-    inside?: boolean;
-}): OverlayLayerContext | null;
-export declare function useParentOverlayLayer(): OverlayLayerContext | null;

package/dist/minus.js

@@ -1,12 +0,0 @@
-import { defineVaporComponent, markRaw, template } from "vue";
-//#region ~icons/lucide/minus
-var t0 = template("<svg viewBox=\"0 0 24 24\"width=1.2em height=1.2em><path fill=none stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2 d=\"M5 12h14\">", 3, 1);
-function render(_ctx) {
-	return t0();
-}
-var minus_default = markRaw(defineVaporComponent({
-	name: "lucide-minus",
-	render
-}));
-//#endregion
-export { minus_default as t };

package/dist/modal.css

@@ -1,135 +0,0 @@
-@layer ropav.components {
-.rp-modal[data-v-bb0b8ca8] {
-    --_rp-modal-width: 32rem;
-    --_rp-modal-max-height: calc(100vh - var(--rp-spacing-12));
-    --_rp-modal-radius: var(--rp-radius-sm);
-    position: fixed;
-    inset: 0;
-    z-index: var(--rp-z-index-tooltip);
-    box-sizing: border-box;
-    display: grid;
-    place-items: center;
-    padding: var(--rp-spacing-6);
-    overflow: auto;
-    font-family: var(--rp-font-family);
-}
-.rp-modal--size-sm[data-v-bb0b8ca8] {
-    --_rp-modal-width: 22rem;
-}
-.rp-modal--size-lg[data-v-bb0b8ca8] {
-    --_rp-modal-width: 45rem;
-}
-.rp-modal--size-xl[data-v-bb0b8ca8] {
-    --_rp-modal-width: 58rem;
-}
-.rp-modal--size-full[data-v-bb0b8ca8] {
-    --_rp-modal-width: 100vw;
-    --_rp-modal-max-height: 100vh;
-    --_rp-modal-radius: var(--rp-radius-none);
-    padding: 0;
-}
-.rp-modal__overlay[data-v-bb0b8ca8] {
-    border-radius: 0;
-}
-.rp-modal__panel[data-v-bb0b8ca8] {
-    position: relative;
-    z-index: 1;
-    box-sizing: border-box;
-    display: flex;
-    flex-direction: column;
-    width: min(var(--_rp-modal-width), 100%);
-    max-height: var(--_rp-modal-max-height);
-    color: var(--rp-color-text);
-    overflow: hidden;
-    background-color: var(--rp-color-default);
-    border: var(--rp-border-width-thin) solid var(--rp-color-default-border);
-    border-radius: var(--_rp-modal-radius);
-    box-shadow: var(--rp-shadow-lg);
-    outline: none;
-}
-.rp-modal--size-full .rp-modal__panel[data-v-bb0b8ca8] {
-    min-height: 100vh;
-    border: 0;
-}
-.rp-modal__header[data-v-bb0b8ca8] {
-    box-sizing: border-box;
-    padding: var(--rp-spacing-5) calc(var(--rp-spacing-6) + var(--rp-size-control-sm)) var(--rp-spacing-4) var(--rp-spacing-5);
-    border-bottom: var(--rp-border-width-thin) solid var(--rp-color-default-border);
-}
-.rp-modal__heading[data-v-bb0b8ca8] {
-    display: grid;
-    gap: var(--rp-spacing-1);
-}
-.rp-modal__title[data-v-bb0b8ca8] {
-    margin: 0;
-    color: var(--rp-color-text);
-    font-size: var(--rp-font-size-xl);
-    font-weight: var(--rp-font-weight-semibold);
-    line-height: var(--rp-line-height-xs);
-}
-.rp-modal__description[data-v-bb0b8ca8] {
-    margin: 0;
-    color: var(--rp-color-dimmed);
-    font-size: var(--rp-font-size-sm);
-    line-height: var(--rp-line-height-md);
-}
-.rp-modal__close[data-v-bb0b8ca8] {
-    position: absolute;
-    top: var(--rp-spacing-3);
-    right: var(--rp-spacing-3);
-    z-index: 1;
-}
-.rp-modal__body[data-v-bb0b8ca8] {
-    box-sizing: border-box;
-    flex: 1 1 auto;
-    min-height: 0;
-    padding: var(--rp-spacing-5);
-    color: var(--rp-color-text);
-    font-size: var(--rp-font-size-md);
-    line-height: var(--rp-line-height-md);
-}
-.rp-modal--closable.rp-modal--headerless .rp-modal__body[data-v-bb0b8ca8] {
-    padding-right: calc(var(--rp-spacing-6) + var(--rp-size-control-sm));
-}
-.rp-modal__footer[data-v-bb0b8ca8] {
-    box-sizing: border-box;
-    display: flex;
-    flex: 0 0 auto;
-    flex-wrap: wrap;
-    gap: var(--rp-spacing-2);
-    justify-content: flex-end;
-    padding: var(--rp-spacing-4) var(--rp-spacing-5);
-    border-top: var(--rp-border-width-thin) solid var(--rp-color-default-border);
-}
-.rp-modal-enter-active[data-v-bb0b8ca8],
-  .rp-modal-leave-active[data-v-bb0b8ca8] {
-    transition: opacity var(--rp-transition-fast);
-}
-.rp-modal-enter-active .rp-modal__panel[data-v-bb0b8ca8],
-  .rp-modal-leave-active .rp-modal__panel[data-v-bb0b8ca8] {
-    transition: opacity var(--rp-transition-fast), transform var(--rp-transition-fast);
-}
-.rp-modal-enter-from[data-v-bb0b8ca8],
-  .rp-modal-leave-to[data-v-bb0b8ca8] {
-    opacity: 0;
-}
-.rp-modal-enter-from .rp-modal__panel[data-v-bb0b8ca8],
-  .rp-modal-leave-to .rp-modal__panel[data-v-bb0b8ca8] {
-    opacity: 0;
-    transform: translateY(var(--rp-spacing-2)) scale(0.98);
-}
-@media (max-width: 480px) {
-.rp-modal[data-v-bb0b8ca8] {
-      padding: var(--rp-spacing-3);
-}
-.rp-modal__header[data-v-bb0b8ca8] {
-      padding-left: var(--rp-spacing-4);
-}
-.rp-modal__body[data-v-bb0b8ca8] {
-      padding: var(--rp-spacing-4);
-}
-.rp-modal__footer[data-v-bb0b8ca8] {
-      padding: var(--rp-spacing-4);
-}
-}
-}