{ "schemaVersion": "1.0.0", "readme": "", "modules": [ { "kind": "javascript-module", "path": "element.js", "declarations": [], "exports": [ { "kind": "js", "name": "config", "declaration": { "name": "config", "module": "./stemplayer.js" } } ] }, { "kind": "javascript-module", "path": "index.js", "declarations": [], "exports": [ { "kind": "js", "name": "FcStemPlayer", "declaration": { "name": "FcStemPlayer", "module": "./src/StemPlayer.js" } }, { "kind": "js", "name": "FcStemPlayerControls", "declaration": { "name": "FcStemPlayerControls", "module": "./src/StemPlayerControls.js" } }, { "kind": "js", "name": "FcStemPlayerStem", "declaration": { "name": "FcStemPlayerStem", "module": "./src/StemPlayerStem.js" } } ] }, { "kind": "javascript-module", "path": "stemplayer.js", "declarations": [], "exports": [ { "kind": "js", "name": "config", "declaration": { "name": "default", "module": "./src/config.js" } }, { "kind": "custom-element-definition", "name": "stemplayer-js", "declaration": { "name": "FcStemPlayer", "module": "/src/StemPlayer.js" } }, { "kind": "custom-element-definition", "name": "stemplayer-js-controls", "declaration": { "name": "FcStemPlayerControls", "module": "/src/StemPlayerControls.js" } }, { "kind": "custom-element-definition", "name": "stemplayer-js-stem", "declaration": { "name": "FcStemPlayerStem", "module": "/src/StemPlayerStem.js" } }, { "kind": "custom-element-definition", "name": "stemplayer-js-workspace", "declaration": { "name": "Workspace", "module": "/src/Workspace.js" } } ] }, { "kind": "javascript-module", "path": "src/ResponsiveConsumerLitElement.js", "declarations": [ { "kind": "class", "description": "LitElement that consumes displayMode and playerState from a parent provider via context.\nUse this for child components instead of ResponsiveLitElement.", "name": "ResponsiveConsumerLitElement", "mixins": [ { "name": "PlayerStateConsumerMixin", "module": "/src/mixins/PlayerStateConsumerMixin.js" }, { "name": "ResponsiveConsumerMixin", "module": "/src/mixins/ResponsiveConsumerMixin.js" } ], "superclass": { "name": "LitElement", "package": "lit" }, "customElement": true, "members": [ { "kind": "field", "name": "_playerStateConsumer", "default": "new ContextConsumer(this, { context: playerStateContext, callback: state => { if (state !== undefined) { // Apply all player state properties automatically // Doing this means Lit will batch updates if multiple properties are set for (const key of Object.keys(state)) { try { this[key] = state[key]; } catch (e) { // Safely ignore getter-only properties (like 'peaks' on StemPlayerStem) } } } }, subscribe: true, })", "inheritedFrom": { "name": "PlayerStateConsumerMixin", "module": "src/mixins/PlayerStateConsumerMixin.js" } }, { "kind": "field", "name": "properties", "static": true, "readonly": true, "inheritedFrom": { "name": "ResponsiveConsumerMixin", "module": "src/mixins/ResponsiveConsumerMixin.js" } }, { "kind": "field", "name": "displayMode", "privacy": "private", "description": "The displayMode determines normal or small screen rendering\nConsumed from parent via context", "type": { "text": "string" }, "default": "'lg'", "attribute": "displayMode", "inheritedFrom": { "name": "ResponsiveConsumerMixin", "module": "src/mixins/ResponsiveConsumerMixin.js" } }, { "kind": "field", "name": "_displayModeConsumer", "default": "new ContextConsumer(this, { context: displayModeContext, callback: value => { if (value !== undefined) { this.displayMode = value; } }, subscribe: true, // Subscribe to updates })", "inheritedFrom": { "name": "ResponsiveConsumerMixin", "module": "src/mixins/ResponsiveConsumerMixin.js" } } ], "attributes": [ { "name": "displayMode", "description": "The displayMode determines normal or small screen rendering\nConsumed from parent via context", "type": { "text": "string" }, "default": "'lg'", "fieldName": "displayMode", "inheritedFrom": { "name": "ResponsiveConsumerMixin", "module": "src/mixins/ResponsiveConsumerMixin.js" } } ] } ], "exports": [ { "kind": "js", "name": "ResponsiveConsumerLitElement", "declaration": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } } ] }, { "kind": "javascript-module", "path": "src/ResponsiveLitElement.js", "declarations": [ { "kind": "class", "description": "", "name": "ResponsiveLitElement", "mixins": [ { "name": "ResponsiveMixin", "module": "/src/mixins/ResponsiveMixin.js" } ], "superclass": { "name": "LitElement", "package": "lit" }, "customElement": true, "attributes": [ { "name": "displayMode", "description": "The displayMode determines normal or small screen rendering", "type": { "text": "string" }, "default": "'lg'", "fieldName": "displayMode", "inheritedFrom": { "name": "ResponsiveMixin", "module": "src/mixins/ResponsiveMixin.js" } } ], "members": [ { "kind": "field", "name": "properties", "static": true, "readonly": true, "inheritedFrom": { "name": "ResponsiveMixin", "module": "src/mixins/ResponsiveMixin.js" } }, { "kind": "field", "name": "#onResizeCallback", "privacy": "private", "inheritedFrom": { "name": "ResponsiveMixin", "module": "src/mixins/ResponsiveMixin.js" } }, { "kind": "field", "name": "#rafId", "privacy": "private", "type": { "text": "null" }, "default": "null", "inheritedFrom": { "name": "ResponsiveMixin", "module": "src/mixins/ResponsiveMixin.js" } }, { "kind": "field", "name": "#displayModeProvider", "privacy": "private", "default": "new ContextProvider(this, { context: displayModeContext, initialValue: this.displayMode, })", "inheritedFrom": { "name": "ResponsiveMixin", "module": "src/mixins/ResponsiveMixin.js" } }, { "kind": "method", "name": "#recalculateDisplayMode", "privacy": "private", "description": "Calculate displayMode based on component width", "inheritedFrom": { "name": "ResponsiveMixin", "module": "src/mixins/ResponsiveMixin.js" } }, { "kind": "method", "name": "#provideDisplayMode", "privacy": "private", "description": "Provide displayMode to all children via context\nUpdates the ContextProvider value", "inheritedFrom": { "name": "ResponsiveMixin", "module": "src/mixins/ResponsiveMixin.js" } }, { "kind": "method", "name": "recalculateDisplayMode", "description": "Recalculate display mode (public API for manual recalculation)", "inheritedFrom": { "name": "ResponsiveMixin", "module": "src/mixins/ResponsiveMixin.js" } }, { "kind": "field", "name": "displayMode", "privacy": "private", "description": "The displayMode determines normal or small screen rendering", "type": { "text": "string" }, "default": "'lg'", "attribute": "displayMode", "inheritedFrom": { "name": "ResponsiveMixin", "module": "src/mixins/ResponsiveMixin.js" } } ], "events": [ { "name": "resize", "type": { "text": "Event" }, "inheritedFrom": { "name": "ResponsiveMixin", "module": "src/mixins/ResponsiveMixin.js" } } ] } ], "exports": [ { "kind": "js", "name": "ResponsiveLitElement", "declaration": { "name": "ResponsiveLitElement", "module": "src/ResponsiveLitElement.js" } } ] }, { "kind": "javascript-module", "path": "src/StemPlayer.js", "declarations": [ { "kind": "class", "description": "A Stem Player web component", "name": "FcStemPlayer", "cssProperties": [ { "name": "--stemplayer-js-font-family", "default": "\"'Franklin Gothic Medium','Arial Narrow',Arial,sans-serif\"" }, { "name": "--stemplayer-js-font-size", "default": "16px" }, { "name": "--stemplayer-js-color", "default": "rgb(220, 220, 220)" }, { "name": "--stemplayer-js-brand-color", "default": "rgb(1, 164, 179)" }, { "name": "--stemplayer-js-background-color", "default": "black" }, { "name": "--stemplayer-js-row-height", "default": "4.5rem" }, { "name": "--stemplayer-js-waveform-color" }, { "name": "--stemplayer-js-waveform-bar-width" }, { "name": "--stemplayer-js-waveform-bar-gap" }, { "name": "--stemplayer-js-waveform-pixel-ratio" }, { "name": "--stemplayer-js-grid-base", "default": "1.5rem" }, { "name": "--stemplayer-js-max-height", "default": "auto" }, { "name": "--stemplayer-js-progress-background-color", "default": "rgba(255, 255, 255, 1)" }, { "name": "--stemplayer-js-progress-mix-blend-mode", "default": "overlay" }, { "name": "--stemplayer-js-row-controls-background-color", "default": "black" }, { "name": "--stemplayer-js-row-end-background-color", "default": "black" } ], "slots": [ { "name": "header" }, { "description": "The default (body) slot", "name": "" }, { "name": "footer" } ], "members": [ { "kind": "field", "name": "#workspace", "privacy": "private" }, { "kind": "field", "name": "#controller", "privacy": "private" }, { "kind": "field", "name": "#debouncedMergePeaks", "privacy": "private" }, { "kind": "field", "name": "#debouncedRecalculatePixelsPerSecond", "privacy": "private" }, { "kind": "field", "name": "#nLoading", "privacy": "private", "type": { "text": "number" }, "default": "0" }, { "kind": "field", "name": "#playerStateProvider", "privacy": "private", "default": "new ContextProvider(this, { context: playerStateContext, initialValue: this.playerState, })" }, { "kind": "field", "name": "#lastPeaksData", "privacy": "private", "type": { "text": "array" }, "default": "[]" }, { "kind": "method", "name": "#updatePlayerState", "privacy": "private", "parameters": [ { "name": "props", "type": { "text": "Object" } } ], "description": "Updates multiple player state properties at once and provides them to consumers" }, { "kind": "method", "name": "destroy" }, { "kind": "method", "name": "#onSlotChange", "privacy": "private", "parameters": [ { "name": "e" } ] }, { "kind": "method", "name": "#loadStem", "privacy": "private", "parameters": [ { "name": "e" } ] }, { "kind": "method", "name": "#getLargeScreenTpl", "privacy": "private" }, { "kind": "method", "name": "#getSmallScreenTpl", "privacy": "private" }, { "kind": "method", "name": "#onPlay", "privacy": "private" }, { "kind": "method", "name": "#onPause", "privacy": "private" }, { "kind": "method", "name": "#onToggleLoop", "privacy": "private" }, { "kind": "method", "name": "#onToggleCollapse", "privacy": "private" }, { "kind": "field", "name": "state", "description": "Exports the current state of the player", "readonly": true }, { "kind": "method", "name": "play", "description": "Start playback" }, { "kind": "method", "name": "pause", "description": "Pause playback" }, { "kind": "field", "name": "pct", "description": "Sets the currentTime to a pct of total duration, seeking to that time", "type": { "text": "number" } }, { "kind": "field", "name": "currentTime", "description": "Set the curentTime of playback, seeking to that time.", "type": { "text": "number" } }, { "kind": "method", "name": "#mergePeaks", "privacy": "private", "description": "Calculates the \"combined\" peaks" }, { "kind": "method", "name": "#onStemLoadingStart", "privacy": "private", "parameters": [ { "name": "e", "type": { "text": "Event" } } ] }, { "kind": "method", "name": "#onStemLoadingEnd", "privacy": "private", "parameters": [ { "name": "e", "type": { "text": "Event" } } ] }, { "kind": "method", "name": "#onWaveformDraw", "privacy": "private", "parameters": [ { "name": "e", "type": { "text": "Event" } } ], "description": "Listen to peaks events emitting from the stems" }, { "kind": "method", "name": "#onSolo", "privacy": "private", "parameters": [ { "name": "e", "type": { "text": "Event" } } ] }, { "kind": "method", "name": "#onUnSolo", "privacy": "private", "parameters": [ { "name": "e", "type": { "text": "Event" } } ] }, { "kind": "field", "name": "slottedElements", "readonly": true }, { "kind": "field", "name": "stemComponents", "description": "Get the stem componenents", "return": { "type": { "text": "Array" } }, "readonly": true }, { "kind": "field", "name": "controlsComponents", "readonly": true }, { "kind": "method", "name": "#onRegionChange", "privacy": "private", "parameters": [ { "name": "e" } ] }, { "kind": "method", "name": "#onRegionUpdate", "privacy": "private", "parameters": [ { "name": "e" } ] }, { "kind": "method", "name": "#recalculatePixelsPerSecond", "privacy": "private" }, { "kind": "method", "name": "#handleKeypress", "privacy": "private", "parameters": [ { "name": "e" } ] }, { "kind": "field", "name": "autoplay", "privacy": "public", "type": { "text": "boolean" }, "description": "Whether to (attempt) autoplay", "default": "false", "attribute": "autoplay" }, { "kind": "field", "name": "loop", "privacy": "public", "type": { "text": "boolean" }, "description": "Allows looping (experimental)", "default": "false", "attribute": "loop" }, { "kind": "field", "name": "noKeyboardEvents", "privacy": "public", "type": { "text": "boolean" }, "description": "Controls the player by keyboard events (e.g. space = start/pause)", "default": "false", "attribute": "no-keyboard-events" }, { "kind": "field", "name": "regions", "privacy": "public", "type": { "text": "boolean" }, "description": "Enable region selection", "default": "false", "attribute": "regions" }, { "kind": "field", "name": "zoom", "privacy": "public", "type": { "text": "number" }, "description": "Zoom waveform", "default": "1", "attribute": "zoom" }, { "kind": "field", "name": "collapsed", "privacy": "public", "type": { "text": "boolean" }, "default": "false", "attribute": "collapsed" }, { "kind": "field", "name": "lockRegions", "privacy": "public", "type": { "text": "boolean" }, "description": "Enable locking for the region selection", "default": "false", "attribute": "lockRegions" }, { "kind": "field", "name": "uiUpdateInterval", "privacy": "public", "type": { "text": "number" }, "description": "How often the UI should update during playback, in milliseconds.\nDefaults to 250ms (approximately 4 times per second). Controls both the\nplayer state updates and the timeupdate event emission rate.", "default": "250", "attribute": "ui-update-interval" }, { "kind": "field", "name": "pixelsPerSecond", "privacy": "public", "description": "Pixels per second for waveform rendering (calculated)", "type": { "text": "number" }, "default": "0", "attribute": "pixelsPerSecond" }, { "kind": "field", "name": "playerState", "type": { "text": "object" }, "default": "{ currentTime: 0, currentPct: 0, duration: 0, isPlaying: false, loop: false, collapsed: false, peaks: null, }" }, { "kind": "field", "name": "isLoading", "privacy": "public", "attribute": "isLoading" }, { "kind": "field", "name": "duration", "privacy": "public", "type": { "text": "number" }, "description": "overrides the duration", "attribute": "duration" }, { "kind": "field", "name": "offset", "privacy": "public", "type": { "text": "number" }, "description": "the offset", "attribute": "offset" }, { "kind": "field", "name": "audioContext", "privacy": "public", "type": { "text": "object" }, "description": "Inject a pre instantiated AudioContext", "attribute": "audioContext" }, { "kind": "field", "name": "destination", "privacy": "public", "type": { "text": "object" }, "description": "Inject a pre instantiated destination for the audio context to use", "attribute": "destination" }, { "kind": "field", "name": "audioDuration", "privacy": "public", "attribute": "audioDuration" }, { "kind": "field", "name": "regionOffset", "privacy": "public", "attribute": "regionOffset" }, { "kind": "field", "name": "regionDuration", "privacy": "public", "attribute": "regionDuration" }, { "kind": "field", "name": "properties", "static": true, "readonly": true, "inheritedFrom": { "name": "ResponsiveLitElement", "module": "src/ResponsiveLitElement.js" } }, { "kind": "field", "name": "#onResizeCallback", "privacy": "private", "inheritedFrom": { "name": "ResponsiveLitElement", "module": "src/ResponsiveLitElement.js" } }, { "kind": "field", "name": "#rafId", "privacy": "private", "type": { "text": "null" }, "default": "null", "inheritedFrom": { "name": "ResponsiveLitElement", "module": "src/ResponsiveLitElement.js" } }, { "kind": "field", "name": "#displayModeProvider", "privacy": "private", "default": "new ContextProvider(this, { context: displayModeContext, initialValue: this.displayMode, })", "inheritedFrom": { "name": "ResponsiveLitElement", "module": "src/ResponsiveLitElement.js" } }, { "kind": "method", "name": "#recalculateDisplayMode", "privacy": "private", "description": "Calculate displayMode based on component width", "inheritedFrom": { "name": "ResponsiveLitElement", "module": "src/ResponsiveLitElement.js" } }, { "kind": "method", "name": "#provideDisplayMode", "privacy": "private", "description": "Provide displayMode to all children via context\nUpdates the ContextProvider value", "inheritedFrom": { "name": "ResponsiveLitElement", "module": "src/ResponsiveLitElement.js" } }, { "kind": "method", "name": "recalculateDisplayMode", "description": "Recalculate display mode (public API for manual recalculation)", "inheritedFrom": { "name": "ResponsiveLitElement", "module": "src/ResponsiveLitElement.js" } }, { "kind": "field", "name": "displayMode", "privacy": "private", "description": "The displayMode determines normal or small screen rendering", "type": { "text": "string" }, "default": "'lg'", "attribute": "displayMode", "inheritedFrom": { "name": "ResponsiveLitElement", "module": "src/ResponsiveLitElement.js" } } ], "events": [ { "name": "event", "type": { "text": "CustomEvent" } }, { "name": "timeupdate", "type": { "text": "CustomEvent" }, "description": "Fires the player progresses" }, { "name": "loading-end", "type": { "text": "Event" }, "description": "Fires when the player completes loading data" }, { "name": "loading-start", "type": { "text": "Event" }, "description": "Fires when the player starts loading data" }, { "name": "error", "type": { "text": "ErrorEvent" } }, { "name": "peaks", "type": { "text": "CustomEvent" } }, { "description": "Fires when the player starts playing", "name": "start" }, { "description": "Fires when the player pauses playback", "name": "pause" }, { "description": "Fires when the player seeks", "name": "seek" }, { "description": "Fires when the player reaches the end of the playback", "name": "end" }, { "name": "resize", "type": { "text": "Event" }, "inheritedFrom": { "name": "ResponsiveLitElement", "module": "src/ResponsiveLitElement.js" } } ], "attributes": [ { "name": "isLoading", "fieldName": "isLoading" }, { "name": "autoplay", "type": { "text": "boolean" }, "description": "Whether to (attempt) autoplay", "default": "false", "fieldName": "autoplay" }, { "name": "duration", "type": { "text": "number" }, "description": "overrides the duration", "fieldName": "duration" }, { "name": "offset", "type": { "text": "number" }, "description": "the offset", "fieldName": "offset" }, { "name": "loop", "type": { "text": "boolean" }, "description": "Allows looping (experimental)", "default": "false", "fieldName": "loop" }, { "name": "zoom", "type": { "text": "number" }, "description": "Zoom waveform", "default": "1", "fieldName": "zoom" }, { "name": "regions", "type": { "text": "boolean" }, "description": "Enable region selection", "default": "false", "fieldName": "regions" }, { "name": "audioContext", "type": { "text": "object" }, "description": "Inject a pre instantiated AudioContext", "fieldName": "audioContext" }, { "name": "destination", "type": { "text": "object" }, "description": "Inject a pre instantiated destination for the audio context to use", "fieldName": "destination" }, { "name": "no-keyboard-events", "type": { "text": "boolean" }, "description": "Controls the player by keyboard events (e.g. space = start/pause)", "default": "false", "fieldName": "noKeyboardEvents" }, { "name": "audioDuration", "fieldName": "audioDuration" }, { "name": "regionOffset", "fieldName": "regionOffset" }, { "name": "regionDuration", "fieldName": "regionDuration" }, { "name": "collapsed", "type": { "text": "boolean" }, "default": "false", "fieldName": "collapsed" }, { "name": "lockRegions", "type": { "text": "boolean" }, "description": "Enable locking for the region selection", "default": "false", "fieldName": "lockRegions" }, { "name": "ui-update-interval", "type": { "text": "number" }, "description": "How often the UI should update during playback, in milliseconds.\nDefaults to 250ms (approximately 4 times per second). Controls both the\nplayer state updates and the timeupdate event emission rate.", "default": "250", "fieldName": "uiUpdateInterval" }, { "name": "pixelsPerSecond", "description": "Pixels per second for waveform rendering (calculated)", "type": { "text": "number" }, "default": "0", "fieldName": "pixelsPerSecond" }, { "name": "displayMode", "description": "The displayMode determines normal or small screen rendering", "type": { "text": "string" }, "default": "'lg'", "fieldName": "displayMode", "inheritedFrom": { "name": "ResponsiveLitElement", "module": "src/ResponsiveLitElement.js" } } ], "superclass": { "name": "ResponsiveLitElement", "module": "/src/ResponsiveLitElement.js" }, "tagName": "stemplayer-js", "customElement": true } ], "exports": [ { "kind": "js", "name": "FcStemPlayer", "declaration": { "name": "FcStemPlayer", "module": "src/StemPlayer.js" } } ] }, { "kind": "javascript-module", "path": "src/StemPlayerBaseRow.js", "declarations": [ { "kind": "class", "description": "Base row component that provides shared styles, structure, and lifecycle\nfor StemPlayerStem and StemPlayerControls.", "name": "StemPlayerBaseRow", "members": [ { "kind": "field", "name": "currentPct", "privacy": "public", "type": { "text": "number" }, "description": "The percentage of the current time", "attribute": "currentPct" }, { "kind": "method", "name": "updateProgress", "parameters": [ { "name": "val" } ], "description": "Called when currentPct is updated so that subclasses can directly update\ntheir UI controls without triggering a Lit re-render." }, { "kind": "method", "name": "renderLargeScreen" }, { "kind": "method", "name": "renderSmallScreen" }, { "kind": "field", "name": "label", "privacy": "public", "type": { "text": "string" }, "description": "The label to display", "attribute": "label" }, { "kind": "field", "name": "duration", "privacy": "public", "type": { "text": "number" }, "description": "The duration of the track", "attribute": "duration" }, { "kind": "field", "name": "#cachedWaveformStyles", "privacy": "private", "type": { "text": "null" }, "default": "null", "description": "Cached computed styles. Cached on firstUpdated and invalidated only on resize", "inheritedFrom": { "name": "WaveformHostMixin", "module": "src/mixins/WaveformHostMixin.js" } }, { "kind": "field", "name": "#resizeObserver", "privacy": "private", "type": { "text": "null" }, "default": "null", "description": "ResizeObserver to detect when the component's size changes", "inheritedFrom": { "name": "WaveformHostMixin", "module": "src/mixins/WaveformHostMixin.js" } }, { "kind": "method", "name": "getComputedWaveformStyles", "description": "Calculates the styles for rendering the waveform\nResults are cached until the component is resized", "privacy": "private", "inheritedFrom": { "name": "WaveformHostMixin", "module": "src/mixins/WaveformHostMixin.js" } }, { "kind": "method", "name": "computeWaveformStyles", "description": "Computes waveform styles from CSS custom properties\nResults are cached per resize to avoid expensive getComputedStyle calls", "privacy": "private", "inheritedFrom": { "name": "WaveformHostMixin", "module": "src/mixins/WaveformHostMixin.js" } }, { "kind": "field", "name": "_playerStateConsumer", "default": "new ContextConsumer(this, { context: playerStateContext, callback: state => { if (state !== undefined) { // Apply all player state properties automatically // Doing this means Lit will batch updates if multiple properties are set for (const key of Object.keys(state)) { try { this[key] = state[key]; } catch (e) { // Safely ignore getter-only properties (like 'peaks' on StemPlayerStem) } } } }, subscribe: true, })", "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } }, { "kind": "field", "name": "properties", "static": true, "readonly": true, "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } }, { "kind": "field", "name": "displayMode", "privacy": "private", "description": "The displayMode determines normal or small screen rendering\nConsumed from parent via context", "type": { "text": "string" }, "default": "'lg'", "attribute": "displayMode", "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } }, { "kind": "field", "name": "_displayModeConsumer", "default": "new ContextConsumer(this, { context: displayModeContext, callback: value => { if (value !== undefined) { this.displayMode = value; } }, subscribe: true, // Subscribe to updates })", "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } } ], "attributes": [ { "name": "label", "type": { "text": "string" }, "description": "The label to display", "fieldName": "label" }, { "name": "duration", "type": { "text": "number" }, "description": "The duration of the track", "fieldName": "duration" }, { "name": "currentPct", "type": { "text": "number" }, "description": "The percentage of the current time", "fieldName": "currentPct" }, { "name": "displayMode", "description": "The displayMode determines normal or small screen rendering\nConsumed from parent via context", "type": { "text": "string" }, "default": "'lg'", "fieldName": "displayMode", "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } } ], "mixins": [ { "name": "WaveformHostMixin", "module": "/src/mixins/WaveformHostMixin.js" } ], "superclass": { "name": "ResponsiveConsumerLitElement", "module": "/src/ResponsiveConsumerLitElement.js" } } ], "exports": [ { "kind": "js", "name": "StemPlayerBaseRow", "declaration": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } } ] }, { "kind": "javascript-module", "path": "src/StemPlayerControls.js", "declarations": [ { "kind": "class", "description": "A component to render a single stem", "name": "FcStemPlayerControls", "cssProperties": [ { "name": "--stemplayer-js-controls-color" }, { "name": "--stemplayer-js-controls-background-color" } ], "members": [ { "kind": "field", "name": "#debouncedHandleSeek", "privacy": "private" }, { "kind": "field", "name": "currentTime", "privacy": "public", "type": { "text": "number" }, "description": "The current time of playback", "attribute": "currentTime" }, { "kind": "method", "name": "updateProgress", "parameters": [ { "name": "val" } ], "description": "Called when currentPct is updated so that subclasses can directly update\ntheir UI controls without triggering a Lit re-render.", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "kind": "method", "name": "renderLargeScreen", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "kind": "method", "name": "renderSmallScreen", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "kind": "method", "name": "#onPlayClick", "privacy": "private" }, { "kind": "method", "name": "#onPauseClick", "privacy": "private" }, { "kind": "method", "name": "#onDownloadClick", "privacy": "private" }, { "kind": "method", "name": "#onToggleCollapseClick", "privacy": "private" }, { "kind": "method", "name": "#handleSeeking", "privacy": "private" }, { "kind": "method", "name": "#handleSeek", "privacy": "private", "parameters": [ { "name": "e" } ] }, { "kind": "method", "name": "#toggleLoop", "privacy": "private", "parameters": [ { "name": "e" } ] }, { "kind": "method", "name": "#onZoominClick", "privacy": "private" }, { "kind": "method", "name": "#onZoomoutClick", "privacy": "private" }, { "kind": "method", "name": "isControlEnabled", "parameters": [ { "name": "value" } ] }, { "kind": "method", "name": "#renderControl", "privacy": "private", "parameters": [ { "name": "value" }, { "name": "mandatory" } ] }, { "kind": "field", "name": "collapsed" }, { "kind": "field", "name": "controls", "privacy": "public", "type": { "text": "array" }, "description": "The controls that are enables", "default": "['playpause', 'loop', 'progress', 'duration', 'time']", "attribute": "controls" }, { "kind": "field", "name": "peaks", "privacy": "public", "type": { "text": "object" }, "description": "The peaks data that are to be used for displaying the waveform", "attribute": "peaks" }, { "kind": "field", "name": "isPlaying", "privacy": "public", "type": { "text": "boolean" }, "description": "The playing state", "attribute": "isPlaying" }, { "kind": "field", "name": "loop", "privacy": "public", "type": { "text": "boolean" }, "description": "Whether the loop is toggled on or off", "attribute": "loop" }, { "kind": "field", "name": "#cachedWaveformStyles", "privacy": "private", "type": { "text": "null" }, "default": "null", "description": "Cached computed styles. Cached on firstUpdated and invalidated only on resize", "inheritedFrom": { "name": "WaveformHostMixin", "module": "src/mixins/WaveformHostMixin.js" } }, { "kind": "field", "name": "#resizeObserver", "privacy": "private", "type": { "text": "null" }, "default": "null", "description": "ResizeObserver to detect when the component's size changes", "inheritedFrom": { "name": "WaveformHostMixin", "module": "src/mixins/WaveformHostMixin.js" } }, { "kind": "method", "name": "getComputedWaveformStyles", "description": "Calculates the styles for rendering the waveform\nResults are cached until the component is resized", "privacy": "private", "inheritedFrom": { "name": "WaveformHostMixin", "module": "src/mixins/WaveformHostMixin.js" } }, { "kind": "method", "name": "computeWaveformStyles", "description": "Computes waveform styles from CSS custom properties\nResults are cached per resize to avoid expensive getComputedStyle calls", "privacy": "private", "inheritedFrom": { "name": "WaveformHostMixin", "module": "src/mixins/WaveformHostMixin.js" } }, { "kind": "field", "name": "currentPct", "privacy": "public", "type": { "text": "number" }, "description": "The percentage of the current time", "attribute": "currentPct", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "kind": "field", "name": "label", "privacy": "public", "type": { "text": "string" }, "description": "The label to display", "attribute": "label", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "kind": "field", "name": "duration", "privacy": "public", "type": { "text": "number" }, "description": "The duration of the track", "attribute": "duration", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "kind": "field", "name": "_playerStateConsumer", "default": "new ContextConsumer(this, { context: playerStateContext, callback: state => { if (state !== undefined) { // Apply all player state properties automatically // Doing this means Lit will batch updates if multiple properties are set for (const key of Object.keys(state)) { try { this[key] = state[key]; } catch (e) { // Safely ignore getter-only properties (like 'peaks' on StemPlayerStem) } } } }, subscribe: true, })", "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } }, { "kind": "field", "name": "properties", "static": true, "readonly": true, "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } }, { "kind": "field", "name": "displayMode", "privacy": "private", "description": "The displayMode determines normal or small screen rendering\nConsumed from parent via context", "type": { "text": "string" }, "default": "'lg'", "attribute": "displayMode", "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } }, { "kind": "field", "name": "_displayModeConsumer", "default": "new ContextConsumer(this, { context: displayModeContext, callback: value => { if (value !== undefined) { this.displayMode = value; } }, subscribe: true, // Subscribe to updates })", "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } } ], "events": [ { "name": "controls:play", "type": { "text": "Event" } }, { "name": "controls:pause", "type": { "text": "Event" } }, { "name": "controls:download", "type": { "text": "Event" } }, { "name": "controls:collapse", "type": { "text": "Event" } }, { "name": "controls:seeking", "type": { "text": "CustomEvent" } }, { "name": "controls:seek", "type": { "text": "CustomEvent" } }, { "name": "controls:loop", "type": { "text": "CustomEvent" } }, { "name": "controls:zoom:in", "type": { "text": "Event" } }, { "name": "controls:zoom:out", "type": { "text": "Event" } } ], "attributes": [ { "name": "currentTime", "type": { "text": "number" }, "description": "The current time of playback", "fieldName": "currentTime" }, { "name": "peaks", "type": { "text": "object" }, "description": "The peaks data that are to be used for displaying the waveform", "fieldName": "peaks" }, { "name": "isPlaying", "type": { "text": "boolean" }, "description": "The playing state", "fieldName": "isPlaying" }, { "name": "loop", "type": { "text": "boolean" }, "description": "Whether the loop is toggled on or off", "fieldName": "loop" }, { "name": "controls", "type": { "text": "array" }, "description": "The controls that are enables", "default": "['playpause', 'loop', 'progress', 'duration', 'time']", "fieldName": "controls" }, { "name": "label", "type": { "text": "string" }, "description": "The label to display", "fieldName": "label", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "name": "duration", "type": { "text": "number" }, "description": "The duration of the track", "fieldName": "duration", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "name": "currentPct", "type": { "text": "number" }, "description": "The percentage of the current time", "fieldName": "currentPct", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "name": "displayMode", "description": "The displayMode determines normal or small screen rendering\nConsumed from parent via context", "type": { "text": "string" }, "default": "'lg'", "fieldName": "displayMode", "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } } ], "superclass": { "name": "StemPlayerBaseRow", "module": "/src/StemPlayerBaseRow.js" }, "tagName": "stemplayer-js-controls", "customElement": true } ], "exports": [ { "kind": "js", "name": "FcStemPlayerControls", "declaration": { "name": "FcStemPlayerControls", "module": "src/StemPlayerControls.js" } } ] }, { "kind": "javascript-module", "path": "src/StemPlayerStem.js", "declarations": [ { "kind": "class", "description": "A component to render a single stem", "name": "FcStemPlayerStem", "members": [ { "kind": "field", "name": "#volume", "privacy": "private", "type": { "text": "Number" }, "default": "1" }, { "kind": "field", "name": "#HLS", "privacy": "private", "type": { "text": "HLS" } }, { "kind": "method", "name": "load", "parameters": [ { "name": "controller" } ] }, { "kind": "method", "name": "unload" }, { "kind": "method", "name": "requestLoad", "description": "When the src changes, trigger a request to reload the stem (in the context of the player)" }, { "kind": "method", "name": "renderSmallScreen", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "kind": "method", "name": "renderLargeScreen", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "kind": "method", "name": "#toggleMute", "privacy": "private" }, { "kind": "method", "name": "#onSoloClick", "privacy": "private" }, { "kind": "method", "name": "#dispatchSoloEvent", "privacy": "private", "description": "Dispatch event so that the solo state of other stems can be modified" }, { "kind": "method", "name": "#onUnSoloClick", "privacy": "private" }, { "kind": "method", "name": "#handleVolume", "privacy": "private", "parameters": [ { "name": "v" } ] }, { "kind": "field", "name": "volume", "privacy": "public", "type": { "text": "number" }, "description": "Get the current volume, while taking into consideration the values for `muted` and `solo`.", "attribute": "volume" }, { "kind": "field", "name": "peaks", "return": { "type": { "text": "Array" } }, "readonly": true }, { "kind": "field", "name": "waveformComponent", "privacy": "private", "readonly": true }, { "kind": "field", "name": "solo", "privacy": "public", "type": { "text": "string" }, "parameters": [ { "description": "The solo state. 'on' = solo this stem; 'muted' = another stem is soloed, mute this one", "name": "solo", "type": { "text": "('off'|'on'|'muted')" } } ], "default": "'off'", "attribute": "solo" }, { "kind": "field", "name": "src", "privacy": "public", "type": { "text": "string" }, "description": "The url of the audio file", "attribute": "src" }, { "kind": "field", "name": "waveform", "privacy": "public", "type": { "text": "string" }, "description": "The url of the waveform file", "attribute": "waveform" }, { "kind": "field", "name": "muted", "privacy": "public", "type": { "text": "boolean" }, "attribute": "muted" }, { "kind": "field", "name": "waveColor", "privacy": "public", "type": { "text": "string" }, "description": "The colour of the waveform", "attribute": "waveColor" }, { "kind": "field", "name": "waveProgressColor", "privacy": "public", "type": { "text": "string" }, "description": "The wave progress colour", "attribute": "waveProgressColor" }, { "kind": "field", "name": "#cachedWaveformStyles", "privacy": "private", "type": { "text": "null" }, "default": "null", "description": "Cached computed styles. Cached on firstUpdated and invalidated only on resize", "inheritedFrom": { "name": "WaveformHostMixin", "module": "src/mixins/WaveformHostMixin.js" } }, { "kind": "field", "name": "#resizeObserver", "privacy": "private", "type": { "text": "null" }, "default": "null", "description": "ResizeObserver to detect when the component's size changes", "inheritedFrom": { "name": "WaveformHostMixin", "module": "src/mixins/WaveformHostMixin.js" } }, { "kind": "method", "name": "getComputedWaveformStyles", "description": "Calculates the styles for rendering the waveform\nResults are cached until the component is resized", "privacy": "private", "inheritedFrom": { "name": "WaveformHostMixin", "module": "src/mixins/WaveformHostMixin.js" } }, { "kind": "method", "name": "computeWaveformStyles", "description": "Computes waveform styles from CSS custom properties\nResults are cached per resize to avoid expensive getComputedStyle calls", "privacy": "private", "inheritedFrom": { "name": "WaveformHostMixin", "module": "src/mixins/WaveformHostMixin.js" } }, { "kind": "field", "name": "currentPct", "privacy": "public", "type": { "text": "number" }, "description": "The percentage of the current time", "attribute": "currentPct", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "kind": "method", "name": "updateProgress", "parameters": [ { "name": "val" } ], "description": "Called when currentPct is updated so that subclasses can directly update\ntheir UI controls without triggering a Lit re-render.", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "kind": "field", "name": "label", "privacy": "public", "type": { "text": "string" }, "description": "The label to display", "attribute": "label", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "kind": "field", "name": "duration", "privacy": "public", "type": { "text": "number" }, "description": "The duration of the track", "attribute": "duration", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "kind": "field", "name": "_playerStateConsumer", "default": "new ContextConsumer(this, { context: playerStateContext, callback: state => { if (state !== undefined) { // Apply all player state properties automatically // Doing this means Lit will batch updates if multiple properties are set for (const key of Object.keys(state)) { try { this[key] = state[key]; } catch (e) { // Safely ignore getter-only properties (like 'peaks' on StemPlayerStem) } } } }, subscribe: true, })", "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } }, { "kind": "field", "name": "properties", "static": true, "readonly": true, "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } }, { "kind": "field", "name": "displayMode", "privacy": "private", "description": "The displayMode determines normal or small screen rendering\nConsumed from parent via context", "type": { "text": "string" }, "default": "'lg'", "attribute": "displayMode", "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } }, { "kind": "field", "name": "_displayModeConsumer", "default": "new ContextConsumer(this, { context: displayModeContext, callback: value => { if (value !== undefined) { this.displayMode = value; } }, subscribe: true, // Subscribe to updates })", "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } } ], "events": [ { "name": "stem:load:start", "type": { "text": "Event" } }, { "name": "stem:load:end", "type": { "text": "Event" } }, { "name": "error", "type": { "text": "ErrorEvent" } }, { "name": "stem:load:error", "type": { "text": "CustomEvent" } }, { "name": "stem:load:request", "type": { "text": "Event" } }, { "name": "event", "type": { "text": "CustomEvent" } } ], "attributes": [ { "name": "src", "type": { "text": "string" }, "description": "The url of the audio file", "fieldName": "src" }, { "name": "waveform", "type": { "text": "string" }, "description": "The url of the waveform file", "fieldName": "waveform" }, { "name": "solo", "type": { "text": "string" }, "parameters": [ { "description": "The solo state. 'on' = solo this stem; 'muted' = another stem is soloed, mute this one", "name": "solo", "type": { "text": "('off'|'on'|'muted')" } } ], "default": "'off'", "fieldName": "solo" }, { "name": "muted", "type": { "text": "boolean" }, "fieldName": "muted" }, { "name": "volume", "type": { "text": "number" }, "description": "Get the current volume, while taking into consideration the values for `muted` and `solo`.", "fieldName": "volume" }, { "name": "waveColor", "type": { "text": "string" }, "description": "The colour of the waveform", "fieldName": "waveColor" }, { "name": "waveProgressColor", "type": { "text": "string" }, "description": "The wave progress colour", "fieldName": "waveProgressColor" }, { "name": "label", "type": { "text": "string" }, "description": "The label to display", "fieldName": "label", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "name": "duration", "type": { "text": "number" }, "description": "The duration of the track", "fieldName": "duration", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "name": "currentPct", "type": { "text": "number" }, "description": "The percentage of the current time", "fieldName": "currentPct", "inheritedFrom": { "name": "StemPlayerBaseRow", "module": "src/StemPlayerBaseRow.js" } }, { "name": "displayMode", "description": "The displayMode determines normal or small screen rendering\nConsumed from parent via context", "type": { "text": "string" }, "default": "'lg'", "fieldName": "displayMode", "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } } ], "superclass": { "name": "StemPlayerBaseRow", "module": "/src/StemPlayerBaseRow.js" }, "tagName": "stemplayer-js-stem", "customElement": true } ], "exports": [ { "kind": "js", "name": "FcStemPlayerStem", "declaration": { "name": "FcStemPlayerStem", "module": "src/StemPlayerStem.js" } } ] }, { "kind": "javascript-module", "path": "src/Workspace.js", "declarations": [ { "kind": "class", "description": "An area that represents the timeline providing functionality to select regions", "name": "Workspace", "members": [ { "kind": "field", "name": "#horizonEl", "privacy": "private" }, { "kind": "field", "name": "#mouseDownX", "privacy": "private", "description": "A mouse event offsetX coordinate" }, { "kind": "field", "name": "#mouseDownTime", "privacy": "private", "description": "A Date representing when the mouse was clicked" }, { "kind": "field", "name": "#mouseMoveWidth", "privacy": "private", "description": "How far the mouse was moved" }, { "kind": "field", "name": "#onMouseUpHandler", "privacy": "private", "description": "Event handler" }, { "kind": "field", "name": "#wheelEventHandler", "privacy": "private" }, { "kind": "method", "name": "#onMouseDown", "privacy": "private", "parameters": [ { "name": "e" } ] }, { "kind": "method", "name": "#onMouseMove", "privacy": "private", "parameters": [ { "name": "e" } ] }, { "kind": "method", "name": "#onMouseOut", "privacy": "private" }, { "kind": "method", "name": "#onMouseUp", "privacy": "private" }, { "kind": "method", "name": "#onDeselectClick", "privacy": "private", "parameters": [ { "name": "e" } ] }, { "kind": "method", "name": "#handleClick", "privacy": "private", "parameters": [ { "name": "e" } ] }, { "kind": "field", "name": "dragState", "description": "Gets the current selection state.\n\nWhen a handle is being dragged, we return the public properties\n(which are updated by the handle-drag code). Otherwise, we compute\nthe state from the normal region drag selection.", "return": { "type": { "text": "{offset: Number, duration: Number}" } }, "readonly": true }, { "kind": "field", "name": "waveformWidth", "readonly": true }, { "kind": "method", "name": "#onHover", "privacy": "private", "parameters": [ { "name": "e" } ] }, { "kind": "method", "name": "resolveOffsets", "parameters": [ { "name": "e" } ] }, { "kind": "field", "name": "horizon", "description": "The horizon represents the limit in which mouse events matter. It coincides with the area where the waveforms are rendered\nWe do not simply render an absolutely positioned overlay and listen to events on that element, since this would disrupt the normal\nevent paths, and would prevent us from e.g. listening to click events on a inner element such as a stem.", "readonly": true }, { "kind": "method", "name": "#onRegionMouseDown", "privacy": "private", "parameters": [ { "name": "e" } ] }, { "kind": "field", "name": "totalDuration", "privacy": "public", "type": { "text": "number" }, "attribute": "totalDuration" }, { "kind": "field", "name": "offset", "privacy": "public", "type": { "text": "number" }, "attribute": "offset" }, { "kind": "field", "name": "regionDuration", "privacy": "public", "type": { "text": "number" }, "attribute": "regionDuration" }, { "kind": "field", "name": "regions", "privacy": "public", "type": { "text": "boolean" }, "attribute": "regions" }, { "kind": "field", "name": "cursorPosition", "privacy": "public", "attribute": "cursorPosition" }, { "kind": "field", "name": "lockRegions", "privacy": "public", "type": { "text": "boolean" }, "attribute": "lockRegions" }, { "kind": "field", "name": "pixelsPerSecond", "privacy": "public", "type": { "text": "number" }, "attribute": "pixelsPerSecond" }, { "kind": "field", "name": "_playerStateConsumer", "default": "new ContextConsumer(this, { context: playerStateContext, callback: state => { if (state !== undefined) { // Apply all player state properties automatically // Doing this means Lit will batch updates if multiple properties are set for (const key of Object.keys(state)) { try { this[key] = state[key]; } catch (e) { // Safely ignore getter-only properties (like 'peaks' on StemPlayerStem) } } } }, subscribe: true, })", "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } }, { "kind": "field", "name": "properties", "static": true, "readonly": true, "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } }, { "kind": "field", "name": "displayMode", "privacy": "private", "description": "The displayMode determines normal or small screen rendering\nConsumed from parent via context", "type": { "text": "string" }, "default": "'lg'", "attribute": "displayMode", "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } }, { "kind": "field", "name": "_displayModeConsumer", "default": "new ContextConsumer(this, { context: displayModeContext, callback: value => { if (value !== undefined) { this.displayMode = value; } }, subscribe: true, // Subscribe to updates })", "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } } ], "events": [ { "name": "region:update", "type": { "text": "CustomEvent" } }, { "name": "region:change", "type": { "text": "CustomEvent" } }, { "name": "region:seek", "type": { "text": "CustomEvent" } }, { "name": "region:hover", "type": { "text": "CustomEvent" } } ], "attributes": [ { "name": "totalDuration", "type": { "text": "number" }, "fieldName": "totalDuration" }, { "name": "offset", "type": { "text": "number" }, "fieldName": "offset" }, { "name": "regionDuration", "type": { "text": "number" }, "fieldName": "regionDuration" }, { "name": "regions", "type": { "text": "boolean" }, "fieldName": "regions" }, { "name": "cursorPosition", "fieldName": "cursorPosition" }, { "name": "lockRegions", "type": { "text": "boolean" }, "fieldName": "lockRegions" }, { "name": "pixelsPerSecond", "type": { "text": "number" }, "fieldName": "pixelsPerSecond" }, { "name": "displayMode", "description": "The displayMode determines normal or small screen rendering\nConsumed from parent via context", "type": { "text": "string" }, "default": "'lg'", "fieldName": "displayMode", "inheritedFrom": { "name": "ResponsiveConsumerLitElement", "module": "src/ResponsiveConsumerLitElement.js" } } ], "superclass": { "name": "ResponsiveConsumerLitElement", "module": "/src/ResponsiveConsumerLitElement.js" }, "tagName": "stemplayer-js-workspace", "customElement": true } ], "exports": [ { "kind": "js", "name": "Workspace", "declaration": { "name": "Workspace", "module": "src/Workspace.js" } } ] }, { "kind": "javascript-module", "path": "src/config.js", "declarations": [ { "kind": "variable", "name": "fetchOptions", "type": { "text": "object" }, "default": "{}" }, { "kind": "variable", "name": "responsiveBreakpoints", "type": { "text": "object" }, "default": "{ xs: '600', sm: '800', }" }, { "kind": "variable", "name": "waveform", "type": { "text": "object" }, "default": "{ waveColor: '#AAA', progressColor: 'rgb(0, 206, 224)', devicePixelRatio: 2, barGap: 2, barWidth: 2, }" }, { "kind": "variable", "name": "defaults", "type": { "text": "object" }, "default": "{ waveform, }" } ], "exports": [ { "kind": "js", "name": "fetchOptions", "declaration": { "name": "fetchOptions", "module": "src/config.js" } }, { "kind": "js", "name": "responsiveBreakpoints", "declaration": { "name": "responsiveBreakpoints", "module": "src/config.js" } }, { "kind": "js", "name": "waveform", "declaration": { "name": "waveform", "module": "src/config.js" } }, { "kind": "js", "name": "defaults", "declaration": { "name": "defaults", "module": "src/config.js" } }, { "kind": "js", "name": "default", "declaration": { "module": "src/config.js" } } ] }, { "kind": "javascript-module", "path": "src/contexts.js", "declarations": [ { "kind": "variable", "name": "displayModeContext", "description": "Context for cascading display mode from parent to children\nPrevents each child component from recalculating responsive breakpoints" }, { "kind": "variable", "name": "playerStateContext", "description": "Context for cascading player state from parent to children\nPrevents unnecessary DOM traversals and ensures batch Lit renders" } ], "exports": [ { "kind": "js", "name": "displayModeContext", "declaration": { "name": "displayModeContext", "module": "src/contexts.js" } }, { "kind": "js", "name": "playerStateContext", "declaration": { "name": "playerStateContext", "module": "src/contexts.js" } } ] }, { "kind": "javascript-module", "path": "src/lib/debounce.js", "declarations": [ { "kind": "function", "name": "debounce", "parameters": [ { "name": "func" }, { "name": "wait" }, { "name": "immediate" } ] } ], "exports": [ { "kind": "js", "name": "default", "declaration": { "name": "debounce", "module": "src/lib/debounce.js" } } ] }, { "kind": "javascript-module", "path": "src/lib/downsample.js", "declarations": [ { "kind": "function", "name": "largestTriangleThreeBuckets", "parameters": [ { "name": "data" }, { "name": "threshold" } ] } ], "exports": [ { "kind": "js", "name": "default", "declaration": { "name": "largestTriangleThreeBuckets", "module": "src/lib/downsample.js" } } ] }, { "kind": "javascript-module", "path": "src/lib/format-seconds.js", "declarations": [], "exports": [ { "kind": "js", "name": "default", "declaration": { "module": "src/lib/format-seconds.js" } } ] }, { "kind": "javascript-module", "path": "src/lib/on-resize.js", "declarations": [], "exports": [ { "kind": "js", "name": "default", "declaration": { "module": "src/lib/on-resize.js" } } ] }, { "kind": "javascript-module", "path": "src/mixins/PlayerStateConsumerMixin.js", "declarations": [ { "kind": "mixin", "description": "", "name": "PlayerStateConsumerMixin", "members": [ { "kind": "field", "name": "_playerStateConsumer", "default": "new ContextConsumer(this, { context: playerStateContext, callback: state => { if (state !== undefined) { // Apply all player state properties automatically // Doing this means Lit will batch updates if multiple properties are set for (const key of Object.keys(state)) { try { this[key] = state[key]; } catch (e) { // Safely ignore getter-only properties (like 'peaks' on StemPlayerStem) } } } }, subscribe: true, })" } ], "parameters": [ { "name": "superClass" } ] } ], "exports": [ { "kind": "js", "name": "PlayerStateConsumerMixin", "declaration": { "name": "PlayerStateConsumerMixin", "module": "src/mixins/PlayerStateConsumerMixin.js" } } ] }, { "kind": "javascript-module", "path": "src/mixins/ResponsiveConsumerMixin.js", "declarations": [ { "kind": "mixin", "description": "Consumer mixin for child components that receive displayMode from a parent provider.\nChildren should use this instead of ResponsiveMixin to avoid redundant resize observers.", "name": "ResponsiveConsumerMixin", "members": [ { "kind": "field", "name": "properties", "static": true, "readonly": true }, { "kind": "field", "name": "displayMode", "privacy": "private", "description": "The displayMode determines normal or small screen rendering\nConsumed from parent via context", "type": { "text": "string" }, "default": "'lg'", "attribute": "displayMode" }, { "kind": "field", "name": "_displayModeConsumer", "default": "new ContextConsumer(this, { context: displayModeContext, callback: value => { if (value !== undefined) { this.displayMode = value; } }, subscribe: true, // Subscribe to updates })" } ], "attributes": [ { "name": "displayMode", "description": "The displayMode determines normal or small screen rendering\nConsumed from parent via context", "type": { "text": "string" }, "default": "'lg'", "fieldName": "displayMode" } ], "parameters": [ { "name": "superClass" } ] } ], "exports": [ { "kind": "js", "name": "ResponsiveConsumerMixin", "declaration": { "name": "ResponsiveConsumerMixin", "module": "src/mixins/ResponsiveConsumerMixin.js" } } ] }, { "kind": "javascript-module", "path": "src/mixins/ResponsiveMixin.js", "declarations": [ { "kind": "mixin", "description": "Provider mixin for the parent component that calculates displayMode\nand provides it to all children via context.\nOnly ONE component in the tree should use this mixin (the parent).", "name": "ResponsiveMixin", "members": [ { "kind": "field", "name": "properties", "static": true, "readonly": true }, { "kind": "field", "name": "#onResizeCallback", "privacy": "private" }, { "kind": "field", "name": "#rafId", "privacy": "private", "type": { "text": "null" }, "default": "null" }, { "kind": "field", "name": "#displayModeProvider", "privacy": "private", "default": "new ContextProvider(this, { context: displayModeContext, initialValue: this.displayMode, })" }, { "kind": "method", "name": "#recalculateDisplayMode", "privacy": "private", "description": "Calculate displayMode based on component width" }, { "kind": "method", "name": "#provideDisplayMode", "privacy": "private", "description": "Provide displayMode to all children via context\nUpdates the ContextProvider value" }, { "kind": "method", "name": "recalculateDisplayMode", "description": "Recalculate display mode (public API for manual recalculation)" }, { "kind": "field", "name": "displayMode", "privacy": "private", "description": "The displayMode determines normal or small screen rendering", "type": { "text": "string" }, "default": "'lg'", "attribute": "displayMode" } ], "events": [ { "name": "resize", "type": { "text": "Event" } } ], "attributes": [ { "name": "displayMode", "description": "The displayMode determines normal or small screen rendering", "type": { "text": "string" }, "default": "'lg'", "fieldName": "displayMode" } ], "parameters": [ { "name": "superClass" } ] } ], "exports": [ { "kind": "js", "name": "ResponsiveMixin", "declaration": { "name": "ResponsiveMixin", "module": "src/mixins/ResponsiveMixin.js" } } ] }, { "kind": "javascript-module", "path": "src/mixins/WaveformHostMixin.js", "declarations": [ { "kind": "mixin", "description": "A component to render a single stem", "name": "WaveformHostMixin", "members": [ { "kind": "field", "name": "#cachedWaveformStyles", "privacy": "private", "type": { "text": "null" }, "default": "null", "description": "Cached computed styles. Cached on firstUpdated and invalidated only on resize" }, { "kind": "field", "name": "#resizeObserver", "privacy": "private", "type": { "text": "null" }, "default": "null", "description": "ResizeObserver to detect when the component's size changes" }, { "kind": "method", "name": "getComputedWaveformStyles", "description": "Calculates the styles for rendering the waveform\nResults are cached until the component is resized", "privacy": "private" }, { "kind": "method", "name": "computeWaveformStyles", "description": "Computes waveform styles from CSS custom properties\nResults are cached per resize to avoid expensive getComputedStyle calls", "privacy": "private" } ], "parameters": [ { "name": "superClass" } ] } ], "exports": [ { "kind": "js", "name": "WaveformHostMixin", "declaration": { "name": "WaveformHostMixin", "module": "src/mixins/WaveformHostMixin.js" } } ] }, { "kind": "javascript-module", "path": "src/styles/backgrounds.js", "declarations": [], "exports": [ { "kind": "js", "name": "default", "declaration": { "module": "src/styles/backgrounds.js" } } ] }, { "kind": "javascript-module", "path": "src/styles/flex.js", "declarations": [], "exports": [ { "kind": "js", "name": "default", "declaration": { "module": "src/styles/flex.js" } } ] }, { "kind": "javascript-module", "path": "src/styles/grid.js", "declarations": [], "exports": [ { "kind": "js", "name": "default", "declaration": { "module": "src/styles/grid.js" } } ] }, { "kind": "javascript-module", "path": "src/styles/row.js", "declarations": [], "exports": [ { "kind": "js", "name": "default", "declaration": { "module": "src/styles/row.js" } } ] }, { "kind": "javascript-module", "path": "src/styles/spacing.js", "declarations": [], "exports": [ { "kind": "js", "name": "default", "declaration": { "module": "src/styles/spacing.js" } } ] }, { "kind": "javascript-module", "path": "src/styles/typography.js", "declarations": [], "exports": [ { "kind": "js", "name": "default", "declaration": { "module": "src/styles/typography.js" } } ] }, { "kind": "javascript-module", "path": "src/styles/utilities.js", "declarations": [], "exports": [ { "kind": "js", "name": "default", "declaration": { "module": "src/styles/utilities.js" } } ] } ] }