@hyperfixi/behaviors 2.3.1 → 2.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/all.browser.global.js +26 -48
- package/dist/all.browser.global.js.map +1 -1
- package/dist/behaviors/autodismiss.d.cts +1 -1
- package/dist/behaviors/autodismiss.d.ts +1 -1
- package/dist/behaviors/clickoutside.d.cts +1 -1
- package/dist/behaviors/clickoutside.d.ts +1 -1
- package/dist/behaviors/clipboard.d.cts +1 -1
- package/dist/behaviors/clipboard.d.ts +1 -1
- package/dist/behaviors/draggable.d.cts +1 -1
- package/dist/behaviors/draggable.d.ts +1 -1
- package/dist/behaviors/focustrap.d.cts +1 -1
- package/dist/behaviors/focustrap.d.ts +1 -1
- package/dist/behaviors/removable.d.cts +1 -1
- package/dist/behaviors/removable.d.ts +1 -1
- package/dist/behaviors/resizable.cjs +12 -34
- package/dist/behaviors/resizable.cjs.map +1 -1
- package/dist/behaviors/resizable.d.cts +1 -1
- package/dist/behaviors/resizable.d.ts +1 -1
- package/dist/behaviors/resizable.js +2 -2
- package/dist/behaviors/scrollreveal.d.cts +1 -1
- package/dist/behaviors/scrollreveal.d.ts +1 -1
- package/dist/behaviors/sortable.cjs +7 -21
- package/dist/behaviors/sortable.cjs.map +1 -1
- package/dist/behaviors/sortable.d.cts +1 -1
- package/dist/behaviors/sortable.d.ts +1 -1
- package/dist/behaviors/sortable.js +2 -2
- package/dist/behaviors/tabs.d.cts +1 -1
- package/dist/behaviors/tabs.d.ts +1 -1
- package/dist/behaviors/toggleable.d.cts +1 -1
- package/dist/behaviors/toggleable.d.ts +1 -1
- package/dist/{chunk-MVNHMYIK.js → chunk-BBIIOGMF.js} +3 -3
- package/dist/{chunk-TLLGH5KX.js → chunk-IMDFEGIT.js} +3 -3
- package/dist/{chunk-TLLGH5KX.js.map → chunk-IMDFEGIT.js.map} +1 -1
- package/dist/{chunk-IQM32TEY.js → chunk-IT6TYVMW.js} +3 -3
- package/dist/{chunk-IQM32TEY.js.map → chunk-IT6TYVMW.js.map} +1 -1
- package/dist/{chunk-NC6I6T7T.js → chunk-V2M4W3LO.js} +7 -21
- package/dist/chunk-V2M4W3LO.js.map +1 -0
- package/dist/{chunk-U5GNXZUF.js → chunk-ZBSWTV6I.js} +12 -34
- package/dist/chunk-ZBSWTV6I.js.map +1 -0
- package/dist/index.cjs +19 -55
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +5 -5
- package/dist/loaders.cjs +19 -55
- package/dist/loaders.cjs.map +1 -1
- package/dist/loaders.js +3 -3
- package/dist/registry.d.cts +1 -1
- package/dist/registry.d.ts +1 -1
- package/dist/resizable.browser.global.js +13 -28
- package/dist/resizable.browser.global.js.map +1 -1
- package/dist/resolver.browser.global.js +20 -42
- package/dist/resolver.browser.global.js.map +1 -1
- package/dist/schemas/index.cjs +17 -53
- package/dist/schemas/index.cjs.map +1 -1
- package/dist/schemas/index.d.cts +2 -2
- package/dist/schemas/index.d.ts +2 -2
- package/dist/schemas/index.js +2 -2
- package/dist/sortable.browser.global.js +8 -15
- package/dist/sortable.browser.global.js.map +1 -1
- package/dist/{types-DCCtVQS5.d.ts → types-BY-jB5FV.d.cts} +1 -1
- package/dist/{types-DCCtVQS5.d.cts → types-BY-jB5FV.d.ts} +1 -1
- package/package.json +4 -4
- package/src/behaviors/resizable.ts +1 -1
- package/src/behaviors/sortable.ts +1 -1
- package/src/browser-resolver-bundle.ts +1 -1
- package/src/schemas/resizable.schema.ts +11 -33
- package/src/schemas/sortable.schema.ts +6 -20
- package/dist/chunk-NC6I6T7T.js.map +0 -1
- package/dist/chunk-U5GNXZUF.js.map +0 -1
- /package/dist/{chunk-MVNHMYIK.js.map → chunk-BBIIOGMF.js.map} +0 -0
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { b as BehaviorSchema, L as LokaScriptInstance } from '../types-BY-jB5FV.cjs';
|
|
2
2
|
|
|
3
3
|
declare const clickOutsideSource: string;
|
|
4
4
|
declare const clickOutsideMetadata: BehaviorSchema;
|
|
@@ -35,13 +35,6 @@ var resizableSchema = {
|
|
|
35
35
|
version: "1.0.0",
|
|
36
36
|
description: "Makes elements resizable by dragging",
|
|
37
37
|
parameters: [
|
|
38
|
-
{
|
|
39
|
-
name: "handle",
|
|
40
|
-
type: "selector",
|
|
41
|
-
optional: true,
|
|
42
|
-
default: "me",
|
|
43
|
-
description: "CSS selector for the resize handle (defaults to the element itself)"
|
|
44
|
-
},
|
|
45
38
|
{
|
|
46
39
|
name: "minWidth",
|
|
47
40
|
type: "number",
|
|
@@ -77,25 +70,8 @@ var resizableSchema = {
|
|
|
77
70
|
{ name: "resizable:end", description: "Fired when resize completes" }
|
|
78
71
|
],
|
|
79
72
|
source: `
|
|
80
|
-
behavior Resizable(
|
|
81
|
-
|
|
82
|
-
if handle is undefined
|
|
83
|
-
set handle to me
|
|
84
|
-
end
|
|
85
|
-
if minWidth is undefined
|
|
86
|
-
set minWidth to 50
|
|
87
|
-
end
|
|
88
|
-
if minHeight is undefined
|
|
89
|
-
set minHeight to 50
|
|
90
|
-
end
|
|
91
|
-
if maxWidth is undefined
|
|
92
|
-
set maxWidth to 9999
|
|
93
|
-
end
|
|
94
|
-
if maxHeight is undefined
|
|
95
|
-
set maxHeight to 9999
|
|
96
|
-
end
|
|
97
|
-
end
|
|
98
|
-
on pointerdown(clientX, clientY) from handle
|
|
73
|
+
behavior Resizable(minWidth, minHeight, maxWidth, maxHeight)
|
|
74
|
+
on pointerdown(clientX, clientY) from me
|
|
99
75
|
halt the event
|
|
100
76
|
trigger resizable:start
|
|
101
77
|
measure width
|
|
@@ -105,13 +81,15 @@ behavior Resizable(handle, minWidth, minHeight, maxWidth, maxHeight)
|
|
|
105
81
|
set startX to clientX
|
|
106
82
|
set startY to clientY
|
|
107
83
|
repeat until event pointerup from document
|
|
108
|
-
wait for pointermove(clientX, clientY)
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
end
|
|
84
|
+
wait for pointermove(clientX, clientY) from document
|
|
85
|
+
set newWidth to startWidth + clientX - startX
|
|
86
|
+
set newHeight to startHeight + clientY - startY
|
|
87
|
+
if newWidth < minWidth then set newWidth to minWidth end
|
|
88
|
+
if newWidth > maxWidth then set newWidth to maxWidth end
|
|
89
|
+
if newHeight < minHeight then set newHeight to minHeight end
|
|
90
|
+
if newHeight > maxHeight then set newHeight to maxHeight end
|
|
91
|
+
set my style.width to newWidth + "px"
|
|
92
|
+
set my style.height to newHeight + "px"
|
|
115
93
|
trigger resizable:resize
|
|
116
94
|
end
|
|
117
95
|
trigger resizable:end
|
|
@@ -177,7 +155,7 @@ async function registerResizable(hyperfixi) {
|
|
|
177
155
|
const syntheticNode = {
|
|
178
156
|
type: "behavior",
|
|
179
157
|
name: "Resizable",
|
|
180
|
-
parameters: [
|
|
158
|
+
parameters: [],
|
|
181
159
|
eventHandlers: [],
|
|
182
160
|
imperativeInstaller: installResizable
|
|
183
161
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/behaviors/resizable.ts","../../src/schemas/resizable.schema.ts","../../src/schemas/types.ts"],"sourcesContent":["/**\n * Resizable Behavior — Imperative Implementation\n *\n * Makes elements resizable by dragging edges or corners.\n * Supports minimum/maximum dimensions and resize handles.\n *\n * @example\n * ```html\n * <div _=\"install Resizable\" style=\"width: 200px; height: 150px;\">\n * Resize me!\n * </div>\n * ```\n */\n\nimport { resizableSchema } from '../schemas/resizable.schema';\nimport type { LokaScriptInstance } from '../schemas/types';\nimport { resolveRuntime } from '../schemas/types';\n\n// Re-export schema-derived values for backwards compatibility\nexport const resizableSource = resizableSchema.source;\nexport const resizableMetadata = resizableSchema;\n\n/**\n * Imperative installer for Resizable behavior.\n */\nfunction installResizable(element: HTMLElement, params: Record<string, any>): void {\n // Resolve handle element\n let handleEl: HTMLElement = element;\n if (params.handle && params.handle !== 'me') {\n if (typeof params.handle === 'string') {\n const found = element.querySelector(params.handle);\n if (found instanceof HTMLElement) handleEl = found;\n } else if (params.handle instanceof HTMLElement) {\n handleEl = params.handle;\n }\n }\n\n const minW = params.minWidth ?? 50;\n const minH = params.minHeight ?? 50;\n const maxW = params.maxWidth ?? 9999;\n const maxH = params.maxHeight ?? 9999;\n\n handleEl.addEventListener('pointerdown', (e: PointerEvent) => {\n e.preventDefault();\n element.dispatchEvent(new CustomEvent('resizable:start', { bubbles: true }));\n\n const startWidth = element.offsetWidth;\n const startHeight = element.offsetHeight;\n const startX = e.clientX;\n const startY = e.clientY;\n\n function onMove(ev: PointerEvent) {\n const newWidth = Math.max(minW, Math.min(maxW, startWidth + (ev.clientX - startX)));\n const newHeight = Math.max(minH, Math.min(maxH, startHeight + (ev.clientY - startY)));\n\n element.style.width = `${newWidth}px`;\n element.style.height = `${newHeight}px`;\n element.dispatchEvent(new CustomEvent('resizable:resize', { bubbles: true }));\n }\n\n function onUp() {\n document.removeEventListener('pointermove', onMove);\n document.removeEventListener('pointerup', onUp);\n element.dispatchEvent(new CustomEvent('resizable:end', { bubbles: true }));\n }\n\n document.addEventListener('pointermove', onMove);\n document.addEventListener('pointerup', onUp);\n });\n}\n\n/**\n * Register the Resizable behavior with LokaScript.\n */\nexport async function registerResizable(hyperfixi?: LokaScriptInstance): Promise<void> {\n const hf = hyperfixi || resolveRuntime();\n\n if (!hf) {\n throw new Error(\n 'LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors.'\n );\n }\n\n const syntheticNode = {\n type: 'behavior',\n name: 'Resizable',\n parameters: ['handle', 'minWidth', 'minHeight', 'maxWidth', 'maxHeight'],\n eventHandlers: [],\n imperativeInstaller: installResizable,\n };\n const ctx = hf.createContext ? hf.createContext() : { locals: new Map(), globals: new Map() };\n await hf.execute(syntheticNode, ctx);\n}\n\n// Auto-register when loaded as a script tag\nif (resolveRuntime()) {\n registerResizable().catch(console.error);\n}\n\nexport default {\n source: resizableSchema.source,\n metadata: resizableSchema,\n register: registerResizable,\n};\n","import type { BehaviorSchema } from './types';\n\n/**\n * Resizable Behavior Schema\n *\n * Makes elements resizable by dragging edges or corners.\n * Supports minimum/maximum dimensions and resize handles.\n */\nexport const resizableSchema: BehaviorSchema = {\n name: 'Resizable',\n category: 'ui',\n tier: 'optional',\n version: '1.0.0',\n description: 'Makes elements resizable by dragging',\n parameters: [\n {\n name: 'handle',\n type: 'selector',\n optional: true,\n default: 'me',\n description: 'CSS selector for the resize handle (defaults to the element itself)',\n },\n {\n name: 'minWidth',\n type: 'number',\n optional: true,\n default: 50,\n description: 'Minimum width in pixels',\n },\n {\n name: 'minHeight',\n type: 'number',\n optional: true,\n default: 50,\n description: 'Minimum height in pixels',\n },\n {\n name: 'maxWidth',\n type: 'number',\n optional: true,\n default: 9999,\n description: 'Maximum width in pixels',\n },\n {\n name: 'maxHeight',\n type: 'number',\n optional: true,\n default: 9999,\n description: 'Maximum height in pixels',\n },\n ],\n events: [\n { name: 'resizable:start', description: 'Fired when resize begins' },\n { name: 'resizable:resize', description: 'Fired during resize' },\n { name: 'resizable:end', description: 'Fired when resize completes' },\n ],\n source: `\nbehavior Resizable(handle, minWidth, minHeight, maxWidth, maxHeight)\n init\n if handle is undefined\n set handle to me\n end\n if minWidth is undefined\n set minWidth to 50\n end\n if minHeight is undefined\n set minHeight to 50\n end\n if maxWidth is undefined\n set maxWidth to 9999\n end\n if maxHeight is undefined\n set maxHeight to 9999\n end\n end\n on pointerdown(clientX, clientY) from handle\n halt the event\n trigger resizable:start\n measure width\n set startWidth to it\n measure height\n set startHeight to it\n set startX to clientX\n set startY to clientY\n repeat until event pointerup from document\n wait for pointermove(clientX, clientY) or pointerup from document\n js(startWidth, startHeight, clientX, clientY, startX, startY, minWidth, maxWidth, minHeight, maxHeight, me)\n var nw = Math.max(minWidth, Math.min(maxWidth, startWidth + (clientX - startX)));\n var nh = Math.max(minHeight, Math.min(maxHeight, startHeight + (clientY - startY)));\n me.style.width = nw + 'px';\n me.style.height = nh + 'px';\n end\n trigger resizable:resize\n end\n trigger resizable:end\n end\nend\n`.trim(),\n};\n","/**\n * Behavior Schema Types\n *\n * Defines the structure for behavior metadata used for:\n * - Code generation (TypeScript types, documentation)\n * - Runtime categorization and lazy loading\n * - Tooling and IDE integration\n */\n\n/**\n * Behavior categories for organization.\n * - ui: Visual interaction behaviors (drag, resize, sort)\n * - data: Data manipulation behaviors (remove, transform)\n * - animation: Animation and transition behaviors\n * - form: Form-related behaviors (validation, toggle states)\n * - layout: Layout behaviors (sticky, scrollspy)\n */\nexport type BehaviorCategory = 'ui' | 'data' | 'animation' | 'form' | 'layout';\n\n/**\n * Loading tiers for lazy loading optimization.\n * - core: Always loaded (essential behaviors)\n * - common: High usage (loaded for typical apps)\n * - optional: Low usage (loaded on demand)\n */\nexport type BehaviorTier = 'core' | 'common' | 'optional';\n\n/**\n * Schema for a behavior parameter.\n */\nexport interface ParameterSchema {\n name: string;\n type: 'string' | 'number' | 'boolean' | 'selector' | 'element';\n optional?: boolean;\n default?: string | number | boolean;\n /** Allowed values for constrained parameters */\n enum?: string[];\n description: string;\n}\n\n/**\n * Schema for a behavior event.\n */\nexport interface EventSchema {\n name: string;\n description: string;\n}\n\n/**\n * Complete schema for a behavior.\n * This is the source of truth for all behavior metadata.\n */\nexport interface BehaviorSchema {\n /** Behavior name (PascalCase) */\n name: string;\n /** Category for organization */\n category: BehaviorCategory;\n /** Loading tier for lazy loading */\n tier: BehaviorTier;\n /** Semantic version */\n version: string;\n /** Human-readable description */\n description: string;\n /** Parameter definitions */\n parameters: ParameterSchema[];\n /** Event definitions */\n events: EventSchema[];\n /** The hyperscript behavior source code */\n source: string;\n /** Optional requirements or notes */\n requirements?: string[];\n}\n\n/**\n * Runtime behavior module interface.\n * This is what gets registered with the hyperfixi runtime.\n */\nexport interface BehaviorModule {\n source: string;\n metadata: BehaviorSchema;\n register: (hyperfixi?: LokaScriptInstance) => Promise<void>;\n}\n\n/**\n * Minimal LokaScript instance interface for behavior registration.\n */\nexport interface LokaScriptInstance {\n compileSync: (\n code: string,\n options?: { traditional?: boolean; language?: string }\n ) => {\n ok: boolean;\n ast?: unknown;\n errors?: Array<{ message: string; line?: number; column?: number }>;\n };\n execute: (ast: unknown, ctx: unknown) => Promise<unknown>;\n createContext?: () => { locals: Map<string, unknown>; globals: Map<string, unknown> };\n}\n\n/**\n * Typed window interface for behavior auto-registration.\n * Avoids `(window as any)` casts throughout the codebase.\n * Checks both `window.lokascript` and `window.hyperfixi` for the runtime instance.\n */\nexport interface LokaScriptWindow {\n lokascript?: LokaScriptInstance;\n hyperfixi?: LokaScriptInstance;\n __hyperfixi_behaviors_ready?: Promise<void> | undefined;\n}\n\n/**\n * Resolve the LokaScript runtime from window globals.\n * Checks both `window.lokascript` and `window.hyperfixi`.\n */\nexport function resolveRuntime(): LokaScriptInstance | null {\n if (typeof window === 'undefined') return null;\n const win = window as unknown as LokaScriptWindow;\n return win.lokascript || win.hyperfixi || null;\n}\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/behaviors/resizable.ts","../../src/schemas/resizable.schema.ts","../../src/schemas/types.ts"],"sourcesContent":["/**\n * Resizable Behavior — Imperative Implementation\n *\n * Makes elements resizable by dragging edges or corners.\n * Supports minimum/maximum dimensions and resize handles.\n *\n * @example\n * ```html\n * <div _=\"install Resizable\" style=\"width: 200px; height: 150px;\">\n * Resize me!\n * </div>\n * ```\n */\n\nimport { resizableSchema } from '../schemas/resizable.schema';\nimport type { LokaScriptInstance } from '../schemas/types';\nimport { resolveRuntime } from '../schemas/types';\n\n// Re-export schema-derived values for backwards compatibility\nexport const resizableSource = resizableSchema.source;\nexport const resizableMetadata = resizableSchema;\n\n/**\n * Imperative installer for Resizable behavior.\n */\nfunction installResizable(element: HTMLElement, params: Record<string, any>): void {\n // Resolve handle element\n let handleEl: HTMLElement = element;\n if (params.handle && params.handle !== 'me') {\n if (typeof params.handle === 'string') {\n const found = element.querySelector(params.handle);\n if (found instanceof HTMLElement) handleEl = found;\n } else if (params.handle instanceof HTMLElement) {\n handleEl = params.handle;\n }\n }\n\n const minW = params.minWidth ?? 50;\n const minH = params.minHeight ?? 50;\n const maxW = params.maxWidth ?? 9999;\n const maxH = params.maxHeight ?? 9999;\n\n handleEl.addEventListener('pointerdown', (e: PointerEvent) => {\n e.preventDefault();\n element.dispatchEvent(new CustomEvent('resizable:start', { bubbles: true }));\n\n const startWidth = element.offsetWidth;\n const startHeight = element.offsetHeight;\n const startX = e.clientX;\n const startY = e.clientY;\n\n function onMove(ev: PointerEvent) {\n const newWidth = Math.max(minW, Math.min(maxW, startWidth + (ev.clientX - startX)));\n const newHeight = Math.max(minH, Math.min(maxH, startHeight + (ev.clientY - startY)));\n\n element.style.width = `${newWidth}px`;\n element.style.height = `${newHeight}px`;\n element.dispatchEvent(new CustomEvent('resizable:resize', { bubbles: true }));\n }\n\n function onUp() {\n document.removeEventListener('pointermove', onMove);\n document.removeEventListener('pointerup', onUp);\n element.dispatchEvent(new CustomEvent('resizable:end', { bubbles: true }));\n }\n\n document.addEventListener('pointermove', onMove);\n document.addEventListener('pointerup', onUp);\n });\n}\n\n/**\n * Register the Resizable behavior with LokaScript.\n */\nexport async function registerResizable(hyperfixi?: LokaScriptInstance): Promise<void> {\n const hf = hyperfixi || resolveRuntime();\n\n if (!hf) {\n throw new Error(\n 'LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors.'\n );\n }\n\n const syntheticNode = {\n type: 'behavior',\n name: 'Resizable',\n parameters: [],\n eventHandlers: [],\n imperativeInstaller: installResizable,\n };\n const ctx = hf.createContext ? hf.createContext() : { locals: new Map(), globals: new Map() };\n await hf.execute(syntheticNode, ctx);\n}\n\n// Auto-register when loaded as a script tag\nif (resolveRuntime()) {\n registerResizable().catch(console.error);\n}\n\nexport default {\n source: resizableSchema.source,\n metadata: resizableSchema,\n register: registerResizable,\n};\n","import type { BehaviorSchema } from './types';\n\n/**\n * Resizable Behavior Schema\n *\n * Makes elements resizable by dragging edges or corners.\n * Supports minimum/maximum dimensions and resize handles.\n */\nexport const resizableSchema: BehaviorSchema = {\n name: 'Resizable',\n category: 'ui',\n tier: 'optional',\n version: '1.0.0',\n description: 'Makes elements resizable by dragging',\n parameters: [\n {\n name: 'minWidth',\n type: 'number',\n optional: true,\n default: 50,\n description: 'Minimum width in pixels',\n },\n {\n name: 'minHeight',\n type: 'number',\n optional: true,\n default: 50,\n description: 'Minimum height in pixels',\n },\n {\n name: 'maxWidth',\n type: 'number',\n optional: true,\n default: 9999,\n description: 'Maximum width in pixels',\n },\n {\n name: 'maxHeight',\n type: 'number',\n optional: true,\n default: 9999,\n description: 'Maximum height in pixels',\n },\n ],\n events: [\n { name: 'resizable:start', description: 'Fired when resize begins' },\n { name: 'resizable:resize', description: 'Fired during resize' },\n { name: 'resizable:end', description: 'Fired when resize completes' },\n ],\n source: `\nbehavior Resizable(minWidth, minHeight, maxWidth, maxHeight)\n on pointerdown(clientX, clientY) from me\n halt the event\n trigger resizable:start\n measure width\n set startWidth to it\n measure height\n set startHeight to it\n set startX to clientX\n set startY to clientY\n repeat until event pointerup from document\n wait for pointermove(clientX, clientY) from document\n set newWidth to startWidth + clientX - startX\n set newHeight to startHeight + clientY - startY\n if newWidth < minWidth then set newWidth to minWidth end\n if newWidth > maxWidth then set newWidth to maxWidth end\n if newHeight < minHeight then set newHeight to minHeight end\n if newHeight > maxHeight then set newHeight to maxHeight end\n set my style.width to newWidth + \"px\"\n set my style.height to newHeight + \"px\"\n trigger resizable:resize\n end\n trigger resizable:end\n end\nend\n`.trim(),\n};\n","/**\n * Behavior Schema Types\n *\n * Defines the structure for behavior metadata used for:\n * - Code generation (TypeScript types, documentation)\n * - Runtime categorization and lazy loading\n * - Tooling and IDE integration\n */\n\n/**\n * Behavior categories for organization.\n * - ui: Visual interaction behaviors (drag, resize, sort)\n * - data: Data manipulation behaviors (remove, transform)\n * - animation: Animation and transition behaviors\n * - form: Form-related behaviors (validation, toggle states)\n * - layout: Layout behaviors (sticky, scrollspy)\n */\nexport type BehaviorCategory = 'ui' | 'data' | 'animation' | 'form' | 'layout';\n\n/**\n * Loading tiers for lazy loading optimization.\n * - core: Always loaded (essential behaviors)\n * - common: High usage (loaded for typical apps)\n * - optional: Low usage (loaded on demand)\n */\nexport type BehaviorTier = 'core' | 'common' | 'optional';\n\n/**\n * Schema for a behavior parameter.\n */\nexport interface ParameterSchema {\n name: string;\n type: 'string' | 'number' | 'boolean' | 'selector' | 'element';\n optional?: boolean;\n default?: string | number | boolean;\n /** Allowed values for constrained parameters */\n enum?: string[];\n description: string;\n}\n\n/**\n * Schema for a behavior event.\n */\nexport interface EventSchema {\n name: string;\n description: string;\n}\n\n/**\n * Complete schema for a behavior.\n * This is the source of truth for all behavior metadata.\n */\nexport interface BehaviorSchema {\n /** Behavior name (PascalCase) */\n name: string;\n /** Category for organization */\n category: BehaviorCategory;\n /** Loading tier for lazy loading */\n tier: BehaviorTier;\n /** Semantic version */\n version: string;\n /** Human-readable description */\n description: string;\n /** Parameter definitions */\n parameters: ParameterSchema[];\n /** Event definitions */\n events: EventSchema[];\n /** The hyperscript behavior source code */\n source: string;\n /** Optional requirements or notes */\n requirements?: string[];\n}\n\n/**\n * Runtime behavior module interface.\n * This is what gets registered with the hyperfixi runtime.\n */\nexport interface BehaviorModule {\n source: string;\n metadata: BehaviorSchema;\n register: (hyperfixi?: LokaScriptInstance) => Promise<void>;\n}\n\n/**\n * Minimal LokaScript instance interface for behavior registration.\n */\nexport interface LokaScriptInstance {\n compileSync: (\n code: string,\n options?: { traditional?: boolean; language?: string }\n ) => {\n ok: boolean;\n ast?: unknown;\n errors?: Array<{ message: string; line?: number; column?: number }>;\n };\n execute: (ast: unknown, ctx: unknown) => Promise<unknown>;\n createContext?: () => { locals: Map<string, unknown>; globals: Map<string, unknown> };\n}\n\n/**\n * Typed window interface for behavior auto-registration.\n * Avoids `(window as any)` casts throughout the codebase.\n * Checks both `window.lokascript` and `window.hyperfixi` for the runtime instance.\n */\nexport interface LokaScriptWindow {\n lokascript?: LokaScriptInstance;\n hyperfixi?: LokaScriptInstance;\n __hyperfixi_behaviors_ready?: Promise<void> | undefined;\n}\n\n/**\n * Resolve the LokaScript runtime from window globals.\n * Checks both `window.lokascript` and `window.hyperfixi`.\n */\nexport function resolveRuntime(): LokaScriptInstance | null {\n if (typeof window === 'undefined') return null;\n const win = window as unknown as LokaScriptWindow;\n return win.lokascript || win.hyperfixi || null;\n}\n"],"mappings":"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","names":[]}
|
|
@@ -3,8 +3,8 @@ import {
|
|
|
3
3
|
resizableMetadata,
|
|
4
4
|
resizableSource,
|
|
5
5
|
resizable_default
|
|
6
|
-
} from "../chunk-
|
|
7
|
-
import "../chunk-
|
|
6
|
+
} from "../chunk-IT6TYVMW.js";
|
|
7
|
+
import "../chunk-ZBSWTV6I.js";
|
|
8
8
|
import "../chunk-6TJXDCAQ.js";
|
|
9
9
|
export {
|
|
10
10
|
resizable_default as default,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { b as BehaviorSchema, L as LokaScriptInstance } from '../types-BY-jB5FV.cjs';
|
|
2
2
|
|
|
3
3
|
declare const scrollRevealSource: string;
|
|
4
4
|
declare const scrollRevealMetadata: BehaviorSchema;
|
|
@@ -35,13 +35,6 @@ var sortableSchema = {
|
|
|
35
35
|
version: "1.0.0",
|
|
36
36
|
description: "Makes child elements reorderable via drag-and-drop",
|
|
37
37
|
parameters: [
|
|
38
|
-
{
|
|
39
|
-
name: "handle",
|
|
40
|
-
type: "selector",
|
|
41
|
-
optional: true,
|
|
42
|
-
default: "none",
|
|
43
|
-
description: "CSS selector for drag handles within items"
|
|
44
|
-
},
|
|
45
38
|
{
|
|
46
39
|
name: "dragClass",
|
|
47
40
|
type: "string",
|
|
@@ -60,32 +53,25 @@ var sortableSchema = {
|
|
|
60
53
|
],
|
|
61
54
|
requirements: ["Users must handle DOM reordering in sortable:move event handlers"],
|
|
62
55
|
source: `
|
|
63
|
-
behavior Sortable(
|
|
56
|
+
behavior Sortable(dragClass)
|
|
64
57
|
init
|
|
65
58
|
if dragClass is undefined
|
|
66
59
|
set dragClass to "sorting"
|
|
67
60
|
end
|
|
68
61
|
end
|
|
69
62
|
on pointerdown(clientY) from me
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
var item = target.closest("li");
|
|
73
|
-
if (!item || !me.contains(item)) return false;
|
|
74
|
-
if (handle && !target.closest(handle)) return false;
|
|
75
|
-
event.preventDefault();
|
|
76
|
-
event.stopPropagation();
|
|
77
|
-
return true;
|
|
78
|
-
end
|
|
79
|
-
if it is false
|
|
63
|
+
set item to the closest <li/> to the target
|
|
64
|
+
if item is null
|
|
80
65
|
exit
|
|
81
66
|
end
|
|
82
|
-
|
|
67
|
+
halt the event
|
|
68
|
+
add .{dragClass} to item
|
|
83
69
|
trigger sortable:start on me
|
|
84
70
|
repeat until event pointerup from document
|
|
85
71
|
wait for pointermove(clientY) from document
|
|
86
72
|
trigger sortable:move on me
|
|
87
73
|
end
|
|
88
|
-
remove .{dragClass} from
|
|
74
|
+
remove .{dragClass} from item
|
|
89
75
|
trigger sortable:end on me
|
|
90
76
|
end
|
|
91
77
|
end`.trim()
|
|
@@ -143,7 +129,7 @@ async function registerSortable(hyperfixi) {
|
|
|
143
129
|
const syntheticNode = {
|
|
144
130
|
type: "behavior",
|
|
145
131
|
name: "Sortable",
|
|
146
|
-
parameters: ["
|
|
132
|
+
parameters: ["dragClass"],
|
|
147
133
|
eventHandlers: [],
|
|
148
134
|
imperativeInstaller: installSortable
|
|
149
135
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/behaviors/sortable.ts","../../src/schemas/sortable.schema.ts","../../src/schemas/types.ts"],"sourcesContent":["/**\n * Sortable Behavior — Imperative Implementation\n *\n * Drag-and-drop reordering of list items.\n * Apply to a container element; children become sortable.\n *\n * Note: This behavior fires lifecycle events but does NOT automatically\n * reorder DOM elements. Users must handle actual reordering in their\n * `sortable:move` event handlers.\n *\n * @example\n * ```html\n * <ul _=\"install Sortable\">\n * <li>Item 1</li>\n * <li>Item 2</li>\n * </ul>\n * ```\n */\n\nimport { sortableSchema } from '../schemas/sortable.schema';\nimport type { LokaScriptInstance } from '../schemas/types';\nimport { resolveRuntime } from '../schemas/types';\n\n// Re-export schema-derived values for backwards compatibility\nexport const sortableSource = sortableSchema.source;\nexport const sortableMetadata = sortableSchema;\n\n/**\n * Imperative installer for Sortable behavior.\n */\nfunction installSortable(element: HTMLElement, params: Record<string, any>): void {\n const dragClass = params.dragClass || 'sorting';\n const handleSelector = params.handle || null;\n\n element.addEventListener('pointerdown', (e: PointerEvent) => {\n const target = e.target as HTMLElement;\n const item = target.closest('li');\n if (!item || !element.contains(item)) return;\n\n // If a handle selector is specified, only start drag from the handle\n if (handleSelector) {\n const handleEl = target.closest(handleSelector);\n if (!handleEl) return;\n }\n\n e.preventDefault();\n item.classList.add(dragClass);\n element.dispatchEvent(new CustomEvent('sortable:start', { bubbles: true, detail: { item } }));\n\n function onMove(ev: PointerEvent) {\n element.dispatchEvent(\n new CustomEvent('sortable:move', {\n bubbles: true,\n detail: { clientY: ev.clientY, item },\n })\n );\n }\n\n function onUp() {\n document.removeEventListener('pointermove', onMove);\n document.removeEventListener('pointerup', onUp);\n item!.classList.remove(dragClass);\n element.dispatchEvent(new CustomEvent('sortable:end', { bubbles: true, detail: { item } }));\n }\n\n document.addEventListener('pointermove', onMove);\n document.addEventListener('pointerup', onUp);\n });\n}\n\n/**\n * Register the Sortable behavior with LokaScript.\n */\nexport async function registerSortable(hyperfixi?: LokaScriptInstance): Promise<void> {\n const hf = hyperfixi || resolveRuntime();\n\n if (!hf) {\n throw new Error(\n 'LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors.'\n );\n }\n\n const syntheticNode = {\n type: 'behavior',\n name: 'Sortable',\n parameters: ['handle', 'dragClass'],\n eventHandlers: [],\n imperativeInstaller: installSortable,\n };\n const ctx = hf.createContext ? hf.createContext() : { locals: new Map(), globals: new Map() };\n await hf.execute(syntheticNode, ctx);\n}\n\n// Auto-register when loaded as a script tag\nif (resolveRuntime()) {\n registerSortable().catch(console.error);\n}\n\nexport default {\n source: sortableSchema.source,\n metadata: sortableSchema,\n register: registerSortable,\n};\n","import type { BehaviorSchema } from './types';\n\n/**\n * Sortable Behavior Schema\n *\n * Drag-and-drop reordering of list items.\n * Apply to a container element; children become sortable.\n *\n * Note: This behavior fires lifecycle events but does NOT automatically\n * reorder DOM elements. Users must handle actual reordering in their\n * `sortable:move` event handlers.\n */\nexport const sortableSchema: BehaviorSchema = {\n name: 'Sortable',\n category: 'ui',\n tier: 'common',\n version: '1.0.0',\n description: 'Makes child elements reorderable via drag-and-drop',\n parameters: [\n {\n name: 'handle',\n type: 'selector',\n optional: true,\n default: 'none',\n description: 'CSS selector for drag handles within items',\n },\n {\n name: 'dragClass',\n type: 'string',\n optional: true,\n default: 'sorting',\n description: 'CSS class added to item during drag',\n },\n ],\n events: [\n { name: 'sortable:start', description: 'Fired when drag begins' },\n {\n name: 'sortable:move',\n description: 'Fired during drag — handle this event to reorder DOM elements',\n },\n { name: 'sortable:end', description: 'Fired when drag completes' },\n ],\n requirements: ['Users must handle DOM reordering in sortable:move event handlers'],\n source: `\nbehavior Sortable(handle, dragClass)\n init\n if dragClass is undefined\n set dragClass to \"sorting\"\n end\n end\n on pointerdown(clientY) from me\n js(me, handle, event)\n var target = event.target;\n var item = target.closest(\"li\");\n if (!item || !me.contains(item)) return false;\n if (handle && !target.closest(handle)) return false;\n event.preventDefault();\n event.stopPropagation();\n return true;\n end\n if it is false\n exit\n end\n add .{dragClass} to me\n trigger sortable:start on me\n repeat until event pointerup from document\n wait for pointermove(clientY) from document\n trigger sortable:move on me\n end\n remove .{dragClass} from me\n trigger sortable:end on me\n end\nend`.trim(),\n};\n","/**\n * Behavior Schema Types\n *\n * Defines the structure for behavior metadata used for:\n * - Code generation (TypeScript types, documentation)\n * - Runtime categorization and lazy loading\n * - Tooling and IDE integration\n */\n\n/**\n * Behavior categories for organization.\n * - ui: Visual interaction behaviors (drag, resize, sort)\n * - data: Data manipulation behaviors (remove, transform)\n * - animation: Animation and transition behaviors\n * - form: Form-related behaviors (validation, toggle states)\n * - layout: Layout behaviors (sticky, scrollspy)\n */\nexport type BehaviorCategory = 'ui' | 'data' | 'animation' | 'form' | 'layout';\n\n/**\n * Loading tiers for lazy loading optimization.\n * - core: Always loaded (essential behaviors)\n * - common: High usage (loaded for typical apps)\n * - optional: Low usage (loaded on demand)\n */\nexport type BehaviorTier = 'core' | 'common' | 'optional';\n\n/**\n * Schema for a behavior parameter.\n */\nexport interface ParameterSchema {\n name: string;\n type: 'string' | 'number' | 'boolean' | 'selector' | 'element';\n optional?: boolean;\n default?: string | number | boolean;\n /** Allowed values for constrained parameters */\n enum?: string[];\n description: string;\n}\n\n/**\n * Schema for a behavior event.\n */\nexport interface EventSchema {\n name: string;\n description: string;\n}\n\n/**\n * Complete schema for a behavior.\n * This is the source of truth for all behavior metadata.\n */\nexport interface BehaviorSchema {\n /** Behavior name (PascalCase) */\n name: string;\n /** Category for organization */\n category: BehaviorCategory;\n /** Loading tier for lazy loading */\n tier: BehaviorTier;\n /** Semantic version */\n version: string;\n /** Human-readable description */\n description: string;\n /** Parameter definitions */\n parameters: ParameterSchema[];\n /** Event definitions */\n events: EventSchema[];\n /** The hyperscript behavior source code */\n source: string;\n /** Optional requirements or notes */\n requirements?: string[];\n}\n\n/**\n * Runtime behavior module interface.\n * This is what gets registered with the hyperfixi runtime.\n */\nexport interface BehaviorModule {\n source: string;\n metadata: BehaviorSchema;\n register: (hyperfixi?: LokaScriptInstance) => Promise<void>;\n}\n\n/**\n * Minimal LokaScript instance interface for behavior registration.\n */\nexport interface LokaScriptInstance {\n compileSync: (\n code: string,\n options?: { traditional?: boolean; language?: string }\n ) => {\n ok: boolean;\n ast?: unknown;\n errors?: Array<{ message: string; line?: number; column?: number }>;\n };\n execute: (ast: unknown, ctx: unknown) => Promise<unknown>;\n createContext?: () => { locals: Map<string, unknown>; globals: Map<string, unknown> };\n}\n\n/**\n * Typed window interface for behavior auto-registration.\n * Avoids `(window as any)` casts throughout the codebase.\n * Checks both `window.lokascript` and `window.hyperfixi` for the runtime instance.\n */\nexport interface LokaScriptWindow {\n lokascript?: LokaScriptInstance;\n hyperfixi?: LokaScriptInstance;\n __hyperfixi_behaviors_ready?: Promise<void> | undefined;\n}\n\n/**\n * Resolve the LokaScript runtime from window globals.\n * Checks both `window.lokascript` and `window.hyperfixi`.\n */\nexport function resolveRuntime(): LokaScriptInstance | null {\n if (typeof window === 'undefined') return null;\n const win = window as unknown as LokaScriptWindow;\n return win.lokascript || win.hyperfixi || null;\n}\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/behaviors/sortable.ts","../../src/schemas/sortable.schema.ts","../../src/schemas/types.ts"],"sourcesContent":["/**\n * Sortable Behavior — Imperative Implementation\n *\n * Drag-and-drop reordering of list items.\n * Apply to a container element; children become sortable.\n *\n * Note: This behavior fires lifecycle events but does NOT automatically\n * reorder DOM elements. Users must handle actual reordering in their\n * `sortable:move` event handlers.\n *\n * @example\n * ```html\n * <ul _=\"install Sortable\">\n * <li>Item 1</li>\n * <li>Item 2</li>\n * </ul>\n * ```\n */\n\nimport { sortableSchema } from '../schemas/sortable.schema';\nimport type { LokaScriptInstance } from '../schemas/types';\nimport { resolveRuntime } from '../schemas/types';\n\n// Re-export schema-derived values for backwards compatibility\nexport const sortableSource = sortableSchema.source;\nexport const sortableMetadata = sortableSchema;\n\n/**\n * Imperative installer for Sortable behavior.\n */\nfunction installSortable(element: HTMLElement, params: Record<string, any>): void {\n const dragClass = params.dragClass || 'sorting';\n const handleSelector = params.handle || null;\n\n element.addEventListener('pointerdown', (e: PointerEvent) => {\n const target = e.target as HTMLElement;\n const item = target.closest('li');\n if (!item || !element.contains(item)) return;\n\n // If a handle selector is specified, only start drag from the handle\n if (handleSelector) {\n const handleEl = target.closest(handleSelector);\n if (!handleEl) return;\n }\n\n e.preventDefault();\n item.classList.add(dragClass);\n element.dispatchEvent(new CustomEvent('sortable:start', { bubbles: true, detail: { item } }));\n\n function onMove(ev: PointerEvent) {\n element.dispatchEvent(\n new CustomEvent('sortable:move', {\n bubbles: true,\n detail: { clientY: ev.clientY, item },\n })\n );\n }\n\n function onUp() {\n document.removeEventListener('pointermove', onMove);\n document.removeEventListener('pointerup', onUp);\n item!.classList.remove(dragClass);\n element.dispatchEvent(new CustomEvent('sortable:end', { bubbles: true, detail: { item } }));\n }\n\n document.addEventListener('pointermove', onMove);\n document.addEventListener('pointerup', onUp);\n });\n}\n\n/**\n * Register the Sortable behavior with LokaScript.\n */\nexport async function registerSortable(hyperfixi?: LokaScriptInstance): Promise<void> {\n const hf = hyperfixi || resolveRuntime();\n\n if (!hf) {\n throw new Error(\n 'LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors.'\n );\n }\n\n const syntheticNode = {\n type: 'behavior',\n name: 'Sortable',\n parameters: ['dragClass'],\n eventHandlers: [],\n imperativeInstaller: installSortable,\n };\n const ctx = hf.createContext ? hf.createContext() : { locals: new Map(), globals: new Map() };\n await hf.execute(syntheticNode, ctx);\n}\n\n// Auto-register when loaded as a script tag\nif (resolveRuntime()) {\n registerSortable().catch(console.error);\n}\n\nexport default {\n source: sortableSchema.source,\n metadata: sortableSchema,\n register: registerSortable,\n};\n","import type { BehaviorSchema } from './types';\n\n/**\n * Sortable Behavior Schema\n *\n * Drag-and-drop reordering of list items.\n * Apply to a container element; children become sortable.\n *\n * Note: This behavior fires lifecycle events but does NOT automatically\n * reorder DOM elements. Users must handle actual reordering in their\n * `sortable:move` event handlers.\n */\nexport const sortableSchema: BehaviorSchema = {\n name: 'Sortable',\n category: 'ui',\n tier: 'common',\n version: '1.0.0',\n description: 'Makes child elements reorderable via drag-and-drop',\n parameters: [\n {\n name: 'dragClass',\n type: 'string',\n optional: true,\n default: 'sorting',\n description: 'CSS class added to item during drag',\n },\n ],\n events: [\n { name: 'sortable:start', description: 'Fired when drag begins' },\n {\n name: 'sortable:move',\n description: 'Fired during drag — handle this event to reorder DOM elements',\n },\n { name: 'sortable:end', description: 'Fired when drag completes' },\n ],\n requirements: ['Users must handle DOM reordering in sortable:move event handlers'],\n source: `\nbehavior Sortable(dragClass)\n init\n if dragClass is undefined\n set dragClass to \"sorting\"\n end\n end\n on pointerdown(clientY) from me\n set item to the closest <li/> to the target\n if item is null\n exit\n end\n halt the event\n add .{dragClass} to item\n trigger sortable:start on me\n repeat until event pointerup from document\n wait for pointermove(clientY) from document\n trigger sortable:move on me\n end\n remove .{dragClass} from item\n trigger sortable:end on me\n end\nend`.trim(),\n};\n","/**\n * Behavior Schema Types\n *\n * Defines the structure for behavior metadata used for:\n * - Code generation (TypeScript types, documentation)\n * - Runtime categorization and lazy loading\n * - Tooling and IDE integration\n */\n\n/**\n * Behavior categories for organization.\n * - ui: Visual interaction behaviors (drag, resize, sort)\n * - data: Data manipulation behaviors (remove, transform)\n * - animation: Animation and transition behaviors\n * - form: Form-related behaviors (validation, toggle states)\n * - layout: Layout behaviors (sticky, scrollspy)\n */\nexport type BehaviorCategory = 'ui' | 'data' | 'animation' | 'form' | 'layout';\n\n/**\n * Loading tiers for lazy loading optimization.\n * - core: Always loaded (essential behaviors)\n * - common: High usage (loaded for typical apps)\n * - optional: Low usage (loaded on demand)\n */\nexport type BehaviorTier = 'core' | 'common' | 'optional';\n\n/**\n * Schema for a behavior parameter.\n */\nexport interface ParameterSchema {\n name: string;\n type: 'string' | 'number' | 'boolean' | 'selector' | 'element';\n optional?: boolean;\n default?: string | number | boolean;\n /** Allowed values for constrained parameters */\n enum?: string[];\n description: string;\n}\n\n/**\n * Schema for a behavior event.\n */\nexport interface EventSchema {\n name: string;\n description: string;\n}\n\n/**\n * Complete schema for a behavior.\n * This is the source of truth for all behavior metadata.\n */\nexport interface BehaviorSchema {\n /** Behavior name (PascalCase) */\n name: string;\n /** Category for organization */\n category: BehaviorCategory;\n /** Loading tier for lazy loading */\n tier: BehaviorTier;\n /** Semantic version */\n version: string;\n /** Human-readable description */\n description: string;\n /** Parameter definitions */\n parameters: ParameterSchema[];\n /** Event definitions */\n events: EventSchema[];\n /** The hyperscript behavior source code */\n source: string;\n /** Optional requirements or notes */\n requirements?: string[];\n}\n\n/**\n * Runtime behavior module interface.\n * This is what gets registered with the hyperfixi runtime.\n */\nexport interface BehaviorModule {\n source: string;\n metadata: BehaviorSchema;\n register: (hyperfixi?: LokaScriptInstance) => Promise<void>;\n}\n\n/**\n * Minimal LokaScript instance interface for behavior registration.\n */\nexport interface LokaScriptInstance {\n compileSync: (\n code: string,\n options?: { traditional?: boolean; language?: string }\n ) => {\n ok: boolean;\n ast?: unknown;\n errors?: Array<{ message: string; line?: number; column?: number }>;\n };\n execute: (ast: unknown, ctx: unknown) => Promise<unknown>;\n createContext?: () => { locals: Map<string, unknown>; globals: Map<string, unknown> };\n}\n\n/**\n * Typed window interface for behavior auto-registration.\n * Avoids `(window as any)` casts throughout the codebase.\n * Checks both `window.lokascript` and `window.hyperfixi` for the runtime instance.\n */\nexport interface LokaScriptWindow {\n lokascript?: LokaScriptInstance;\n hyperfixi?: LokaScriptInstance;\n __hyperfixi_behaviors_ready?: Promise<void> | undefined;\n}\n\n/**\n * Resolve the LokaScript runtime from window globals.\n * Checks both `window.lokascript` and `window.hyperfixi`.\n */\nexport function resolveRuntime(): LokaScriptInstance | null {\n if (typeof window === 'undefined') return null;\n const win = window as unknown as LokaScriptWindow;\n return win.lokascript || win.hyperfixi || null;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACYO,IAAM,iBAAiC;AAAA,EAC5C,MAAM;AAAA,EACN,UAAU;AAAA,EACV,MAAM;AAAA,EACN,SAAS;AAAA,EACT,aAAa;AAAA,EACb,YAAY;AAAA,IACV;AAAA,MACE,MAAM;AAAA,MACN,MAAM;AAAA,MACN,UAAU;AAAA,MACV,SAAS;AAAA,MACT,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACA,QAAQ;AAAA,IACN,EAAE,MAAM,kBAAkB,aAAa,yBAAyB;AAAA,IAChE;AAAA,MACE,MAAM;AAAA,MACN,aAAa;AAAA,IACf;AAAA,IACA,EAAE,MAAM,gBAAgB,aAAa,4BAA4B;AAAA,EACnE;AAAA,EACA,cAAc,CAAC,kEAAkE;AAAA,EACjF,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAsBL,KAAK;AACV;;;ACuDO,SAAS,iBAA4C;AAC1D,MAAI,OAAO,WAAW,YAAa,QAAO;AAC1C,QAAM,MAAM;AACZ,SAAO,IAAI,cAAc,IAAI,aAAa;AAC5C;;;AF9FO,IAAM,iBAAiB,eAAe;AACtC,IAAM,mBAAmB;AAKhC,SAAS,gBAAgB,SAAsB,QAAmC;AAChF,QAAM,YAAY,OAAO,aAAa;AACtC,QAAM,iBAAiB,OAAO,UAAU;AAExC,UAAQ,iBAAiB,eAAe,CAAC,MAAoB;AAC3D,UAAM,SAAS,EAAE;AACjB,UAAM,OAAO,OAAO,QAAQ,IAAI;AAChC,QAAI,CAAC,QAAQ,CAAC,QAAQ,SAAS,IAAI,EAAG;AAGtC,QAAI,gBAAgB;AAClB,YAAM,WAAW,OAAO,QAAQ,cAAc;AAC9C,UAAI,CAAC,SAAU;AAAA,IACjB;AAEA,MAAE,eAAe;AACjB,SAAK,UAAU,IAAI,SAAS;AAC5B,YAAQ,cAAc,IAAI,YAAY,kBAAkB,EAAE,SAAS,MAAM,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC;AAE5F,aAAS,OAAO,IAAkB;AAChC,cAAQ;AAAA,QACN,IAAI,YAAY,iBAAiB;AAAA,UAC/B,SAAS;AAAA,UACT,QAAQ,EAAE,SAAS,GAAG,SAAS,KAAK;AAAA,QACtC,CAAC;AAAA,MACH;AAAA,IACF;AAEA,aAAS,OAAO;AACd,eAAS,oBAAoB,eAAe,MAAM;AAClD,eAAS,oBAAoB,aAAa,IAAI;AAC9C,WAAM,UAAU,OAAO,SAAS;AAChC,cAAQ,cAAc,IAAI,YAAY,gBAAgB,EAAE,SAAS,MAAM,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC;AAAA,IAC5F;AAEA,aAAS,iBAAiB,eAAe,MAAM;AAC/C,aAAS,iBAAiB,aAAa,IAAI;AAAA,EAC7C,CAAC;AACH;AAKA,eAAsB,iBAAiB,WAA+C;AACpF,QAAM,KAAK,aAAa,eAAe;AAEvC,MAAI,CAAC,IAAI;AACP,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AAEA,QAAM,gBAAgB;AAAA,IACpB,MAAM;AAAA,IACN,MAAM;AAAA,IACN,YAAY,CAAC,WAAW;AAAA,IACxB,eAAe,CAAC;AAAA,IAChB,qBAAqB;AAAA,EACvB;AACA,QAAM,MAAM,GAAG,gBAAgB,GAAG,cAAc,IAAI,EAAE,QAAQ,oBAAI,IAAI,GAAG,SAAS,oBAAI,IAAI,EAAE;AAC5F,QAAM,GAAG,QAAQ,eAAe,GAAG;AACrC;AAGA,IAAI,eAAe,GAAG;AACpB,mBAAiB,EAAE,MAAM,QAAQ,KAAK;AACxC;AAEA,IAAO,mBAAQ;AAAA,EACb,QAAQ,eAAe;AAAA,EACvB,UAAU;AAAA,EACV,UAAU;AACZ;","names":[]}
|
|
@@ -3,8 +3,8 @@ import {
|
|
|
3
3
|
sortableMetadata,
|
|
4
4
|
sortableSource,
|
|
5
5
|
sortable_default
|
|
6
|
-
} from "../chunk-
|
|
7
|
-
import "../chunk-
|
|
6
|
+
} from "../chunk-IMDFEGIT.js";
|
|
7
|
+
import "../chunk-V2M4W3LO.js";
|
|
8
8
|
import "../chunk-6TJXDCAQ.js";
|
|
9
9
|
export {
|
|
10
10
|
sortable_default as default,
|
package/dist/behaviors/tabs.d.ts
CHANGED
|
@@ -3,13 +3,13 @@ import {
|
|
|
3
3
|
} from "./chunk-HMU342XE.js";
|
|
4
4
|
import {
|
|
5
5
|
resizableSchema
|
|
6
|
-
} from "./chunk-
|
|
6
|
+
} from "./chunk-ZBSWTV6I.js";
|
|
7
7
|
import {
|
|
8
8
|
scrollRevealSchema
|
|
9
9
|
} from "./chunk-URZGNPTQ.js";
|
|
10
10
|
import {
|
|
11
11
|
sortableSchema
|
|
12
|
-
} from "./chunk-
|
|
12
|
+
} from "./chunk-V2M4W3LO.js";
|
|
13
13
|
import {
|
|
14
14
|
tabsSchema
|
|
15
15
|
} from "./chunk-HQDYH45I.js";
|
|
@@ -59,4 +59,4 @@ registerLoader("ClickOutside", () => import("./behaviors/clickoutside.js"));
|
|
|
59
59
|
registerLoader("FocusTrap", () => import("./behaviors/focustrap.js"));
|
|
60
60
|
registerLoader("ScrollReveal", () => import("./behaviors/scrollreveal.js"));
|
|
61
61
|
registerLoader("Tabs", () => import("./behaviors/tabs.js"));
|
|
62
|
-
//# sourceMappingURL=chunk-
|
|
62
|
+
//# sourceMappingURL=chunk-BBIIOGMF.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
sortableSchema
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-V2M4W3LO.js";
|
|
4
4
|
import {
|
|
5
5
|
resolveRuntime
|
|
6
6
|
} from "./chunk-6TJXDCAQ.js";
|
|
@@ -50,7 +50,7 @@ async function registerSortable(hyperfixi) {
|
|
|
50
50
|
const syntheticNode = {
|
|
51
51
|
type: "behavior",
|
|
52
52
|
name: "Sortable",
|
|
53
|
-
parameters: ["
|
|
53
|
+
parameters: ["dragClass"],
|
|
54
54
|
eventHandlers: [],
|
|
55
55
|
imperativeInstaller: installSortable
|
|
56
56
|
};
|
|
@@ -72,4 +72,4 @@ export {
|
|
|
72
72
|
registerSortable,
|
|
73
73
|
sortable_default
|
|
74
74
|
};
|
|
75
|
-
//# sourceMappingURL=chunk-
|
|
75
|
+
//# sourceMappingURL=chunk-IMDFEGIT.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/behaviors/sortable.ts"],"sourcesContent":["/**\n * Sortable Behavior — Imperative Implementation\n *\n * Drag-and-drop reordering of list items.\n * Apply to a container element; children become sortable.\n *\n * Note: This behavior fires lifecycle events but does NOT automatically\n * reorder DOM elements. Users must handle actual reordering in their\n * `sortable:move` event handlers.\n *\n * @example\n * ```html\n * <ul _=\"install Sortable\">\n * <li>Item 1</li>\n * <li>Item 2</li>\n * </ul>\n * ```\n */\n\nimport { sortableSchema } from '../schemas/sortable.schema';\nimport type { LokaScriptInstance } from '../schemas/types';\nimport { resolveRuntime } from '../schemas/types';\n\n// Re-export schema-derived values for backwards compatibility\nexport const sortableSource = sortableSchema.source;\nexport const sortableMetadata = sortableSchema;\n\n/**\n * Imperative installer for Sortable behavior.\n */\nfunction installSortable(element: HTMLElement, params: Record<string, any>): void {\n const dragClass = params.dragClass || 'sorting';\n const handleSelector = params.handle || null;\n\n element.addEventListener('pointerdown', (e: PointerEvent) => {\n const target = e.target as HTMLElement;\n const item = target.closest('li');\n if (!item || !element.contains(item)) return;\n\n // If a handle selector is specified, only start drag from the handle\n if (handleSelector) {\n const handleEl = target.closest(handleSelector);\n if (!handleEl) return;\n }\n\n e.preventDefault();\n item.classList.add(dragClass);\n element.dispatchEvent(new CustomEvent('sortable:start', { bubbles: true, detail: { item } }));\n\n function onMove(ev: PointerEvent) {\n element.dispatchEvent(\n new CustomEvent('sortable:move', {\n bubbles: true,\n detail: { clientY: ev.clientY, item },\n })\n );\n }\n\n function onUp() {\n document.removeEventListener('pointermove', onMove);\n document.removeEventListener('pointerup', onUp);\n item!.classList.remove(dragClass);\n element.dispatchEvent(new CustomEvent('sortable:end', { bubbles: true, detail: { item } }));\n }\n\n document.addEventListener('pointermove', onMove);\n document.addEventListener('pointerup', onUp);\n });\n}\n\n/**\n * Register the Sortable behavior with LokaScript.\n */\nexport async function registerSortable(hyperfixi?: LokaScriptInstance): Promise<void> {\n const hf = hyperfixi || resolveRuntime();\n\n if (!hf) {\n throw new Error(\n 'LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors.'\n );\n }\n\n const syntheticNode = {\n type: 'behavior',\n name: 'Sortable',\n parameters: ['
|
|
1
|
+
{"version":3,"sources":["../src/behaviors/sortable.ts"],"sourcesContent":["/**\n * Sortable Behavior — Imperative Implementation\n *\n * Drag-and-drop reordering of list items.\n * Apply to a container element; children become sortable.\n *\n * Note: This behavior fires lifecycle events but does NOT automatically\n * reorder DOM elements. Users must handle actual reordering in their\n * `sortable:move` event handlers.\n *\n * @example\n * ```html\n * <ul _=\"install Sortable\">\n * <li>Item 1</li>\n * <li>Item 2</li>\n * </ul>\n * ```\n */\n\nimport { sortableSchema } from '../schemas/sortable.schema';\nimport type { LokaScriptInstance } from '../schemas/types';\nimport { resolveRuntime } from '../schemas/types';\n\n// Re-export schema-derived values for backwards compatibility\nexport const sortableSource = sortableSchema.source;\nexport const sortableMetadata = sortableSchema;\n\n/**\n * Imperative installer for Sortable behavior.\n */\nfunction installSortable(element: HTMLElement, params: Record<string, any>): void {\n const dragClass = params.dragClass || 'sorting';\n const handleSelector = params.handle || null;\n\n element.addEventListener('pointerdown', (e: PointerEvent) => {\n const target = e.target as HTMLElement;\n const item = target.closest('li');\n if (!item || !element.contains(item)) return;\n\n // If a handle selector is specified, only start drag from the handle\n if (handleSelector) {\n const handleEl = target.closest(handleSelector);\n if (!handleEl) return;\n }\n\n e.preventDefault();\n item.classList.add(dragClass);\n element.dispatchEvent(new CustomEvent('sortable:start', { bubbles: true, detail: { item } }));\n\n function onMove(ev: PointerEvent) {\n element.dispatchEvent(\n new CustomEvent('sortable:move', {\n bubbles: true,\n detail: { clientY: ev.clientY, item },\n })\n );\n }\n\n function onUp() {\n document.removeEventListener('pointermove', onMove);\n document.removeEventListener('pointerup', onUp);\n item!.classList.remove(dragClass);\n element.dispatchEvent(new CustomEvent('sortable:end', { bubbles: true, detail: { item } }));\n }\n\n document.addEventListener('pointermove', onMove);\n document.addEventListener('pointerup', onUp);\n });\n}\n\n/**\n * Register the Sortable behavior with LokaScript.\n */\nexport async function registerSortable(hyperfixi?: LokaScriptInstance): Promise<void> {\n const hf = hyperfixi || resolveRuntime();\n\n if (!hf) {\n throw new Error(\n 'LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors.'\n );\n }\n\n const syntheticNode = {\n type: 'behavior',\n name: 'Sortable',\n parameters: ['dragClass'],\n eventHandlers: [],\n imperativeInstaller: installSortable,\n };\n const ctx = hf.createContext ? hf.createContext() : { locals: new Map(), globals: new Map() };\n await hf.execute(syntheticNode, ctx);\n}\n\n// Auto-register when loaded as a script tag\nif (resolveRuntime()) {\n registerSortable().catch(console.error);\n}\n\nexport default {\n source: sortableSchema.source,\n metadata: sortableSchema,\n register: registerSortable,\n};\n"],"mappings":";;;;;;;;AAwBO,IAAM,iBAAiB,eAAe;AACtC,IAAM,mBAAmB;AAKhC,SAAS,gBAAgB,SAAsB,QAAmC;AAChF,QAAM,YAAY,OAAO,aAAa;AACtC,QAAM,iBAAiB,OAAO,UAAU;AAExC,UAAQ,iBAAiB,eAAe,CAAC,MAAoB;AAC3D,UAAM,SAAS,EAAE;AACjB,UAAM,OAAO,OAAO,QAAQ,IAAI;AAChC,QAAI,CAAC,QAAQ,CAAC,QAAQ,SAAS,IAAI,EAAG;AAGtC,QAAI,gBAAgB;AAClB,YAAM,WAAW,OAAO,QAAQ,cAAc;AAC9C,UAAI,CAAC,SAAU;AAAA,IACjB;AAEA,MAAE,eAAe;AACjB,SAAK,UAAU,IAAI,SAAS;AAC5B,YAAQ,cAAc,IAAI,YAAY,kBAAkB,EAAE,SAAS,MAAM,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC;AAE5F,aAAS,OAAO,IAAkB;AAChC,cAAQ;AAAA,QACN,IAAI,YAAY,iBAAiB;AAAA,UAC/B,SAAS;AAAA,UACT,QAAQ,EAAE,SAAS,GAAG,SAAS,KAAK;AAAA,QACtC,CAAC;AAAA,MACH;AAAA,IACF;AAEA,aAAS,OAAO;AACd,eAAS,oBAAoB,eAAe,MAAM;AAClD,eAAS,oBAAoB,aAAa,IAAI;AAC9C,WAAM,UAAU,OAAO,SAAS;AAChC,cAAQ,cAAc,IAAI,YAAY,gBAAgB,EAAE,SAAS,MAAM,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC;AAAA,IAC5F;AAEA,aAAS,iBAAiB,eAAe,MAAM;AAC/C,aAAS,iBAAiB,aAAa,IAAI;AAAA,EAC7C,CAAC;AACH;AAKA,eAAsB,iBAAiB,WAA+C;AACpF,QAAM,KAAK,aAAa,eAAe;AAEvC,MAAI,CAAC,IAAI;AACP,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AAEA,QAAM,gBAAgB;AAAA,IACpB,MAAM;AAAA,IACN,MAAM;AAAA,IACN,YAAY,CAAC,WAAW;AAAA,IACxB,eAAe,CAAC;AAAA,IAChB,qBAAqB;AAAA,EACvB;AACA,QAAM,MAAM,GAAG,gBAAgB,GAAG,cAAc,IAAI,EAAE,QAAQ,oBAAI,IAAI,GAAG,SAAS,oBAAI,IAAI,EAAE;AAC5F,QAAM,GAAG,QAAQ,eAAe,GAAG;AACrC;AAGA,IAAI,eAAe,GAAG;AACpB,mBAAiB,EAAE,MAAM,QAAQ,KAAK;AACxC;AAEA,IAAO,mBAAQ;AAAA,EACb,QAAQ,eAAe;AAAA,EACvB,UAAU;AAAA,EACV,UAAU;AACZ;","names":[]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
resizableSchema
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-ZBSWTV6I.js";
|
|
4
4
|
import {
|
|
5
5
|
resolveRuntime
|
|
6
6
|
} from "./chunk-6TJXDCAQ.js";
|
|
@@ -55,7 +55,7 @@ async function registerResizable(hyperfixi) {
|
|
|
55
55
|
const syntheticNode = {
|
|
56
56
|
type: "behavior",
|
|
57
57
|
name: "Resizable",
|
|
58
|
-
parameters: [
|
|
58
|
+
parameters: [],
|
|
59
59
|
eventHandlers: [],
|
|
60
60
|
imperativeInstaller: installResizable
|
|
61
61
|
};
|
|
@@ -77,4 +77,4 @@ export {
|
|
|
77
77
|
registerResizable,
|
|
78
78
|
resizable_default
|
|
79
79
|
};
|
|
80
|
-
//# sourceMappingURL=chunk-
|
|
80
|
+
//# sourceMappingURL=chunk-IT6TYVMW.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/behaviors/resizable.ts"],"sourcesContent":["/**\n * Resizable Behavior — Imperative Implementation\n *\n * Makes elements resizable by dragging edges or corners.\n * Supports minimum/maximum dimensions and resize handles.\n *\n * @example\n * ```html\n * <div _=\"install Resizable\" style=\"width: 200px; height: 150px;\">\n * Resize me!\n * </div>\n * ```\n */\n\nimport { resizableSchema } from '../schemas/resizable.schema';\nimport type { LokaScriptInstance } from '../schemas/types';\nimport { resolveRuntime } from '../schemas/types';\n\n// Re-export schema-derived values for backwards compatibility\nexport const resizableSource = resizableSchema.source;\nexport const resizableMetadata = resizableSchema;\n\n/**\n * Imperative installer for Resizable behavior.\n */\nfunction installResizable(element: HTMLElement, params: Record<string, any>): void {\n // Resolve handle element\n let handleEl: HTMLElement = element;\n if (params.handle && params.handle !== 'me') {\n if (typeof params.handle === 'string') {\n const found = element.querySelector(params.handle);\n if (found instanceof HTMLElement) handleEl = found;\n } else if (params.handle instanceof HTMLElement) {\n handleEl = params.handle;\n }\n }\n\n const minW = params.minWidth ?? 50;\n const minH = params.minHeight ?? 50;\n const maxW = params.maxWidth ?? 9999;\n const maxH = params.maxHeight ?? 9999;\n\n handleEl.addEventListener('pointerdown', (e: PointerEvent) => {\n e.preventDefault();\n element.dispatchEvent(new CustomEvent('resizable:start', { bubbles: true }));\n\n const startWidth = element.offsetWidth;\n const startHeight = element.offsetHeight;\n const startX = e.clientX;\n const startY = e.clientY;\n\n function onMove(ev: PointerEvent) {\n const newWidth = Math.max(minW, Math.min(maxW, startWidth + (ev.clientX - startX)));\n const newHeight = Math.max(minH, Math.min(maxH, startHeight + (ev.clientY - startY)));\n\n element.style.width = `${newWidth}px`;\n element.style.height = `${newHeight}px`;\n element.dispatchEvent(new CustomEvent('resizable:resize', { bubbles: true }));\n }\n\n function onUp() {\n document.removeEventListener('pointermove', onMove);\n document.removeEventListener('pointerup', onUp);\n element.dispatchEvent(new CustomEvent('resizable:end', { bubbles: true }));\n }\n\n document.addEventListener('pointermove', onMove);\n document.addEventListener('pointerup', onUp);\n });\n}\n\n/**\n * Register the Resizable behavior with LokaScript.\n */\nexport async function registerResizable(hyperfixi?: LokaScriptInstance): Promise<void> {\n const hf = hyperfixi || resolveRuntime();\n\n if (!hf) {\n throw new Error(\n 'LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors.'\n );\n }\n\n const syntheticNode = {\n type: 'behavior',\n name: 'Resizable',\n parameters: [
|
|
1
|
+
{"version":3,"sources":["../src/behaviors/resizable.ts"],"sourcesContent":["/**\n * Resizable Behavior — Imperative Implementation\n *\n * Makes elements resizable by dragging edges or corners.\n * Supports minimum/maximum dimensions and resize handles.\n *\n * @example\n * ```html\n * <div _=\"install Resizable\" style=\"width: 200px; height: 150px;\">\n * Resize me!\n * </div>\n * ```\n */\n\nimport { resizableSchema } from '../schemas/resizable.schema';\nimport type { LokaScriptInstance } from '../schemas/types';\nimport { resolveRuntime } from '../schemas/types';\n\n// Re-export schema-derived values for backwards compatibility\nexport const resizableSource = resizableSchema.source;\nexport const resizableMetadata = resizableSchema;\n\n/**\n * Imperative installer for Resizable behavior.\n */\nfunction installResizable(element: HTMLElement, params: Record<string, any>): void {\n // Resolve handle element\n let handleEl: HTMLElement = element;\n if (params.handle && params.handle !== 'me') {\n if (typeof params.handle === 'string') {\n const found = element.querySelector(params.handle);\n if (found instanceof HTMLElement) handleEl = found;\n } else if (params.handle instanceof HTMLElement) {\n handleEl = params.handle;\n }\n }\n\n const minW = params.minWidth ?? 50;\n const minH = params.minHeight ?? 50;\n const maxW = params.maxWidth ?? 9999;\n const maxH = params.maxHeight ?? 9999;\n\n handleEl.addEventListener('pointerdown', (e: PointerEvent) => {\n e.preventDefault();\n element.dispatchEvent(new CustomEvent('resizable:start', { bubbles: true }));\n\n const startWidth = element.offsetWidth;\n const startHeight = element.offsetHeight;\n const startX = e.clientX;\n const startY = e.clientY;\n\n function onMove(ev: PointerEvent) {\n const newWidth = Math.max(minW, Math.min(maxW, startWidth + (ev.clientX - startX)));\n const newHeight = Math.max(minH, Math.min(maxH, startHeight + (ev.clientY - startY)));\n\n element.style.width = `${newWidth}px`;\n element.style.height = `${newHeight}px`;\n element.dispatchEvent(new CustomEvent('resizable:resize', { bubbles: true }));\n }\n\n function onUp() {\n document.removeEventListener('pointermove', onMove);\n document.removeEventListener('pointerup', onUp);\n element.dispatchEvent(new CustomEvent('resizable:end', { bubbles: true }));\n }\n\n document.addEventListener('pointermove', onMove);\n document.addEventListener('pointerup', onUp);\n });\n}\n\n/**\n * Register the Resizable behavior with LokaScript.\n */\nexport async function registerResizable(hyperfixi?: LokaScriptInstance): Promise<void> {\n const hf = hyperfixi || resolveRuntime();\n\n if (!hf) {\n throw new Error(\n 'LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors.'\n );\n }\n\n const syntheticNode = {\n type: 'behavior',\n name: 'Resizable',\n parameters: [],\n eventHandlers: [],\n imperativeInstaller: installResizable,\n };\n const ctx = hf.createContext ? hf.createContext() : { locals: new Map(), globals: new Map() };\n await hf.execute(syntheticNode, ctx);\n}\n\n// Auto-register when loaded as a script tag\nif (resolveRuntime()) {\n registerResizable().catch(console.error);\n}\n\nexport default {\n source: resizableSchema.source,\n metadata: resizableSchema,\n register: registerResizable,\n};\n"],"mappings":";;;;;;;;AAmBO,IAAM,kBAAkB,gBAAgB;AACxC,IAAM,oBAAoB;AAKjC,SAAS,iBAAiB,SAAsB,QAAmC;AAEjF,MAAI,WAAwB;AAC5B,MAAI,OAAO,UAAU,OAAO,WAAW,MAAM;AAC3C,QAAI,OAAO,OAAO,WAAW,UAAU;AACrC,YAAM,QAAQ,QAAQ,cAAc,OAAO,MAAM;AACjD,UAAI,iBAAiB,YAAa,YAAW;AAAA,IAC/C,WAAW,OAAO,kBAAkB,aAAa;AAC/C,iBAAW,OAAO;AAAA,IACpB;AAAA,EACF;AAEA,QAAM,OAAO,OAAO,YAAY;AAChC,QAAM,OAAO,OAAO,aAAa;AACjC,QAAM,OAAO,OAAO,YAAY;AAChC,QAAM,OAAO,OAAO,aAAa;AAEjC,WAAS,iBAAiB,eAAe,CAAC,MAAoB;AAC5D,MAAE,eAAe;AACjB,YAAQ,cAAc,IAAI,YAAY,mBAAmB,EAAE,SAAS,KAAK,CAAC,CAAC;AAE3E,UAAM,aAAa,QAAQ;AAC3B,UAAM,cAAc,QAAQ;AAC5B,UAAM,SAAS,EAAE;AACjB,UAAM,SAAS,EAAE;AAEjB,aAAS,OAAO,IAAkB;AAChC,YAAM,WAAW,KAAK,IAAI,MAAM,KAAK,IAAI,MAAM,cAAc,GAAG,UAAU,OAAO,CAAC;AAClF,YAAM,YAAY,KAAK,IAAI,MAAM,KAAK,IAAI,MAAM,eAAe,GAAG,UAAU,OAAO,CAAC;AAEpF,cAAQ,MAAM,QAAQ,GAAG,QAAQ;AACjC,cAAQ,MAAM,SAAS,GAAG,SAAS;AACnC,cAAQ,cAAc,IAAI,YAAY,oBAAoB,EAAE,SAAS,KAAK,CAAC,CAAC;AAAA,IAC9E;AAEA,aAAS,OAAO;AACd,eAAS,oBAAoB,eAAe,MAAM;AAClD,eAAS,oBAAoB,aAAa,IAAI;AAC9C,cAAQ,cAAc,IAAI,YAAY,iBAAiB,EAAE,SAAS,KAAK,CAAC,CAAC;AAAA,IAC3E;AAEA,aAAS,iBAAiB,eAAe,MAAM;AAC/C,aAAS,iBAAiB,aAAa,IAAI;AAAA,EAC7C,CAAC;AACH;AAKA,eAAsB,kBAAkB,WAA+C;AACrF,QAAM,KAAK,aAAa,eAAe;AAEvC,MAAI,CAAC,IAAI;AACP,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AAEA,QAAM,gBAAgB;AAAA,IACpB,MAAM;AAAA,IACN,MAAM;AAAA,IACN,YAAY,CAAC;AAAA,IACb,eAAe,CAAC;AAAA,IAChB,qBAAqB;AAAA,EACvB;AACA,QAAM,MAAM,GAAG,gBAAgB,GAAG,cAAc,IAAI,EAAE,QAAQ,oBAAI,IAAI,GAAG,SAAS,oBAAI,IAAI,EAAE;AAC5F,QAAM,GAAG,QAAQ,eAAe,GAAG;AACrC;AAGA,IAAI,eAAe,GAAG;AACpB,oBAAkB,EAAE,MAAM,QAAQ,KAAK;AACzC;AAEA,IAAO,oBAAQ;AAAA,EACb,QAAQ,gBAAgB;AAAA,EACxB,UAAU;AAAA,EACV,UAAU;AACZ;","names":[]}
|
|
@@ -6,13 +6,6 @@ var sortableSchema = {
|
|
|
6
6
|
version: "1.0.0",
|
|
7
7
|
description: "Makes child elements reorderable via drag-and-drop",
|
|
8
8
|
parameters: [
|
|
9
|
-
{
|
|
10
|
-
name: "handle",
|
|
11
|
-
type: "selector",
|
|
12
|
-
optional: true,
|
|
13
|
-
default: "none",
|
|
14
|
-
description: "CSS selector for drag handles within items"
|
|
15
|
-
},
|
|
16
9
|
{
|
|
17
10
|
name: "dragClass",
|
|
18
11
|
type: "string",
|
|
@@ -31,32 +24,25 @@ var sortableSchema = {
|
|
|
31
24
|
],
|
|
32
25
|
requirements: ["Users must handle DOM reordering in sortable:move event handlers"],
|
|
33
26
|
source: `
|
|
34
|
-
behavior Sortable(
|
|
27
|
+
behavior Sortable(dragClass)
|
|
35
28
|
init
|
|
36
29
|
if dragClass is undefined
|
|
37
30
|
set dragClass to "sorting"
|
|
38
31
|
end
|
|
39
32
|
end
|
|
40
33
|
on pointerdown(clientY) from me
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
var item = target.closest("li");
|
|
44
|
-
if (!item || !me.contains(item)) return false;
|
|
45
|
-
if (handle && !target.closest(handle)) return false;
|
|
46
|
-
event.preventDefault();
|
|
47
|
-
event.stopPropagation();
|
|
48
|
-
return true;
|
|
49
|
-
end
|
|
50
|
-
if it is false
|
|
34
|
+
set item to the closest <li/> to the target
|
|
35
|
+
if item is null
|
|
51
36
|
exit
|
|
52
37
|
end
|
|
53
|
-
|
|
38
|
+
halt the event
|
|
39
|
+
add .{dragClass} to item
|
|
54
40
|
trigger sortable:start on me
|
|
55
41
|
repeat until event pointerup from document
|
|
56
42
|
wait for pointermove(clientY) from document
|
|
57
43
|
trigger sortable:move on me
|
|
58
44
|
end
|
|
59
|
-
remove .{dragClass} from
|
|
45
|
+
remove .{dragClass} from item
|
|
60
46
|
trigger sortable:end on me
|
|
61
47
|
end
|
|
62
48
|
end`.trim()
|
|
@@ -65,4 +51,4 @@ end`.trim()
|
|
|
65
51
|
export {
|
|
66
52
|
sortableSchema
|
|
67
53
|
};
|
|
68
|
-
//# sourceMappingURL=chunk-
|
|
54
|
+
//# sourceMappingURL=chunk-V2M4W3LO.js.map
|