morya-ui 0.4.4 → 0.5.0

package/dist/components/OrderList/styles.css

@@ -1,4 +1,7 @@
-/* —— Data: OrderList —— */
+/* —— Data: OrderList ——
+ * Shared list/item/scrollbar visuals live in styles/base.css (with PickList).
+ * Only OrderList-specific layout, drag affordance, and motion live here.
+ */
 .m-orderlist {
     display: flex;
     gap: var(--m-space-2);
@@ -18,14 +21,21 @@
 
 .m-orderlist__item {
     align-items: center;
-    border-radius: var(--m-radius-sm);
     display: flex;
     gap: var(--m-space-2);
 }
 
-.m-orderlist__item:focus-visible {
-    box-shadow: var(--m-focus-shadow);
-    outline: none;
+.m-orderlist__item--disabled {
+    color: var(--m-color-text-disabled);
+    cursor: not-allowed;
+}
+
+.m-orderlist__item--disabled:hover {
+    background: transparent;
+}
+
+.m-orderlist--disabled .m-orderlist__handle {
+    cursor: not-allowed;
 }
 
 .m-orderlist__handle {
@@ -39,17 +49,60 @@
     padding: 0;
 }
 
-.m-orderlist__handle:active {
+.m-orderlist__handle:disabled {
+    cursor: not-allowed;
+    opacity: var(--m-opacity-disabled);
+}
+
+.m-orderlist__handle:not(:disabled):active {
     cursor: grabbing;
 }
 
+.m-orderlist__label {
+    flex: 1 1 auto;
+    min-width: 0;
+}
+
+/* Drag source: dimmed placeholder left in the list. */
 .m-orderlist__ghost {
     background: color-mix(in srgb, var(--m-color-primary) 10%, var(--m-color-surface));
     opacity: var(--m-opacity-disabled);
 }
 
+/* Insertion indicator: a line above (moving up) or below (moving down) the target. */
 .m-orderlist__drop-target {
-    box-shadow: inset 0 0 0 1px var(--m-color-primary);
+    position: relative;
+}
+
+.m-orderlist__drop-target::after {
+    background: var(--m-color-primary);
+    border-radius: 1px;
+    content: '';
+    height: 2px;
+    left: var(--m-space-1);
+    position: absolute;
+    right: var(--m-space-1);
+}
+
+.m-orderlist__drop-before::after {
+    top: 0;
+}
+
+.m-orderlist__drop-after::after {
+    bottom: 0;
+}
+
+/* Drag preview that follows the pointer (cloned from the source row). */
+.m-orderlist__drag-preview {
+    background: var(--m-color-surface);
+    border-radius: var(--m-radius-sm);
+    box-shadow: var(--m-shadow-md);
+    left: -9999px;
+    opacity: 0.9;
+    pointer-events: none;
+    position: fixed;
+    top: -9999px;
+    z-index: var(--m-z-tooltip);
 }
 
 .m-orderlist__message {
@@ -67,3 +120,23 @@
     font-size: var(--m-font-size-sm);
     line-height: 1.5;
 }
+
+/* Reorder FLIP animation (TransitionGroup move). Respects reduced motion. */
+.m-orderlist-move {
+    transition: transform var(--m-motion-normal) var(--m-motion-ease);
+}
+
+.m-orderlist-leave-active {
+    transition: opacity var(--m-motion-fast) var(--m-motion-ease);
+}
+
+.m-orderlist-leave-to {
+    opacity: 0;
+}
+
+@media (prefers-reduced-motion: reduce) {
+    .m-orderlist-move,
+    .m-orderlist-leave-active {
+        transition: none;
+    }
+}

package/dist/components/OrderList/types.d.ts

@@ -1,16 +1,33 @@
-import { RootPassThrough } from '../../shared/passThrough';
+import { PassThroughPart, RootPassThrough } from '../../shared/passThrough';
+/** Reorder detail emitted alongside `update:modelValue`. */
+export interface OrderListReorderPayload {
+    /** The moved item. */
+    item: unknown;
+    /** Original index. */
+    from: number;
+    /** New index. */
+    to: number;
+}
+/** OrderList pass-through parts. */
+export type OrderListPassThrough = RootPassThrough & Partial<Record<'controls' | 'list' | 'item' | 'handle' | 'label', PassThroughPart>>;
 export interface OrderListProps {
-    pt?: RootPassThrough;
+    pt?: OrderListPassThrough;
     modelValue?: unknown[];
+    /** Controlled selected index. Use with `v-model:selection`. */
+    selection?: number | null;
     dataKey?: string;
     listStyle?: string | Record<string, string>;
     /** Enable drag-and-drop reorder. Defaults to true. */
     dragdrop?: boolean;
+    /** Disable all interactions (buttons, drag, selection). */
+    disabled?: boolean;
     /** Empty state message; defaults to locale `emptyMessage`. */
     emptyMessage?: string;
 }
 export interface OrderListEmits {
     (event: 'update:modelValue', value: unknown[]): void;
-    (event: 'reorder', value: unknown[]): void;
+    (event: 'update:selection', value: number | null): void;
+    /** Fired after a reorder with the move detail (new order goes to `update:modelValue`). */
+    (event: 'reorder', payload: OrderListReorderPayload): void;
 }
 //# sourceMappingURL=types.d.ts.map

package/dist/components/OrderList/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/OrderList/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAA;AAC/D,MAAM,WAAW,cAAc;IAC7B,EAAE,CAAC,EAAE,eAAe,CAAA;IACpB,UAAU,CAAC,EAAE,OAAO,EAAE,CAAA;IACtB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAC3C,sDAAsD;IACtD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,8DAA8D;IAC9D,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,MAAM,WAAW,cAAc;IAC7B,CAAC,KAAK,EAAE,mBAAmB,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,IAAI,CAAA;IACpD,CAAC,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,IAAI,CAAA;CAC3C"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/OrderList/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAA;AAEhF,4DAA4D;AAC5D,MAAM,WAAW,uBAAuB;IACtC,sBAAsB;IACtB,IAAI,EAAE,OAAO,CAAA;IACb,sBAAsB;IACtB,IAAI,EAAE,MAAM,CAAA;IACZ,iBAAiB;IACjB,EAAE,EAAE,MAAM,CAAA;CACX;AAED,oCAAoC;AACpC,MAAM,MAAM,oBAAoB,GAAG,eAAe,GAChD,OAAO,CAAC,MAAM,CAAC,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,EAAE,eAAe,CAAC,CAAC,CAAA;AAErF,MAAM,WAAW,cAAc;IAC7B,EAAE,CAAC,EAAE,oBAAoB,CAAA;IACzB,UAAU,CAAC,EAAE,OAAO,EAAE,CAAA;IACtB,+DAA+D;IAC/D,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAC3C,sDAAsD;IACtD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,8DAA8D;IAC9D,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,MAAM,WAAW,cAAc;IAC7B,CAAC,KAAK,EAAE,mBAAmB,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,IAAI,CAAA;IACpD,CAAC,KAAK,EAAE,kBAAkB,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,CAAA;IACvD,0FAA0F;IAC1F,CAAC,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,uBAAuB,GAAG,IAAI,CAAA;CAC3D"}