Store API

The vibeFlagsStore provides a JavaScript API for managing flags without HTML elements. Useful for programmatic control, app initialization, or framework integrations.

import { vibeFlagsStore } from "@vibe-flags/core";

Methods

register(config)

Register a single flag. Reads any existing value from localStorage, falling back to the default. This is called automatically by the HTML elements — use it when you need to register flags from JavaScript.

vibeFlagsStore.register({ key: "beta", type: "boolean", label: "Beta Mode" });
vibeFlagsStore.register({
  key: "theme",
  type: "select",
  options: ["light", "dark"],
  label: "Theme",
});

unregister(key)

Remove a flag from the store.

vibeFlagsStore.unregister("beta");

get(key)

Get the current value of a flag. Returns undefined if the flag isn't registered.

vibeFlagsStore.get("beta");  // false
vibeFlagsStore.get("theme"); // "light"

set(key, value)

Set a flag value. Validates against the flag's type and options. Persists to localStorage and dispatches a change event. Invalid values are silently ignored.

vibeFlagsStore.set("beta", true);
vibeFlagsStore.set("theme", "dark");
 
// Invalid — silently ignored:
vibeFlagsStore.set("beta", "yes");   // not a boolean
vibeFlagsStore.set("theme", "neon"); // not in options

getAll()

Get all current flag values as a plain object.

vibeFlagsStore.getAll();
// { beta: false, theme: "light" }

getConfig()

Get all registered flag configurations as an array.

getConfigForKey(key)

Get the configuration for a specific flag. Returns undefined if not registered.

reset()

Reset all flags to their default values and clear localStorage.

vibeFlagsStore.reset();

Events

vibe-flags-changed

Dispatched on window whenever a flag value changes. Listen for it to react to flag changes from any source (toolbar, URL overrides, programmatic).

window.addEventListener("vibe-flags-changed", (e) => {
  const { key, state } = e.detail;
  console.log(`Flag "${key}" changed`);
  console.log("All flags:", state);
});