docs.mdx

MDX Components

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

---

Code block

Default

cube(`monthly_retention`, {
  // ...

  dimensions: {
    months_since_signup: {
      sql: `DATEDIFF('month', ${CUBE}.signup_month, ${CUBE}.activity_month)`,
      type: `number`,
    },

    signup_date: {
      sql: `(signup_month AT TIME ZONE 'America/Los_Angeles')`,
      type: `time`,
    },
  },
});

With tabs

cubes:
  - name: monthly_retention
    # ...
    dimensions:
      - name: months_since_signup
        sql: "DATEDIFF('month', signup_month, activity_month)"
        type: number

      - name: signup_date
        sql: "(signup_month AT TIME ZONE 'America/Los_Angeles')"
        type: time

cube(`monthly_retention`, {
  // ...

  dimensions: {
    months_since_signup: {
      sql: `DATEDIFF('month', ${CUBE}.signup_month, ${CUBE}.activity_month)`,
      type: `number`,
    },

    signup_date: {
      sql: `(signup_month AT TIME ZONE 'America/Los_Angeles')`,
      type: `time`,
    },
  },
});

Alert Box

DangerBox

DangerBox

InfoBox

InfoBox

SuccessBox

SuccessBox

WarningBox

WarningBox

Buttons

Send Send Yes No

Send Send Yes No

Inline Button

You can implement the element directly by using inline Button component.

Inline code

SQL query SELECT * FROM users.

Selected text

• TODO

Table

Field	Value	Description
Host	demo-db.cube.dev	Foo
Port	5432	Bar
Database	ecom	Baz
Username	cube	More Foo
Password	12345	More Bar

Video

Loom

Youtube

Image

Card links

Two-column

<Grid cols={2} imageSize={[undefined, 50]}>

Three-column

<Grid imageSize={[56, 56]}>

Cube Cloud Promo block

Playground is available in Cube Cloud on all tiers.

Event promo block

<EventPromoBlock coverUrl="https://ucarecdn.com/46e9fed6-51af-4ba6-9956-028a205e639f/" startsAt={(new Date()).setDate((new Date()).getDate() + 30)} title="How Rittman Analytics delivers the semantic layer today with Cube" linkText="Register Now" linkUrl="#" />

<EventPromoBlock coverUrl="https://ucarecdn.com/46e9fed6-51af-4ba6-9956-028a205e639f/" startsAt={(new Date()).setDate((new Date()).getDate() + 3)} title="How Rittman Analytics delivers the semantic layer today with Cube" linkText="Register Now" linkUrl="#" />

<EventPromoBlock coverUrl="https://ucarecdn.com/46e9fed6-51af-4ba6-9956-028a205e639f/" startsAt={(new Date()).setDate((new Date()).getDate() - 1)} endsAt={(new Date()).setDate((new Date()).getDate() + 1)} title="How Rittman Analytics delivers the semantic layer today with Cube" linkText="Register Now" linkUrl="#" />

<EventPromoBlock coverUrl="https://ucarecdn.com/46e9fed6-51af-4ba6-9956-028a205e639f/" startsAt={new Date('2023-03-29')} title="How Rittman Analytics delivers the semantic layer today with Cube" linkText="Register Now" linkUrl="#" />

Case Study promo block

<CaseStudyPromoBlock title={}

How RamSoft built its users native embedded analytics—in two weeks. Read the case studies.