@adyen/bento-vue3 1.26.0 → 1.28.0

package/dist/chunks/code-snippet.e8bxDBCO.js

@@ -0,0 +1,1052 @@
+import { openBlock as p, createElementBlock as I, mergeProps as de, toDisplayString as Y, createCommentVNode as b, createElementVNode as A, defineComponent as be, ref as V, computed as T, shallowRef as ee, onMounted as ye, watch as Ne, watchEffect as ke, resolveComponent as h, normalizeClass as te, createBlock as L, createVNode as x, withCtx as S, createTextVNode as ne, renderSlot as ve, normalizeProps as we, guardReactiveProps as _e, pushScopeId as Ce, popScopeId as Le } from "vue";
+import { highlightActiveLine as Ie, keymap as Ae, EditorView as oe, lineNumbers as Oe } from "@codemirror/view";
+import { EditorSelection as Ee, Compartment as q, EditorState as ae } from "@codemirror/state";
+import { indentWithTab as Be, history as Te } from "@codemirror/commands";
+import { syntaxHighlighting as Se, HighlightStyle as $e } from "@codemirror/language";
+import { B as Me } from "./dropdown.CxBlK83Q.js";
+import { B as He } from "./button.DoqHEvPh.js";
+import { B as Ve } from "./typography.D7onlQ9v.js";
+import { B as xe } from "./tooltip.CTR3s-Rm.js";
+import { B as je } from "./loading-indicator.BFMEf39U.js";
+import { u as Re } from "./i18n.DY5YXG5f.js";
+import { _ as pe } from "./_plugin-vue_export-helper.CHgC5LLL.js";
+import { h as ze } from "./base-modal.BgYlnM_Q.js";
+import { C as Pe } from "./copy.BhO7oRgC.js";
+import { json as De } from "@codemirror/lang-json";
+import { xml as Je } from "@codemirror/lang-xml";
+import { javascript as Ge } from "@codemirror/lang-javascript";
+import { java as Ke } from "@codemirror/lang-java";
+import { python as Ue } from "@codemirror/lang-python";
+import "../assets/code-snippet.css";
+let We = 0;
+class l {
+  /**
+  Create a new node prop type.
+  */
+  constructor(o = {}) {
+    this.id = We++, this.perNode = !!o.perNode, this.deserialize = o.deserialize || (() => {
+      throw new Error("This node type doesn't define a deserialize function");
+    });
+  }
+  /**
+  This is meant to be used with
+  [`NodeSet.extend`](#common.NodeSet.extend) or
+  [`LRParser.configure`](#lr.ParserConfig.props) to compute
+  prop values for each node type in the set. Takes a [match
+  object](#common.NodeType^match) or function that returns undefined
+  if the node type doesn't get this prop, and the prop's value if
+  it does.
+  */
+  add(o) {
+    if (this.perNode)
+      throw new RangeError("Can't add per-node props to node types");
+    return typeof o != "function" && (o = H.match(o)), (a) => {
+      let r = o(a);
+      return r === void 0 ? null : [this, r];
+    };
+  }
+}
+l.closedBy = new l({ deserialize: (e) => e.split(" ") });
+l.openedBy = new l({ deserialize: (e) => e.split(" ") });
+l.group = new l({ deserialize: (e) => e.split(" ") });
+l.isolate = new l({ deserialize: (e) => {
+  if (e && e != "rtl" && e != "ltr" && e != "auto")
+    throw new RangeError("Invalid value for isolate: " + e);
+  return e || "auto";
+} });
+l.contextHash = new l({ perNode: !0 });
+l.lookAhead = new l({ perNode: !0 });
+l.mounted = new l({ perNode: !0 });
+const qe = /* @__PURE__ */ Object.create(null);
+class H {
+  /**
+  @internal
+  */
+  constructor(o, a, r, s = 0) {
+    this.name = o, this.props = a, this.id = r, this.flags = s;
+  }
+  /**
+  Define a node type.
+  */
+  static define(o) {
+    let a = o.props && o.props.length ? /* @__PURE__ */ Object.create(null) : qe, r = (o.top ? 1 : 0) | (o.skipped ? 2 : 0) | (o.error ? 4 : 0) | (o.name == null ? 8 : 0), s = new H(o.name || "", a, o.id, r);
+    if (o.props) {
+      for (let i of o.props)
+        if (Array.isArray(i) || (i = i(s)), i) {
+          if (i[0].perNode)
+            throw new RangeError("Can't store a per-node prop on a node type");
+          a[i[0].id] = i[1];
+        }
+    }
+    return s;
+  }
+  /**
+  Retrieves a node prop for this type. Will return `undefined` if
+  the prop isn't present on this node.
+  */
+  prop(o) {
+    return this.props[o.id];
+  }
+  /**
+  True when this is the top node of a grammar.
+  */
+  get isTop() {
+    return (this.flags & 1) > 0;
+  }
+  /**
+  True when this node is produced by a skip rule.
+  */
+  get isSkipped() {
+    return (this.flags & 2) > 0;
+  }
+  /**
+  Indicates whether this is an error node.
+  */
+  get isError() {
+    return (this.flags & 4) > 0;
+  }
+  /**
+  When true, this node type doesn't correspond to a user-declared
+  named node, for example because it is used to cache repetition.
+  */
+  get isAnonymous() {
+    return (this.flags & 8) > 0;
+  }
+  /**
+  Returns true when this node's name or one of its
+  [groups](#common.NodeProp^group) matches the given string.
+  */
+  is(o) {
+    if (typeof o == "string") {
+      if (this.name == o)
+        return !0;
+      let a = this.prop(l.group);
+      return a ? a.indexOf(o) > -1 : !1;
+    }
+    return this.id == o;
+  }
+  /**
+  Create a function from node types to arbitrary values by
+  specifying an object whose property names are node or
+  [group](#common.NodeProp^group) names. Often useful with
+  [`NodeProp.add`](#common.NodeProp.add). You can put multiple
+  names, separated by spaces, in a single property name to map
+  multiple node names to a single value.
+  */
+  static match(o) {
+    let a = /* @__PURE__ */ Object.create(null);
+    for (let r in o)
+      for (let s of r.split(" "))
+        a[s] = o[r];
+    return (r) => {
+      for (let s = r.prop(l.group), i = -1; i < (s ? s.length : 0); i++) {
+        let d = a[i < 0 ? r.name : s[i]];
+        if (d)
+          return d;
+      }
+    };
+  }
+}
+H.none = new H(
+  "",
+  /* @__PURE__ */ Object.create(null),
+  0,
+  8
+  /* NodeFlag.Anonymous */
+);
+var re;
+(function(e) {
+  e[e.ExcludeBuffers = 1] = "ExcludeBuffers", e[e.IncludeAnonymous = 2] = "IncludeAnonymous", e[e.IgnoreMounts = 4] = "IgnoreMounts", e[e.IgnoreOverlays = 8] = "IgnoreOverlays";
+})(re || (re = {}));
+new l({ perNode: !0 });
+let Xe = 0;
+class f {
+  /**
+  @internal
+  */
+  constructor(o, a, r) {
+    this.set = o, this.base = a, this.modified = r, this.id = Xe++;
+  }
+  /**
+  Define a new tag. If `parent` is given, the tag is treated as a
+  sub-tag of that parent, and
+  [highlighters](#highlight.tagHighlighter) that don't mention
+  this tag will try to fall back to the parent tag (or grandparent
+  tag, etc).
+  */
+  static define(o) {
+    if (o != null && o.base)
+      throw new Error("Can not derive from a modified tag");
+    let a = new f([], null, []);
+    if (a.set.push(a), o)
+      for (let r of o.set)
+        a.set.push(r);
+    return a;
+  }
+  /**
+  Define a tag _modifier_, which is a function that, given a tag,
+  will return a tag that is a subtag of the original. Applying the
+  same modifier to a twice tag will return the same value (`m1(t1)
+  == m1(t1)`) and applying multiple modifiers will, regardless or
+  order, produce the same tag (`m1(m2(t1)) == m2(m1(t1))`).
+  
+  When multiple modifiers are applied to a given base tag, each
+  smaller set of modifiers is registered as a parent, so that for
+  example `m1(m2(m3(t1)))` is a subtype of `m1(m2(t1))`,
+  `m1(m3(t1)`, and so on.
+  */
+  static defineModifier() {
+    let o = new D();
+    return (a) => a.modified.indexOf(o) > -1 ? a : D.get(a.base || a, a.modified.concat(o).sort((r, s) => r.id - s.id));
+  }
+}
+let Ye = 0;
+class D {
+  constructor() {
+    this.instances = [], this.id = Ye++;
+  }
+  static get(o, a) {
+    if (!a.length)
+      return o;
+    let r = a[0].instances.find((c) => c.base == o && Ze(a, c.modified));
+    if (r)
+      return r;
+    let s = [], i = new f(s, o, a);
+    for (let c of a)
+      c.instances.push(i);
+    let d = Fe(a);
+    for (let c of o.set)
+      if (!c.modified.length)
+        for (let v of d)
+          s.push(D.get(c, v));
+    return i;
+  }
+}
+function Ze(e, o) {
+  return e.length == o.length && e.every((a, r) => a == o[r]);
+}
+function Fe(e) {
+  let o = [[]];
+  for (let a = 0; a < e.length; a++)
+    for (let r = 0, s = o.length; r < s; r++)
+      o.push(o[r].concat(e[a]));
+  return o.sort((a, r) => r.length - a.length);
+}
+new l();
+function Qe(e, o) {
+  let a = /* @__PURE__ */ Object.create(null);
+  for (let i of e)
+    if (!Array.isArray(i.tag))
+      a[i.tag.id] = i.class;
+    else
+      for (let d of i.tag)
+        a[d.id] = i.class;
+  let { scope: r, all: s = null } = {};
+  return {
+    style: (i) => {
+      let d = s;
+      for (let c of i)
+        for (let v of c.set) {
+          let w = a[v.id];
+          if (w) {
+            d = d ? d + " " + w : w;
+            break;
+          }
+        }
+      return d;
+    },
+    scope: r
+  };
+}
+const n = f.define, j = n(), y = n(), ie = n(y), se = n(y), N = n(), R = n(N), X = n(N), m = n(), C = n(m), g = n(), u = n(), Z = n(), $ = n(Z), z = n(), t = {
+  /**
+  A comment.
+  */
+  comment: j,
+  /**
+  A line [comment](#highlight.tags.comment).
+  */
+  lineComment: n(j),
+  /**
+  A block [comment](#highlight.tags.comment).
+  */
+  blockComment: n(j),
+  /**
+  A documentation [comment](#highlight.tags.comment).
+  */
+  docComment: n(j),
+  /**
+  Any kind of identifier.
+  */
+  name: y,
+  /**
+  The [name](#highlight.tags.name) of a variable.
+  */
+  variableName: n(y),
+  /**
+  A type [name](#highlight.tags.name).
+  */
+  typeName: ie,
+  /**
+  A tag name (subtag of [`typeName`](#highlight.tags.typeName)).
+  */
+  tagName: n(ie),
+  /**
+  A property or field [name](#highlight.tags.name).
+  */
+  propertyName: se,
+  /**
+  An attribute name (subtag of [`propertyName`](#highlight.tags.propertyName)).
+  */
+  attributeName: n(se),
+  /**
+  The [name](#highlight.tags.name) of a class.
+  */
+  className: n(y),
+  /**
+  A label [name](#highlight.tags.name).
+  */
+  labelName: n(y),
+  /**
+  A namespace [name](#highlight.tags.name).
+  */
+  namespace: n(y),
+  /**
+  The [name](#highlight.tags.name) of a macro.
+  */
+  macroName: n(y),
+  /**
+  A literal value.
+  */
+  literal: N,
+  /**
+  A string [literal](#highlight.tags.literal).
+  */
+  string: R,
+  /**
+  A documentation [string](#highlight.tags.string).
+  */
+  docString: n(R),
+  /**
+  A character literal (subtag of [string](#highlight.tags.string)).
+  */
+  character: n(R),
+  /**
+  An attribute value (subtag of [string](#highlight.tags.string)).
+  */
+  attributeValue: n(R),
+  /**
+  A number [literal](#highlight.tags.literal).
+  */
+  number: X,
+  /**
+  An integer [number](#highlight.tags.number) literal.
+  */
+  integer: n(X),
+  /**
+  A floating-point [number](#highlight.tags.number) literal.
+  */
+  float: n(X),
+  /**
+  A boolean [literal](#highlight.tags.literal).
+  */
+  bool: n(N),
+  /**
+  Regular expression [literal](#highlight.tags.literal).
+  */
+  regexp: n(N),
+  /**
+  An escape [literal](#highlight.tags.literal), for example a
+  backslash escape in a string.
+  */
+  escape: n(N),
+  /**
+  A color [literal](#highlight.tags.literal).
+  */
+  color: n(N),
+  /**
+  A URL [literal](#highlight.tags.literal).
+  */
+  url: n(N),
+  /**
+  A language keyword.
+  */
+  keyword: g,
+  /**
+  The [keyword](#highlight.tags.keyword) for the self or this
+  object.
+  */
+  self: n(g),
+  /**
+  The [keyword](#highlight.tags.keyword) for null.
+  */
+  null: n(g),
+  /**
+  A [keyword](#highlight.tags.keyword) denoting some atomic value.
+  */
+  atom: n(g),
+  /**
+  A [keyword](#highlight.tags.keyword) that represents a unit.
+  */
+  unit: n(g),
+  /**
+  A modifier [keyword](#highlight.tags.keyword).
+  */
+  modifier: n(g),
+  /**
+  A [keyword](#highlight.tags.keyword) that acts as an operator.
+  */
+  operatorKeyword: n(g),
+  /**
+  A control-flow related [keyword](#highlight.tags.keyword).
+  */
+  controlKeyword: n(g),
+  /**
+  A [keyword](#highlight.tags.keyword) that defines something.
+  */
+  definitionKeyword: n(g),
+  /**
+  A [keyword](#highlight.tags.keyword) related to defining or
+  interfacing with modules.
+  */
+  moduleKeyword: n(g),
+  /**
+  An operator.
+  */
+  operator: u,
+  /**
+  An [operator](#highlight.tags.operator) that dereferences something.
+  */
+  derefOperator: n(u),
+  /**
+  Arithmetic-related [operator](#highlight.tags.operator).
+  */
+  arithmeticOperator: n(u),
+  /**
+  Logical [operator](#highlight.tags.operator).
+  */
+  logicOperator: n(u),
+  /**
+  Bit [operator](#highlight.tags.operator).
+  */
+  bitwiseOperator: n(u),
+  /**
+  Comparison [operator](#highlight.tags.operator).
+  */
+  compareOperator: n(u),
+  /**
+  [Operator](#highlight.tags.operator) that updates its operand.
+  */
+  updateOperator: n(u),
+  /**
+  [Operator](#highlight.tags.operator) that defines something.
+  */
+  definitionOperator: n(u),
+  /**
+  Type-related [operator](#highlight.tags.operator).
+  */
+  typeOperator: n(u),
+  /**
+  Control-flow [operator](#highlight.tags.operator).
+  */
+  controlOperator: n(u),
+  /**
+  Program or markup punctuation.
+  */
+  punctuation: Z,
+  /**
+  [Punctuation](#highlight.tags.punctuation) that separates
+  things.
+  */
+  separator: n(Z),
+  /**
+  Bracket-style [punctuation](#highlight.tags.punctuation).
+  */
+  bracket: $,
+  /**
+  Angle [brackets](#highlight.tags.bracket) (usually `<` and `>`
+  tokens).
+  */
+  angleBracket: n($),
+  /**
+  Square [brackets](#highlight.tags.bracket) (usually `[` and `]`
+  tokens).
+  */
+  squareBracket: n($),
+  /**
+  Parentheses (usually `(` and `)` tokens). Subtag of
+  [bracket](#highlight.tags.bracket).
+  */
+  paren: n($),
+  /**
+  Braces (usually `{` and `}` tokens). Subtag of
+  [bracket](#highlight.tags.bracket).
+  */
+  brace: n($),
+  /**
+  Content, for example plain text in XML or markup documents.
+  */
+  content: m,
+  /**
+  [Content](#highlight.tags.content) that represents a heading.
+  */
+  heading: C,
+  /**
+  A level 1 [heading](#highlight.tags.heading).
+  */
+  heading1: n(C),
+  /**
+  A level 2 [heading](#highlight.tags.heading).
+  */
+  heading2: n(C),
+  /**
+  A level 3 [heading](#highlight.tags.heading).
+  */
+  heading3: n(C),
+  /**
+  A level 4 [heading](#highlight.tags.heading).
+  */
+  heading4: n(C),
+  /**
+  A level 5 [heading](#highlight.tags.heading).
+  */
+  heading5: n(C),
+  /**
+  A level 6 [heading](#highlight.tags.heading).
+  */
+  heading6: n(C),
+  /**
+  A prose separator (such as a horizontal rule).
+  */
+  contentSeparator: n(m),
+  /**
+  [Content](#highlight.tags.content) that represents a list.
+  */
+  list: n(m),
+  /**
+  [Content](#highlight.tags.content) that represents a quote.
+  */
+  quote: n(m),
+  /**
+  [Content](#highlight.tags.content) that is emphasized.
+  */
+  emphasis: n(m),
+  /**
+  [Content](#highlight.tags.content) that is styled strong.
+  */
+  strong: n(m),
+  /**
+  [Content](#highlight.tags.content) that is part of a link.
+  */
+  link: n(m),
+  /**
+  [Content](#highlight.tags.content) that is styled as code or
+  monospace.
+  */
+  monospace: n(m),
+  /**
+  [Content](#highlight.tags.content) that has a strike-through
+  style.
+  */
+  strikethrough: n(m),
+  /**
+  Inserted text in a change-tracking format.
+  */
+  inserted: n(),
+  /**
+  Deleted text.
+  */
+  deleted: n(),
+  /**
+  Changed text.
+  */
+  changed: n(),
+  /**
+  An invalid or unsyntactic element.
+  */
+  invalid: n(),
+  /**
+  Metadata or meta-instruction.
+  */
+  meta: z,
+  /**
+  [Metadata](#highlight.tags.meta) that applies to the entire
+  document.
+  */
+  documentMeta: n(z),
+  /**
+  [Metadata](#highlight.tags.meta) that annotates or adds
+  attributes to a given syntactic element.
+  */
+  annotation: n(z),
+  /**
+  Processing instruction or preprocessor directive. Subtag of
+  [meta](#highlight.tags.meta).
+  */
+  processingInstruction: n(z),
+  /**
+  [Modifier](#highlight.Tag^defineModifier) that indicates that a
+  given element is being defined. Expected to be used with the
+  various [name](#highlight.tags.name) tags.
+  */
+  definition: f.defineModifier(),
+  /**
+  [Modifier](#highlight.Tag^defineModifier) that indicates that
+  something is constant. Mostly expected to be used with
+  [variable names](#highlight.tags.variableName).
+  */
+  constant: f.defineModifier(),
+  /**
+  [Modifier](#highlight.Tag^defineModifier) used to indicate that
+  a [variable](#highlight.tags.variableName) or [property
+  name](#highlight.tags.propertyName) is being called or defined
+  as a function.
+  */
+  function: f.defineModifier(),
+  /**
+  [Modifier](#highlight.Tag^defineModifier) that can be applied to
+  [names](#highlight.tags.name) to indicate that they belong to
+  the language's standard environment.
+  */
+  standard: f.defineModifier(),
+  /**
+  [Modifier](#highlight.Tag^defineModifier) that indicates a given
+  [names](#highlight.tags.name) is local to some scope.
+  */
+  local: f.defineModifier(),
+  /**
+  A generic variant [modifier](#highlight.Tag^defineModifier) that
+  can be used to tag language-specific alternative variants of
+  some common tag. It is recommended for themes to define special
+  forms of at least the [string](#highlight.tags.string) and
+  [variable name](#highlight.tags.variableName) tags, since those
+  come up a lot.
+  */
+  special: f.defineModifier()
+};
+Qe([
+  { tag: t.link, class: "tok-link" },
+  { tag: t.heading, class: "tok-heading" },
+  { tag: t.emphasis, class: "tok-emphasis" },
+  { tag: t.strong, class: "tok-strong" },
+  { tag: t.keyword, class: "tok-keyword" },
+  { tag: t.atom, class: "tok-atom" },
+  { tag: t.bool, class: "tok-bool" },
+  { tag: t.url, class: "tok-url" },
+  { tag: t.labelName, class: "tok-labelName" },
+  { tag: t.inserted, class: "tok-inserted" },
+  { tag: t.deleted, class: "tok-deleted" },
+  { tag: t.literal, class: "tok-literal" },
+  { tag: t.string, class: "tok-string" },
+  { tag: t.number, class: "tok-number" },
+  { tag: [t.regexp, t.escape, t.special(t.string)], class: "tok-string2" },
+  { tag: t.variableName, class: "tok-variableName" },
+  { tag: t.local(t.variableName), class: "tok-variableName tok-local" },
+  { tag: t.definition(t.variableName), class: "tok-variableName tok-definition" },
+  { tag: t.special(t.variableName), class: "tok-variableName2" },
+  { tag: t.definition(t.propertyName), class: "tok-propertyName tok-definition" },
+  { tag: t.typeName, class: "tok-typeName" },
+  { tag: t.namespace, class: "tok-namespace" },
+  { tag: t.className, class: "tok-className" },
+  { tag: t.macroName, class: "tok-macroName" },
+  { tag: t.propertyName, class: "tok-propertyName" },
+  { tag: t.operator, class: "tok-operator" },
+  { tag: t.comment, class: "tok-comment" },
+  { tag: t.meta, class: "tok-meta" },
+  { tag: t.invalid, class: "tok-invalid" },
+  { tag: t.punctuation, class: "tok-punctuation" }
+]);
+const et = "#c72727", tt = "#9b5700", nt = "#067934", ot = "#0063d7", at = {
+  red: et,
+  orange: tt,
+  green: nt,
+  blue: ot,
+  invalid: "#ffffff"
+}, rt = (e) => $e.define([
+  {
+    tag: t.keyword,
+    color: e.red
+  },
+  {
+    tag: [t.name, t.deleted, t.character, t.propertyName, t.macroName],
+    color: e.green
+  },
+  {
+    tag: [t.function(t.variableName), t.labelName],
+    color: e.blue
+  },
+  {
+    tag: [t.color, t.constant(t.name), t.standard(t.name)],
+    color: e.red
+  },
+  {
+    tag: [t.definition(t.name), t.separator],
+    color: e.red
+  },
+  {
+    tag: [t.typeName, t.className, t.number, t.changed, t.annotation, t.modifier, t.self, t.namespace],
+    color: e.orange
+  },
+  {
+    tag: [t.operator, t.operatorKeyword, t.url, t.escape, t.regexp, t.link, t.special(t.string)],
+    color: e.blue
+  },
+  {
+    tag: [t.meta, t.comment],
+    color: e.orange
+  },
+  {
+    tag: t.strong,
+    fontWeight: "bold"
+  },
+  {
+    tag: t.emphasis,
+    fontStyle: "italic"
+  },
+  {
+    tag: t.strikethrough,
+    textDecoration: "line-through"
+  },
+  {
+    tag: t.link,
+    color: e.orange,
+    textDecoration: "underline"
+  },
+  {
+    tag: t.heading,
+    fontWeight: "bold",
+    color: e.blue
+  },
+  {
+    tag: [t.atom, t.bool, t.special(t.variableName)],
+    color: e.red
+  },
+  {
+    tag: [t.processingInstruction, t.string, t.inserted],
+    color: e.blue
+  },
+  {
+    tag: t.invalid,
+    color: e.invalid
+  }
+]), it = Se(rt(at));
+var P = /* @__PURE__ */ ((e) => (e.INLINE = "inline", e.SINGLELINE = "singleline", e.MULTILINE = "multiline", e))(P || {}), k = /* @__PURE__ */ ((e) => (e.JSON = "json", e.XML = "xml", e.JAVA = "java", e.JAVASCRIPT = "javascript", e.PYTHON = "python", e))(k || {}), M = /* @__PURE__ */ ((e) => (e.ACTION = "action", e.CHANGE = "change", e))(M || {});
+const st = {
+  [k.JSON]: De,
+  [k.XML]: Je,
+  [k.JAVASCRIPT]: Ge,
+  [k.JAVA]: Ke,
+  [k.PYTHON]: Ue
+}, lt = (e) => async () => st[e], ct = (e, o) => {
+  const a = e.doc.lineAt(o.from), r = /^\s*/.exec(a.text);
+  return r ? r[0] : "";
+}, dt = {
+  key: "Enter",
+  run: ({ state: e, dispatch: o }) => {
+    const a = e.changeByRange((r) => {
+      const i = `
+${ct(e, r)}`;
+      return {
+        changes: { from: r.from, to: r.to, insert: i },
+        range: Ee.cursor(r.from + i.length)
+      };
+    });
+    return o(e.update(a, { scrollIntoView: !0, userEvent: "input" })), !0;
+  }
+};
+let le = 0;
+const pt = {
+  beforeCreate() {
+    this.uuid = le.toString(), le += 1;
+  }
+}, gt = { key: 0 }, ut = /* @__PURE__ */ A("path", {
+  fill: "#00112C",
+  d: "M14.75 1.25V6.75H13.25V3.81083L10.0001 7.06072L8.93945 6.00006L12.1895 2.75H9.25V1.25H14.75Z"
+}, null, -1), mt = /* @__PURE__ */ A("path", {
+  fill: "#00112C",
+  d: "M2.75 12.1895V9.25H1.25V14.75H6.75V13.25H3.81083L7.06072 10.0001L6.00006 8.93945L2.75 12.1895Z"
+}, null, -1);
+function ft(e, o, a, r, s, i) {
+  return p(), I("svg", de({ role: "img" }, e.$attrs, {
+    class: "ui-assets-icons-16",
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "16",
+    height: "16",
+    fill: "none"
+  }), [
+    e.$attrs["svg-title"] ? (p(), I("title", gt, Y(e.$attrs["svg-title"]), 1)) : b("", !0),
+    ut,
+    mt
+  ], 16);
+}
+const ht = /* @__PURE__ */ pe(pt, [["render", ft]]), ce = {
+  "en-US": {
+    run: "Run",
+    expand: "Expand"
+  }
+}, bt = be({
+  i18n: { messages: ce },
+  name: "bento-code-snippet",
+  components: {
+    BentoTypography: Ve,
+    BentoButton: He,
+    BentoDropdown: Me,
+    Copy: Pe,
+    BaseModal: ze,
+    BentoLoadingIndicator: je,
+    ExpandIcon: ht
+  },
+  directives: { BentoTooltipDirective: xe },
+  props: {
+    /**
+     * Defines the variant of code-snippet
+     */
+    variant: {
+      type: String,
+      default: P.MULTILINE,
+      validator: (e) => Object.values(P).includes(e)
+    },
+    /**
+     * Language name for syntax highlighting rules
+     */
+    lang: {
+      type: String,
+      default: k.JSON,
+      validator: (e) => Object.values(k).includes(e)
+    },
+    /**
+     * Label to show in the action-bar, describing the language
+     */
+    langLabel: {
+      type: String,
+      default: null
+    },
+    /**
+     * The code content
+     */
+    content: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Allows editing of the code-snippet content by the user
+     */
+    editable: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Displays a button that when clicked will emit an action event
+     * Leaves to the parent component the logic of what to do with it
+     */
+    actionable: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Displays a button that can expand the codeblock into a modal to easily
+     * view large blocks of code.
+     */
+    expandable: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Displays a button that when clicked will emit a run event
+     * Leaves to the parent component the logic of what to do with it
+     */
+    actionableText: {
+      type: String,
+      default: "run"
+    },
+    /**
+     * Toggles the loading indicator within the action bar
+     */
+    loading: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: [M.ACTION, M.CHANGE],
+  setup(e, { emit: o }) {
+    const { t: a } = Re({ messages: ce }), r = V(null), s = [], i = () => {
+    }, d = T(() => e.langLabel ?? e.lang.toUpperCase()), c = T(() => e.variant === P.INLINE), v = T(() => ({
+      "b-code-snippet--inline": c.value,
+      "b-code-snippet--scrollable": !c.value
+    })), w = T(() => ({
+      "b-code-snippet__code-area-content--editable": e.editable
+    })), J = lt(e.lang), O = ee(), E = ee(), G = new q(), B = new q(), ge = new q(), _ = V(null), K = V(0);
+    ye(async () => {
+      const U = await J();
+      _.value = e.content;
+      const he = ({ state: W }) => {
+        _.value = W.doc.toString();
+      }, F = [
+        Ie(),
+        Ae.of([Be, dt]),
+        G.of(U()),
+        B.of(it),
+        ge.of(ae.readOnly.of(!e.editable)),
+        oe.updateListener.of((W) => he(W))
+      ];
+      e.variant === "multiline" && F.push([Oe(), Te()]);
+      const Q = ae.create({
+        doc: e.content,
+        extensions: [...F]
+      });
+      K.value = Q.doc.length, E.value = new oe({
+        state: Q,
+        parent: O.value
+      });
+    }), Ne(
+      () => e.content,
+      () => {
+        if (e.content !== _.value) {
+          const U = e.content.length;
+          E.value.dispatch({
+            changes: {
+              from: 0,
+              to: K.value,
+              insert: e.content
+            }
+          }), K.value = U;
+        }
+      }
+    );
+    const ue = T(() => a(e.actionableText)), me = () => {
+      o(M.ACTION, _.value);
+    };
+    ke(() => {
+      _.value !== null && o(M.CHANGE, _.value);
+    });
+    const fe = V(!1);
+    return {
+      // Values
+      availableLanguages: s,
+      codeAreaContentConditionalClasses: w,
+      conditionalClasses: v,
+      container: O,
+      currentContents: _,
+      displayedLang: d,
+      editor: E,
+      selectedLanguage: r,
+      showModal: fe,
+      isInlineVariant: c,
+      // Methods
+      handleChangeLanguage: i,
+      onActionClicked: me,
+      runText: ue,
+      // Translations
+      t: a
+    };
+  }
+}), yt = (e) => (Ce("data-v-5eb6a936"), e = e(), Le(), e), Nt = {
+  key: 0,
+  class: "b-code-snippet__action-bar"
+}, kt = { class: "b-code-snippet__action-bar--start" }, vt = { class: "b-code-snippet__action-bar--end" }, wt = {
+  key: 1,
+  class: "b-code-snippet__code-area"
+}, _t = { key: 2 }, Ct = /* @__PURE__ */ yt(() => /* @__PURE__ */ A("div", { class: "b-code-snippet__empty-state" }, "Nothing to show", -1));
+function Lt(e, o, a, r, s, i) {
+  const d = h("bento-dropdown"), c = h("bento-typography"), v = h("bento-loading-indicator"), w = h("copy"), J = h("expand-icon"), O = h("bento-button"), E = h("bento-code-snippet"), G = h("base-modal");
+  return p(), I("div", {
+    class: te(["b-code-snippet", e.conditionalClasses])
+  }, [
+    e.isInlineVariant ? b("", !0) : (p(), I("section", Nt, [
+      A("div", kt, [
+        e.availableLanguages.length > 0 ? (p(), L(d, de({
+          key: 0,
+          modelValue: e.selectedLanguage,
+          "onUpdate:modelValue": o[0] || (o[0] = (B) => e.selectedLanguage = B)
+        }, e.$props, {
+          disabled: e.availableLanguages.length === 1,
+          items: e.availableLanguages,
+          class: "b-code-snippet__language-picker",
+          onInput: e.handleChangeLanguage
+        }), null, 16, ["modelValue", "disabled", "items", "onInput"])) : b("", !0),
+        x(c, {
+          el: "span",
+          stronger: ""
+        }, {
+          default: S(() => [
+            ne(Y(e.displayedLang), 1)
+          ]),
+          _: 1
+        })
+      ]),
+      A("div", vt, [
+        e.loading ? (p(), L(v, { key: 0 })) : b("", !0),
+        e.currentContents !== null ? (p(), L(w, {
+          key: 1,
+          class: "b-structured-list__icon",
+          text: e.currentContents
+        }, null, 8, ["text"])) : b("", !0),
+        e.expandable ? (p(), L(O, {
+          key: 2,
+          variant: "tertiary",
+          condensed: "",
+          "aria-label": e.t("expand"),
+          onClick: o[1] || (o[1] = (B) => e.showModal = !0)
+        }, {
+          iconLeft: S(() => [
+            x(J)
+          ]),
+          _: 1
+        }, 8, ["aria-label"])) : b("", !0),
+        e.actionable ? (p(), L(O, {
+          key: 3,
+          variant: "primary",
+          tertiary: "",
+          condensed: "",
+          onClick: e.onActionClicked
+        }, {
+          iconLeft: S(() => [
+            x(c, {
+              el: "span",
+              class: "b-code-snippet__action-button"
+            }, {
+              default: S(() => [
+                ne(Y(e.runText), 1)
+              ]),
+              _: 1
+            })
+          ]),
+          _: 1
+        }, 8, ["onClick"])) : b("", !0)
+      ])
+    ])),
+    e.content || e.editable ? (p(), I("code", wt, [
+      A("div", {
+        ref: "container",
+        class: te(["b-code-snippet__code-area-content", e.codeAreaContentConditionalClasses])
+      }, null, 2)
+    ])) : (p(), I("section", _t, [
+      ve(e.$slots, "empty-state", {}, () => [
+        Ct
+      ], !0)
+    ])),
+    e.expandable ? (p(), L(G, {
+      key: 3,
+      class: "b-code-snippet__modal",
+      "hide-close-button": !0,
+      "custom-padding": "0px",
+      "is-dismissible": !0,
+      "is-open": e.showModal,
+      size: "large",
+      onCloseModal: o[2] || (o[2] = (B) => e.showModal = !1)
+    }, {
+      content: S(() => [
+        x(E, we(_e({ ...e.$props, expandable: !1 })), null, 16)
+      ]),
+      _: 1
+    }, 8, ["is-open"])) : b("", !0)
+  ], 2);
+}
+const Kt = /* @__PURE__ */ pe(bt, [["render", Lt], ["__scopeId", "data-v-5eb6a936"]]);
+export {
+  P as B,
+  k as a,
+  M as b,
+  Kt as c
+};
+//# sourceMappingURL=code-snippet.e8bxDBCO.js.map