@adyen/bento-mcp 0.1.3 → 0.2.1

package/dist/assets/utility-classes.md

@@ -0,0 +1,92 @@
+# Bento Utility Classes (Legacy)
+
+> **Transition Note**: Adyen is moving to Tailwind CSS. Use Tailwind classes whenever possible. However, some Vue
+> components do not yet support Tailwind, so these legacy `b-` utilities are still required in those cases. Once full
+> Tailwind support is added, these will be deprecated.
+
+---
+
+## Pattern
+
+Most utility classes follow this pattern: `b-{cssProp}-{direction}-{spacerAlias}`
+
+- **cssProp**: `margin` or `padding`
+- **direction** (optional): `top`, `bottom`, `left`, `right`, `x`, `y`
+- **spacerAlias**: `000` to `140`
+
+---
+
+## Spacing Utilities
+
+### Margins
+
+- `b-margin-{alias}`: Apply margin to all sides.
+- `b-margin-top-{alias}`: Apply margin-top.
+- `b-margin-bottom-{alias}`: Apply margin-bottom.
+- `b-margin-x-{alias}`: Apply horizontal margin (left and right).
+- `b-margin-y-{alias}`: Apply vertical margin (top and bottom).
+
+### Paddings
+
+- `b-padding-{alias}`: Apply padding to all sides.
+- `b-padding-top-{alias}`: Apply padding-top.
+- `b-padding-bottom-{alias}`: Apply padding-bottom.
+- `b-padding-x-{alias}`: Apply horizontal padding.
+- `b-padding-y-{alias}`: Apply vertical padding.
+
+### Common Spacer Aliases
+
+| Alias | Value (px) |
+| :---- | :--------- |
+| `000` | 0px        |
+| `010` | 2px        |
+| `020` | 4px        |
+| `030` | 6px        |
+| `040` | 8px        |
+| `050` | 10px       |
+| `060` | 12px       |
+| `070` | 16px       |
+| `080` | 20px       |
+| `090` | 24px       |
+| `100` | 32px       |
+| `110` | 40px       |
+| `120` | 48px       |
+| `130` | 56px       |
+| `140` | 64px       |
+
+---
+
+## Color Utilities
+
+### Background Colors
+
+- `b-color-background-primary`
+- `b-color-background-secondary`
+- `b-color-background-tertiary`
+- `b-color-background-quaternary`
+- `b-color-background-modal`
+- `b-color-background-disabled`
+- `b-color-background-selected`
+
+### Text Colors (Labels)
+
+- `b-color-label-primary`
+- `b-color-label-secondary`
+- `b-color-label-tertiary`
+- `b-color-label-quaternary`
+- `b-color-label-critical`
+- `b-color-label-success`
+- `b-color-label-warning`
+- `b-color-label-disabled`
+
+---
+
+## Display & Layout
+
+- `b-display-flex`
+- `b-display-block`
+- `b-display-inline-block`
+- `b-display-none`
+- `b-flex-align-items-center`
+- `b-flex-justify-content-center`
+- `b-flex-direction-column`

package/dist/assets/utils/ts/currency/currency.types.ts

@@ -0,0 +1 @@
+export interface CurrencyAmount { value: number; currency: string; } export interface CurrencyOptions { // Formatting style. [More details]{@link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/NumberFormat} style?: string; // Explicitly pass the exponent of a currency exponent?: number; // Display fractions for whole numbers (e.g. 1.00) optionalFractions?: boolean; // Allow 2 more fraction digits (e.g. when working with 1/100 of a minor unit) highPrecision?: boolean; } export interface CurrencyFormatOptions { amount: CurrencyAmount; options?: CurrencyOptions; } export interface NumberFormatOptionsResult { value: number; format: { currency: string; currencyDisplay: string; maximumFractionDigits: number; minimumFractionDigits: number; style: string; }; } 

package/dist/assets/variables.css

@@ -0,0 +1,309 @@
+:root {
+  --b-spacer-090: 24px;
+  --b-spacer-080: 20px;
+  --b-spacer-070: 16px;
+  --b-spacer-060: 12px;
+  --b-spacer-050: 10px;
+  --b-spacer-040: 8px;
+  --b-spacer-030: 6px;
+  --b-spacer-020: 4px;
+  --b-spacer-010: 2px;
+  --b-spacer-000: 0px;
+  --b-spacer-140: 64px;
+  --b-spacer-130: 56px;
+  --b-spacer-120: 48px;
+  --b-spacer-110: 40px;
+  --b-spacer-100: 32px;
+  --b-shadow-high-border: 0px 18px 36px rgba(0, 18, 34, 0.12), 0px 4px 8px rgba(0, 18, 34, 0.06), 0px 0px 0px 1px rgba(218, 221, 223, 1);
+  --b-shadow-medium-border: 0px 6px 12px rgba(0, 18, 34, 0.08), 0px 2px 4px rgba(0, 18, 34, 0.04), 0px 0px 0px 1px rgba(218, 221, 223, 1);
+  --b-shadow-low-border: 0px 2px 4px rgba(0, 18, 34, 0.04), 0px 1px 2px rgba(0, 18, 34, 0.02), 0px 0px 0px 1px rgba(218, 221, 223, 1);
+  --b-shadow-high: 0px 18px 36px rgba(0, 18, 34, 0.12), 0px 4px 8px rgba(0, 18, 34, 0.06);
+  --b-shadow-medium: 0px 6px 12px rgba(0, 18, 34, 0.08), 0px 2px 4px rgba(0, 18, 34, 0.04);
+  --b-shadow-low: 0px 2px 4px rgba(0, 18, 34, 0.04), 0px 1px 2px rgba(0, 18, 34, 0.02);
+  --b-media-query-xxl: 1536px;
+  --b-media-query-xl-max: 1535px;
+  --b-media-query-xl-min: 1280px;
+  --b-media-query-l-max: 1279px;
+  --b-media-query-l-min: 768px;
+  --b-media-query-m-max: 767px;
+  --b-media-query-m-min: 500px;
+  --b-media-query-s-max: 499px;
+  --b-media-query-s-min: 376px;
+  --b-media-query-xs-max: 375px;
+  --b-media-query-xs-min: 0px;
+  --b-border-width-attention: 1.5px;
+  --b-border-width-l: 3px;
+  --b-border-width-m: 2px;
+  --b-border-width-s: 1px;
+  --b-border-radius-xl: 24px;
+  --b-border-radius-l: 12px;
+  --b-border-radius-m: 8px;
+  --b-border-radius-s: 4px;
+  --b-border-radius-xs: 2px;
+  --b-animation-duration-slow: 250ms;
+  --b-animation-duration-moderate: 150ms;
+  --b-animation-duration-fast: 100ms;
+  --b-animation-easing-linear: linear;
+  --b-animation-easing-exit: cubic-bezier(0.4, 0, 1, 1);
+  --b-animation-easing-enter: cubic-bezier(0.12, 0.6, 0.4, 0.95);
+  --b-animation-easing-standard: cubic-bezier(0.2, 0, 0.4, 0.9);
+  --b-tooltip-max-width: 300px;
+  --b-toast-width: 420px;
+  --b-z-index-local-tier-4: 4;
+  --b-z-index-local-tier-3: 3;
+  --b-z-index-local-tier-2: 2;
+  --b-z-index-local-tier-1: 1;
+  --b-z-index-global-instant-interaction: 15;
+  --b-z-index-global-navigation: 10;
+  --b-z-index-global-elevated: 5;
+  --b-z-index-global-screen: auto;
+  --b-text-title-l-mobile-line-height: 30px;
+  --b-text-title-l-mobile-font-size: 20px;
+  --b-text-title-l-letter-spacing: 0;
+  --b-text-title-l-line-height: 34px;
+  --b-text-title-l-font-weight: 600;
+  --b-text-title-l-font-size: 24px;
+  --b-text-title-l-font-family-secondary: 'Adyen Mono', 'Roboto Mono', 'Oxygen Mono', 'IBM Plex Mono', 'Courier New', monospace;
+  --b-text-title-l-font-family: 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
+  --b-text-title-m-mobile-line-height: 28px;
+  --b-text-title-m-mobile-font-size: 18px;
+  --b-text-title-m-letter-spacing: 0;
+  --b-text-title-m-line-height: 30px;
+  --b-text-title-m-font-weight: 600;
+  --b-text-title-m-font-size: 20px;
+  --b-text-title-m-font-family-secondary: 'Adyen Mono', 'Roboto Mono', 'Oxygen Mono', 'IBM Plex Mono', 'Courier New', monospace;
+  --b-text-title-m-font-family: 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
+  --b-text-title-mobile-line-height: 26px;
+  --b-text-title-mobile-font-size: 16px;
+  --b-text-title-letter-spacing: 0;
+  --b-text-title-line-height: 26px;
+  --b-text-title-font-weight: 600;
+  --b-text-title-font-size: 16px;
+  --b-text-title-font-family-secondary: 'Adyen Mono', 'Roboto Mono', 'Oxygen Mono', 'IBM Plex Mono', 'Courier New', monospace;
+  --b-text-title-font-family: 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
+  --b-text-subtitle-stronger-font-weight: 600;
+  --b-text-subtitle-letter-spacing: 0;
+  --b-text-subtitle-line-height: 26px;
+  --b-text-subtitle-font-weight: 500;
+  --b-text-subtitle-font-size: 16px;
+  --b-text-subtitle-font-family: 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
+  --b-text-body-strongest-wide-line-height: 24px;
+  --b-text-body-strongest-wide-font-weight: 600;
+  --b-text-body-strongest-font-weight: 600;
+  --b-text-body-stronger-wide-line-height: 24px;
+  --b-text-body-stronger-wide-font-weight: 500;
+  --b-text-body-stronger-font-weight: 500;
+  --b-text-body-wide-line-height: 24px;
+  --b-text-body-letter-spacing: 0;
+  --b-text-body-line-height: 20px;
+  --b-text-body-font-weight: 400;
+  --b-text-body-font-size: 14px;
+  --b-text-body-font-family-secondary: 'Adyen Mono', 'Roboto Mono', 'Oxygen Mono', 'IBM Plex Mono', 'Courier New', monospace;
+  --b-text-body-font-family: 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
+  --b-text-caption-stronger-wide-line-height: 20px;
+  --b-text-caption-stronger-wide-font-weight: 500;
+  --b-text-caption-stronger-font-weight: 500;
+  --b-text-caption-wide-line-height: 20px;
+  --b-text-caption-letter-spacing: 0;
+  --b-text-caption-line-height: 18px;
+  --b-text-caption-font-weight: 400;
+  --b-text-caption-font-size: 12px;
+  --b-text-caption-font-family-secondary: 'Adyen Mono', 'Roboto Mono', 'Oxygen Mono', 'IBM Plex Mono', 'Courier New', monospace;
+  --b-text-caption-font-family: 'Adyen Variable', Roboto, Oxygen, 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
+  --b-text-rich-text-caption-pre-line-height: 20px;
+  --b-text-rich-text-table-caption-line-height: 20px;
+  --b-text-rich-text-table-header-font-weight: 700;
+  --b-text-rich-text-table-line-height: 20px;
+  --b-text-rich-text-blockquote-font-weight: 500;
+  --b-text-rich-text-pre-line-height: 24px;
+  --b-text-rich-text-code-font-weight: 500;
+  --b-text-rich-text-code-font-family: 'Adyen Mono', 'Roboto Mono', 'Oxygen Mono', 'IBM Plex Mono', 'Courier New', monospace;
+  --b-text-rich-text-heading-font-weight: 700;
+  --b-text-font-variant-numeric: normal;
+  --b-focus-ring-color: rgba(15, 117, 220, 0.8);
+  --b-color-support-shadow: #001222;
+  --b-color-support-overlay: #001222;
+  --b-color-decorative-grey: #848d96;
+  --b-color-decorative-red: #f73f01;
+  --b-color-decorative-orange: #f99300;
+  --b-color-decorative-yellow: #f9c500;
+  --b-color-decorative-blue: #006bd7;
+  --b-color-decorative-green: #00d16a;
+  --b-color-separator-inverse-secondary: #5c6874;
+  --b-color-separator-inverse-primary: #2f3e4d;
+  --b-color-separator-secondary: #c8ccd0;
+  --b-color-separator-primary: #dadddf;
+  --b-color-outline-inverse-critical-active: #ffded3;
+  --b-color-outline-inverse-critical-hover: #ffbda6;
+  --b-color-outline-inverse-critical: #ff9a78;
+  --b-color-outline-inverse-disabled: #455460;
+  --b-color-outline-inverse-primary-active: #9da5ac;
+  --b-color-outline-inverse-primary-hover: #6c7782;
+  --b-color-outline-inverse-primary: #2f3e4d;
+  --b-color-outline-success-active: #004724;
+  --b-color-outline-success-hover: #00773c;
+  --b-color-outline-success: #008845;
+  --b-color-outline-critical-active: #751e00;
+  --b-color-outline-critical-hover: #c13101;
+  --b-color-outline-critical: #dc3801;
+  --b-color-outline-selected: #001222;
+  --b-color-outline-disabled: #dadddf;
+  --b-color-outline-tertiary-active: #001222;
+  --b-color-outline-tertiary-hover: #6c7782;
+  --b-color-outline-tertiary: #8c959d;
+  --b-color-outline-secondary-active: #001222;
+  --b-color-outline-secondary-hover: #b7bdc2;
+  --b-color-outline-secondary: #c8ccd0;
+  --b-color-outline-primary-active: #001222;
+  --b-color-outline-primary-hover: #c8ccd0;
+  --b-color-outline-primary: #dadddf;
+  --b-color-link-quiet-disabled: #8c959d;
+  --b-color-link-quiet-active: #5c6874;
+  --b-color-link-quiet-hover: #5c6874;
+  --b-color-link-quiet: #001222;
+  --b-color-link-primary-visited-active: #710ab3;
+  --b-color-link-primary-visited-hover: #710ab3;
+  --b-color-link-primary-visited: #540884;
+  --b-color-link-primary-disabled: #8c959d;
+  --b-color-link-primary-active: #0f75dc;
+  --b-color-link-primary-hover: #0f75dc;
+  --b-color-link-primary: #0065c9;
+  --b-color-label-always-dark: #001222;
+  --b-color-label-always-light-tertiary-active: #54616d;
+  --b-color-label-always-light-tertiary-hover: #737e88;
+  --b-color-label-always-light-tertiary: #848d96;
+  --b-color-label-always-light-secondary-active: #737e88;
+  --b-color-label-always-light-secondary-hover: #959da5;
+  --b-color-label-always-light-secondary: #a6adb3;
+  --b-color-label-always-light-primary-active: #959da5;
+  --b-color-label-always-light-primary-hover: #c8ccd0;
+  --b-color-label-always-light-primary: #ecedef;
+  --b-color-label-always-light: #ffffff;
+  --b-color-label-on-background-highlight-weak: #0065c9;
+  --b-color-label-on-background-success-weak: #00773c;
+  --b-color-label-on-background-warning-weak: #955900;
+  --b-color-label-on-background-critical-weak: #c13101;
+  --b-color-label-inverse-critical-active: #ffded3;
+  --b-color-label-inverse-critical-hover: #ffbda6;
+  --b-color-label-inverse-critical: #ff9a78;
+  --b-color-label-inverse-disabled: #737e88;
+  --b-color-label-inverse-secondary: #9da5ac;
+  --b-color-label-inverse-primary-active: #ecedef;
+  --b-color-label-inverse-primary-hover: #f4f5f6;
+  --b-color-label-inverse-primary: #ffffff;
+  --b-color-label-on-color: #ffffff;
+  --b-color-label-success: #008845;
+  --b-color-label-highlight: #0f75dc;
+  --b-color-label-warning: #ab6600;
+  --b-color-label-critical-active: #751e00;
+  --b-color-label-critical-hover: #c13101;
+  --b-color-label-critical: #dc3801;
+  --b-color-label-disabled: #8c959d;
+  --b-color-label-tertiary: #8c959d;
+  --b-color-label-secondary: #5c6874;
+  --b-color-label-primary-active: #6c7782;
+  --b-color-label-primary-hover: #5c6874;
+  --b-color-label-primary: #001222;
+  --b-color-background-always-dark-tertiary-selected: #00305f;
+  --b-color-background-always-dark-tertiary-disabled: #ecedef;
+  --b-color-background-always-dark-tertiary-active: #455460;
+  --b-color-background-always-dark-tertiary-hover: #3d4c5a;
+  --b-color-background-always-dark-tertiary: #2f3e4d;
+  --b-color-background-always-dark-secondary-selected: #00305f;
+  --b-color-background-always-dark-secondary-disabled: #ecedef;
+  --b-color-background-always-dark-secondary-active: #455460;
+  --b-color-background-always-dark-secondary-hover: #364553;
+  --b-color-background-always-dark-secondary: #213140;
+  --b-color-background-always-dark-primary-selected: #00305f;
+  --b-color-background-always-dark-primary-disabled: #ecedef;
+  --b-color-background-always-dark-primary-active: #213140;
+  --b-color-background-always-dark-primary-hover: #132434;
+  --b-color-background-always-dark-primary: #001222;
+  --b-color-background-always-dark-selected: #00305f;
+  --b-color-background-always-dark-disabled: #ecedef;
+  --b-color-background-always-dark-active: #8c959d;
+  --b-color-background-always-dark-hover: #5c6874;
+  --b-color-background-always-dark: #001222;
+  --b-color-background-always-light-selected: #e3effb;
+  --b-color-background-always-light-disabled: #ecedef;
+  --b-color-background-always-light-active: #ecedef;
+  --b-color-background-always-light-hover: #f4f5f6;
+  --b-color-background-always-light: #ffffff;
+  --b-color-background-inverse-critical-strong-active: #ffded3;
+  --b-color-background-inverse-critical-strong-hover: #ffbda6;
+  --b-color-background-inverse-critical-strong: #ff9a78;
+  --b-color-background-inverse-critical-weak: #5c1800;
+  --b-color-background-inverse-disabled: #273746;
+  --b-color-background-inverse-secondary-active: #364553;
+  --b-color-background-inverse-secondary-hover: #273746;
+  --b-color-background-inverse-secondary: #1a2b3b;
+  --b-color-background-inverse-primary-active: #6c7782;
+  --b-color-background-inverse-primary-hover: #5c6874;
+  --b-color-background-inverse-primary: #001222;
+  --b-color-background-highlight-strong: #0f75dc;
+  --b-color-background-highlight-weak: #f0f6fd;
+  --b-color-background-success-strong: #008845;
+  --b-color-background-success-weak: #e4faef;
+  --b-color-background-warning-strong: #d77f00;
+  --b-color-background-warning-weak-active: #ffe0b3;
+  --b-color-background-warning-weak-hover: #ffecd0;
+  --b-color-background-warning-weak: #fff4e5;
+  --b-color-background-critical-strong-active: #751e00;
+  --b-color-background-critical-strong-hover: #c13101;
+  --b-color-background-critical-strong: #dc3801;
+  --b-color-background-critical-weak: #fff3ef;
+  --b-color-background-spotlight: #ffe379;
+  --b-color-background-selected-active: #c8dff7;
+  --b-color-background-selected-hover: #d4e6f9;
+  --b-color-background-selected: #e3effb;
+  --b-color-background-disabled: #ecedef;
+  --b-color-background-modal-active: #ecedef;
+  --b-color-background-modal-hover: #f4f5f6;
+  --b-color-background-modal: #ffffff;
+  --b-color-background-quaternary-active: #aeb5ba;
+  --b-color-background-quaternary-hover: #b7bdc2;
+  --b-color-background-quaternary: #c0c5ca;
+  --b-color-background-tertiary-active: #dadddf;
+  --b-color-background-tertiary-hover: #e2e5e7;
+  --b-color-background-tertiary: #ecedef;
+  --b-color-background-secondary-active: #e2e5e7;
+  --b-color-background-secondary-hover: #ecedef;
+  --b-color-background-secondary: #f4f5f6;
+  --b-color-background-primary-active: #ecedef;
+  --b-color-background-primary-hover: #f4f5f6;
+  --b-color-background-primary: #ffffff;
+  --b-gradient-data-grid-highlighted-hover: linear-gradient(270deg, var(--b-color-background-warning-weak-hover) 0%, rgba(255, 236, 208, .82) 53.34%, rgba(255, 236, 208, .75) 61.73%, rgba(255, 236, 208, .11) 99.25%, rgba(255, 236, 208, 0) 100%);
+  --b-gradient-data-grid-selected-hover: linear-gradient(270deg, var(--b-color-background-selected-hover) 0%, rgba(212, 230, 249, .82) 53.34%, rgba(212, 230, 249, .75) 61.73%, rgba(212, 230, 249, .11) 99.25%, rgba(212, 230, 249, 0) 100%);
+  --b-gradient-data-grid-zebra-hover: linear-gradient(270deg, var(--b-color-background-secondary-hover) 0%, rgba(236, 237, 239, .82) 53.34%, rgba(236, 237, 239, .75) 61.73%, rgba(236, 237, 239, .11) 99.25%, rgba(236, 237, 239, 0) 100%);
+  --b-gradient-data-grid-hover: linear-gradient(270deg, var(--b-color-background-primary-hover) 0%, rgba(247, 247, 248, .82) 53.34%, rgba(247, 247, 248, .75) 61.73%, rgba(247, 247, 248, .11) 99.25%, rgba(247, 247, 248, 0) 100%);
+  --b-tooltip-z-index: var(--b-z-index-global-elevated);
+  --b-tooltip-padding: var(--b-spacer-020) var(--b-spacer-040);
+  --b-tooltip-color: var(--b-color-label-inverse-primary);
+  --b-tooltip-border-radius: var(--b-border-radius-s);
+  --b-tooltip-background-color: var(--b-color-background-inverse-primary);
+  --b-toast-item-z-index: var(--b-z-index-global-instant-interaction);
+  --b-toast-item-spacing: var(--b-spacer-070);
+  --b-toast-spacing-outer: var(--b-spacer-070);
+  --b-toast-spacing-inner: var(--b-spacer-060);
+  --b-popover-z-index: var(--b-z-index-global-elevated);
+  --b-text-rich-text-caption-table-padding: var(--b-spacer-040) var(--b-spacer-060);
+  --b-text-rich-text-caption-blockquote-margin: var(--b-spacer-060) 0 var(--b-spacer-060) var(--b-spacer-070);
+  --b-text-rich-text-caption-list-margin: 0 0 var(--b-spacer-010) 0;
+  --b-text-rich-text-caption-list-padding-left: var(--b-spacer-070);
+  --b-text-rich-text-caption-paragraph-margin: 0 0 var(--b-spacer-030) 0;
+  --b-text-rich-text-table-caption-margin: 0 0 var(--b-spacer-030) 0;
+  --b-text-rich-text-table-padding: var(--b-spacer-050) var(--b-spacer-070);
+  --b-text-rich-text-table-margin: var(--b-spacer-070) 0 var(--b-spacer-070) 0;
+  --b-text-rich-text-table-border: var(--b-border-width-s) solid var(--b-color-outline-primary);
+  --b-text-rich-text-blockquote-margin: var(--b-spacer-070) 0 var(--b-spacer-070) var(--b-spacer-070);
+  --b-text-rich-text-mark-background-color: var(--b-color-background-highlight-weak);
+  --b-text-rich-text-pre-padding: var(--b-spacer-050) var(--b-spacer-070);
+  --b-text-rich-text-pre-margin: var(--b-spacer-070) 0 var(--b-spacer-070) 0;
+  --b-text-rich-text-code-background-color: var(--b-color-background-secondary);
+  --b-text-rich-text-list-margin: 0 0 var(--b-spacer-020) 0;
+  --b-text-rich-text-list-padding-left: var(--b-spacer-080);
+  --b-text-rich-text-paragraph-margin: 0 0 var(--b-spacer-040) 0;
+  --b-text-rich-text-heading-margin: var(--b-spacer-100) 0 var(--b-spacer-050) 0;
+  --b-focus-ring-outline: var(--b-border-width-l);
+  --b-focus-ring-spacer: var(--b-border-width-s);
+}