import React from 'react'; import { storybookArgTypes, storybookExcludedControlParams, StoryMetaType, } from '@lg-tools/storybook-utils'; import { StoryFn, StoryObj } from '@storybook/react'; import { css } from '@leafygreen-ui/emotion'; import { Body, H3, Link } from '@leafygreen-ui/typography'; import InlineDefinition, { InlineDefinitionProps } from '.'; const meta: StoryMetaType = { title: 'Components/Typography/InlineDefinition', component: InlineDefinition, parameters: { default: 'LiveExample', controls: { exclude: [...storybookExcludedControlParams, 'trigger', 'open'], }, }, args: { darkMode: false, definition: 'Sharding is a method for horizontally scaling across multiple replica sets by breaking up large datasets (e.g. partitioning) into smaller parts. Sharding is native to MongoDB.', spacing: 9, children: 'Shard', }, argTypes: { definition: { control: 'text' }, children: { control: 'text' }, darkMode: storybookArgTypes.darkMode, }, }; export default meta; export const LiveExample: StoryFn = ({ darkMode, ...args }) => (

Shard {' '} your cluster

Base hourly rate is for a MongoDB{' '} replica set {' '} with 3 data bearing servers. MongoDB shards data at the{' '} collections {' '} level, distributing the collection data across the shards in the cluster.

); LiveExample.parameters = { chromatic: { disableSnapshot: true, }, }; export const LightMode: StoryObj = { args: { open: true, darkMode: false, definition: 'Sharding is a method for horizontally scaling across multiple replica sets by breaking up large datasets (e.g. partitioning) into smaller parts. Sharding is native to MongoDB.', children: 'Shard', }, render: ({ darkMode, ...args }) => ( ), parameters: { chromatic: { delay: 100, }, }, }; export const DarkMode: StoryObj = { args: { ...LightMode.args, darkMode: true, }, decorators: [ StoryFn => (

), ], render: LightMode.render, parameters: { chromatic: { delay: 100, }, }, };