v0.6.7

What's Changed

• Improve special interpolations available for source code passed into live-code by @trusktr in #5

Deprecations:

• Deprecate the use of ${host} in source code that is provided to <live-code>, and instead support ${location.<prop>} (f.e. ${location.pathname}, ${location.href}, etc).
  • Migration: use ${location.origin} in place of ${host}.
• Deprecate href="/" from being automatically converted to href="<url>" where <url> is the location.origin of the wrapping window.
  • Migration: use a <base href="..."> tag along with ${location.<prop>} if needed. If you previously had <base href="/"> in an example's source, instead use <base href="${location.origin}"> to opt into the same behavior.

Full Changelog: v0.6.6...v0.6.7

v0.6.6

What's Changed

• Update lowclass and @lume/element versions. by @trusktr in #4
• feat: prevent autorunning editors from running until they come on screen (f.e. by scrolling them into view) to prevent a page with lots of examples from overloading the network and CPU, remove the lodash-es dependency and implement our own tiny debounce function
  • The new autorun-in-view attribute is true by default, and can be set to false to disable the new behavior so that any editors with autorun will run regardless if they are on screen or not. by @trusktr in 6d0536c
• BREAKING: improve button styling and spacing between between large and small layouts. Breaking because style changed a bit: added padding to the button bar, remove top border from buttons, gave buttons a background, gave buttons their own padding so they are easier targets to tap, increased button font size. Also fixed small preview-only view so the button bar is not highlighted with tab color. by @trusktr in 1c34088
• Add a <dialog>-based fallback for iOS, as iOS doesn't have the Full Screen API. Also document some attributes/properties in the README. by @trusktr in 12a0136
• BREAKING: default to the live preview tab when the view is smaller and shows tabs. If you still want to default to the code tab, there is no option currently, but you can programmatically trigger a click on the code tab using JavaScript. by @trusktr in 00c2f13

Full Changelog: v0.5.2...v0.6.6

v0.5.2

Convert from Vue to Custom Elements .

Remove Vue and convert to a <live-code> Custom Element that wraps a new <code-mirror> Custom Element from our new code-mirror-el package. The custom elements are powered by Lume Element.

BREAKING: Although it is no longer a Vue component, after you import the
custom element you can still use it in your Vue template just like
before, but the template property has been renamed to content. There
is now no need to list the element in your Vue component's components
field, delete it from there. Styling works differently, so if you
previously had custom CSS styles, you now need to add your styles to el.shadowRoot or el.shadowRoot.adoptedStyleSheet. There will be an improved API in the near future like what the <code-mirror> element has.

Full Changelog: v0.4.0...v0.5.2

v0.4.0 - To Vue or not to Vue

Commit build outputs to make the lib more accessible via git without needing to build.

Update Vue dependencies to fix broken build, namely in Winows PowerShell.

BREAKING:

Remove Vue support from the live code editor (as in, no more support for compiling and running Vue at runtime). We're going to focus on vanilla web and ES Modules, custom elements, etc. Later we'll also convert live-code to a custom element instead of a Vue component.

Full Changelog: v0.3.5...v0.4.0