topaLE
/
ghostfolio
mirror of https://github.com/ghostfolio/ghostfolio
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Bugfix/fix storybook setup (#4168) 

* Fix storybook setup

* Update changelog
pull/3507/merge
Karel De Smet 2 weeks ago
committed by GitHub
parent
a4ee33f6df
commit
68868df41a
No known key found for this signature in database GPG Key ID: B5690EEEBB952194
9 changed files with 390 additions and 379 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      CHANGELOG.md
  2. 37
      libs/ui/src/lib/fire-calculator/fire-calculator.component.stories.ts
  3. 443
      libs/ui/src/lib/line-chart/line-chart.component.stories.ts
  4. 32
      libs/ui/src/lib/logo/logo.component.stories.ts
  5. 24
      libs/ui/src/lib/no-transactions-info/no-transactions-info.component.stories.ts
  6. 47
      libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.stories.ts
  7. 27
      libs/ui/src/lib/premium-indicator/premium-indicator.component.stories.ts
  8. 59
      libs/ui/src/lib/trend-indicator/trend-indicator.component.stories.ts
  9. 98
      libs/ui/src/lib/value/value.component.stories.ts

2
CHANGELOG.md
View File

@ -24,6 +24,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
### Fixed ### Fixed
- Improved the handling of a missing url in the endpoint to fetch the logo of an asset or a platform - Improved the handling of a missing url in the endpoint to fetch the logo of an asset or a platform
- Fixed the _Storybook_ setup
## 2.132.0 - 2024-12-30 ## 2.132.0 - 2024-12-30
@ -47,6 +48,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- Upgraded `ngx-markdown` from version `18.0.0` to `19.0.0` - Upgraded `ngx-markdown` from version `18.0.0` to `19.0.0`
- Upgraded `Nx` from version `20.1.2` to `20.3.0` - Upgraded `Nx` from version `20.1.2` to `20.3.0`
- Upgraded `prisma` from version `6.0.1` to `6.1.0` - Upgraded `prisma` from version `6.0.1` to `6.1.0`
- Upgraded `storybook` from version `8.2.5` to `8.4.7`
- Upgraded `zone.js` from version `0.14.10` to `0.15.0` - Upgraded `zone.js` from version `0.14.10` to `0.15.0`
### Fixed ### Fixed

37
libs/ui/src/lib/fire-calculator/fire-calculator.component.stories.ts
View File

@ -4,47 +4,48 @@ import { CommonModule } from '@angular/common';
import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import '@angular/localize/init'; import '@angular/localize/init';
import { MatButtonModule } from '@angular/material/button'; import { MatButtonModule } from '@angular/material/button';
import { provideNativeDateAdapter } from '@angular/material/core';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatFormFieldModule } from '@angular/material/form-field'; import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input'; import { MatInputModule } from '@angular/material/input';
import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { Meta, Story, moduleMetadata } from '@storybook/angular'; import { moduleMetadata } from '@storybook/angular';
import type { Meta, StoryObj } from '@storybook/angular';
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader'; import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
import { GfValueModule } from '../value'; import { GfValueComponent } from '../value';
import { FireCalculatorComponent } from './fire-calculator.component'; import { GfFireCalculatorComponent } from './fire-calculator.component';
import { FireCalculatorService } from './fire-calculator.service'; import { FireCalculatorService } from './fire-calculator.service';
export default { export default {
title: 'FIRE Calculator', title: 'FIRE Calculator',
component: FireCalculatorComponent, component: GfFireCalculatorComponent,
decorators: [ decorators: [
moduleMetadata({ moduleMetadata({
declarations: [FireCalculatorComponent],
imports: [ imports: [
CommonModule, CommonModule,
FormsModule, FormsModule,
GfValueModule, GfFireCalculatorComponent,
GfValueComponent,
MatButtonModule, MatButtonModule,
MatDatepickerModule,
MatFormFieldModule, MatFormFieldModule,
MatInputModule, MatInputModule,
NgxSkeletonLoaderModule, NgxSkeletonLoaderModule,
NoopAnimationsModule, NoopAnimationsModule,
ReactiveFormsModule ReactiveFormsModule
], ],
providers: [FireCalculatorService] providers: [FireCalculatorService, provideNativeDateAdapter()]
}) })
] ]
} as Meta<FireCalculatorComponent>; } as Meta<GfFireCalculatorComponent>;
const Template: Story<FireCalculatorComponent> = ( type Story = StoryObj<GfFireCalculatorComponent>;
args: FireCalculatorComponent
) => ({
props: args
});
export const Simple = Template.bind({}); export const Simple: Story = {
Simple.args = { args: {
currency: 'USD', currency: 'USD',
fireWealth: 0, fireWealth: 0,
locale: locale locale: locale
}
}; };

443
libs/ui/src/lib/line-chart/line-chart.component.stories.ts
View File

@ -1,235 +1,234 @@
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { Meta, Story, moduleMetadata } from '@storybook/angular'; import { moduleMetadata } from '@storybook/angular';
import type { Meta, StoryObj } from '@storybook/angular';
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader'; import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
import { LineChartComponent } from './line-chart.component'; import { GfLineChartComponent } from './line-chart.component';
export default { export default {
title: 'Line Chart', title: 'Line Chart',
component: LineChartComponent, component: GfLineChartComponent,
decorators: [ decorators: [
moduleMetadata({ moduleMetadata({
declarations: [LineChartComponent], imports: [CommonModule, GfLineChartComponent, NgxSkeletonLoaderModule]
imports: [CommonModule, NgxSkeletonLoaderModule]
}) })
] ]
} as Meta<LineChartComponent>; } as Meta<GfLineChartComponent>;
const Template: Story<LineChartComponent> = (args: LineChartComponent) => ({ type Story = StoryObj<GfLineChartComponent>;
props: args
});
export const Simple = Template.bind({}); export const Simple: Story = {
Simple.args = { args: {
historicalDataItems: [ historicalDataItems: [
{ {
date: '2017-01-01', date: '2017-01-01',
value: 2561.60376 value: 2561.60376
}, },
{ {
date: '2017-02-01', date: '2017-02-01',
value: 2261.60376 value: 2261.60376
}, },
{ {
date: '2017-03-01', date: '2017-03-01',
value: 2268.68157074 value: 2268.68157074
}, },
{ {
date: '2017-04-01', date: '2017-04-01',
value: 2525.2942 value: 2525.2942
}, },
{ {
date: '2017-05-01', date: '2017-05-01',
value: 2929.3595107399997 value: 2929.3595107399997
}, },
{ {
date: '2017-06-01', date: '2017-06-01',
value: 3088.5172438900004 value: 3088.5172438900004
}, },
{ {
date: '2017-07-01', date: '2017-07-01',
value: 3281.2490946300004 value: 3281.2490946300004
}, },
{ {
date: '2017-08-01', date: '2017-08-01',
value: 4714.57822537 value: 4714.57822537
}, },
{ {
date: '2017-09-01', date: '2017-09-01',
value: 5717.262455259565 value: 5717.262455259565
}, },
{ {
date: '2017-10-01', date: '2017-10-01',
value: 5338.742482334544 value: 5338.742482334544
}, },
{ {
date: '2017-11-01', date: '2017-11-01',
value: 6361.263771554509 value: 6361.263771554509
}, },
{ {
date: '2017-12-01', date: '2017-12-01',
value: 8373.260491904595 value: 8373.260491904595
}, },
{ {
date: '2018-01-01', date: '2018-01-01',
value: 9783.208968191562 value: 9783.208968191562
}, },
{ {
date: '2018-02-01', date: '2018-02-01',
value: 7841.2667100173 value: 7841.2667100173
}, },
{ {
date: '2018-03-01', date: '2018-03-01',
value: 8582.133039380678 value: 8582.133039380678
}, },
{ {
date: '2018-04-01', date: '2018-04-01',
value: 5901.8362986766715 value: 5901.8362986766715
}, },
{ {
date: '2018-05-01', date: '2018-05-01',
value: 7367.392976151925 value: 7367.392976151925
}, },
{ {
date: '2018-06-01', date: '2018-06-01',
value: 6490.164314049853 value: 6490.164314049853
}, },
{ {
date: '2018-07-01', date: '2018-07-01',
value: 6365.351621654618 value: 6365.351621654618
}, },
{ {
date: '2018-08-01', date: '2018-08-01',
value: 6614.532706931272 value: 6614.532706931272
}, },
{ {
date: '2018-09-01', date: '2018-09-01',
value: 6402.052882414409 value: 6402.052882414409
}, },
{ {
date: '2018-10-01', date: '2018-10-01',
value: 15270.327917651943 value: 15270.327917651943
}, },
{ {
date: '2018-11-01', date: '2018-11-01',
value: 13929.833891940816 value: 13929.833891940816
}, },
{ {
date: '2018-12-01', date: '2018-12-01',
value: 12995.832254431414 value: 12995.832254431414
}, },
{ {
date: '2019-01-01', date: '2019-01-01',
value: 11792.447013828998 value: 11792.447013828998
}, },
{ {
date: '2019-02-01', date: '2019-02-01',
value: 11988.224284346446 value: 11988.224284346446
}, },
{ {
date: '2019-03-01', date: '2019-03-01',
value: 13536.39667099519 value: 13536.39667099519
}, },
{ {
date: '2019-04-01', date: '2019-04-01',
value: 14301.83740090022 value: 14301.83740090022
}, },
{ {
date: '2019-05-01', date: '2019-05-01',
value: 14902.994910520581 value: 14902.994910520581
}, },
{ {
date: '2019-06-01', date: '2019-06-01',
value: 15373.418326284132 value: 15373.418326284132
}, },
{ {
date: '2019-07-01', date: '2019-07-01',
value: 17545.70705465703 value: 17545.70705465703
}, },
{ {
date: '2019-08-01', date: '2019-08-01',
value: 17206.28500223782 value: 17206.28500223782
}, },
{ {
date: '2019-09-01', date: '2019-09-01',
value: 17782.445200108898 value: 17782.445200108898
}, },
{ {
date: '2019-10-01', date: '2019-10-01',
value: 17050.25875252655 value: 17050.25875252655
}, },
{ {
date: '2019-11-01', date: '2019-11-01',
value: 18517.053521416237 value: 18517.053521416237
}, },
{ {
date: '2019-12-01', date: '2019-12-01',
value: 17850.649021651363 value: 17850.649021651363
}, },
{ {
date: '2020-01-01', date: '2020-01-01',
value: 18817.269786559067 value: 18817.269786559067
}, },
{ {
date: '2020-02-01', date: '2020-02-01',
value: 22769.842312027653 value: 22769.842312027653
}, },
{ {
date: '2020-03-01', date: '2020-03-01',
value: 23065.56002316582 value: 23065.56002316582
}, },
{ {
date: '2020-04-01', date: '2020-04-01',
value: 19738.122641884733 value: 19738.122641884733
}, },
{ {
date: '2020-05-01', date: '2020-05-01',
value: 25112.281463810643 value: 25112.281463810643
}, },
{ {
date: '2020-06-01', date: '2020-06-01',
value: 28753.054132147452 value: 28753.054132147452
}, },
{ {
date: '2020-07-01', date: '2020-07-01',
value: 32207.62827031543 value: 32207.62827031543
}, },
{ {
date: '2020-08-01', date: '2020-08-01',
value: 37837.88816828611 value: 37837.88816828611
}, },
{ {
date: '2020-09-01', date: '2020-09-01',
value: 50018.740185519295 value: 50018.740185519295
}, },
{ {
date: '2020-10-01', date: '2020-10-01',
value: 46593.322295801525 value: 46593.322295801525
}, },
{ {
date: '2020-11-01', date: '2020-11-01',
value: 44440.18743231742 value: 44440.18743231742
}, },
{ {
date: '2020-12-01', date: '2020-12-01',
value: 57582.23077536893 value: 57582.23077536893
}, },
{ {
date: '2021-01-01', date: '2021-01-01',
value: 68823.02446077733 value: 68823.02446077733
}, },
{ {
date: '2021-02-01', date: '2021-02-01',
value: 64516.42092139593 value: 64516.42092139593
}, },
{ {
date: '2021-03-01', date: '2021-03-01',
value: 82465.97581106682 value: 82465.97581106682
}, },
{ {
date: '2021-03-18', date: '2021-03-18',
value: 86666.03082624623 value: 86666.03082624623
} }
], ],
isAnimated: true isAnimated: true
}
}; };

32
libs/ui/src/lib/logo/logo.component.stories.ts
View File

@ -1,30 +1,32 @@
import { Meta, Story, moduleMetadata } from '@storybook/angular'; import { moduleMetadata } from '@storybook/angular';
import type { Meta, StoryObj } from '@storybook/angular';
import { LogoComponent } from './logo.component'; import { GfLogoComponent } from './logo.component';
export default { export default {
title: 'Logo', title: 'Logo',
component: LogoComponent, component: GfLogoComponent,
decorators: [ decorators: [
moduleMetadata({ moduleMetadata({
imports: [] imports: []
}) })
] ]
} as Meta<LogoComponent>; } as Meta<GfLogoComponent>;
const Template: Story<LogoComponent> = (args: LogoComponent) => ({ type Story = StoryObj<GfLogoComponent>;
props: args
});
export const Default = Template.bind({}); export const Default: Story = {
Default.args = {}; args: {}
};
export const Large = Template.bind({}); export const Large: Story = {
Large.args = { args: {
size: 'large' size: 'large'
}
}; };
export const NoLabel = Template.bind({}); export const NoLabel: Story = {
NoLabel.args = { args: {
showLabel: false showLabel: false
}
}; };

24
libs/ui/src/lib/no-transactions-info/no-transactions-info.component.stories.ts
View File

@ -1,25 +1,23 @@
import { GfLogoModule } from '@ghostfolio/ui/logo'; import { GfLogoComponent } from '@ghostfolio/ui/logo';
import { RouterTestingModule } from '@angular/router/testing'; import { RouterTestingModule } from '@angular/router/testing';
import { Meta, Story, moduleMetadata } from '@storybook/angular'; import { moduleMetadata } from '@storybook/angular';
import type { Meta, StoryObj } from '@storybook/angular';
import { NoTransactionsInfoComponent } from './no-transactions-info.component'; import { GfNoTransactionsInfoComponent } from './no-transactions-info.component';
export default { export default {
title: 'No Transactions Info', title: 'No Transactions Info',
component: NoTransactionsInfoComponent, component: GfNoTransactionsInfoComponent,
decorators: [ decorators: [
moduleMetadata({ moduleMetadata({
imports: [GfLogoModule, RouterTestingModule] imports: [GfLogoComponent, RouterTestingModule]
}) })
] ]
} as Meta<NoTransactionsInfoComponent>; } as Meta<GfNoTransactionsInfoComponent>;
const Template: Story<NoTransactionsInfoComponent> = ( type Story = StoryObj<GfNoTransactionsInfoComponent>;
args: NoTransactionsInfoComponent
) => ({
props: args
});
export const Default = Template.bind({}); export const Default: Story = {
Default.args = {}; args: {}
};

47
libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.stories.ts
View File

@ -1,38 +1,39 @@
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import '@angular/localize/init'; import '@angular/localize/init';
import { Meta, Story, moduleMetadata } from '@storybook/angular'; import { moduleMetadata } from '@storybook/angular';
import type { Meta, StoryObj } from '@storybook/angular';
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader'; import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
import { PortfolioProportionChartComponent } from './portfolio-proportion-chart.component'; import { GfPortfolioProportionChartComponent } from './portfolio-proportion-chart.component';
export default { export default {
title: 'Portfolio Proportion Chart', title: 'Portfolio Proportion Chart',
component: PortfolioProportionChartComponent, component: GfPortfolioProportionChartComponent,
decorators: [ decorators: [
moduleMetadata({ moduleMetadata({
declarations: [PortfolioProportionChartComponent], imports: [
imports: [CommonModule, NgxSkeletonLoaderModule] CommonModule,
GfPortfolioProportionChartComponent,
NgxSkeletonLoaderModule
]
}) })
] ]
} as Meta<PortfolioProportionChartComponent>; } as Meta<GfPortfolioProportionChartComponent>;
const Template: Story<PortfolioProportionChartComponent> = ( type Story = StoryObj<GfPortfolioProportionChartComponent>;
args: PortfolioProportionChartComponent
) => ({
props: args
});
export const Simple = Template.bind({}); export const Simple: Story = {
Simple.args = { args: {
baseCurrency: 'USD', baseCurrency: 'USD',
keys: ['name'], keys: ['name'],
locale: 'en-US', locale: 'en-US',
positions: { positions: {
Africa: { name: 'Africa', value: 983.22461479889288 }, Africa: { name: 'Africa', value: 983.22461479889288 },
Asia: { name: 'Asia', value: 12074.754633964973 }, Asia: { name: 'Asia', value: 12074.754633964973 },
Europe: { name: 'Europe', value: 34432.837085290535 }, Europe: { name: 'Europe', value: 34432.837085290535 },
'North America': { name: 'North America', value: 26539.89987780503 }, 'North America': { name: 'North America', value: 26539.89987780503 },
Oceania: { name: 'Oceania', value: 1402.220605072031 }, Oceania: { name: 'Oceania', value: 1402.220605072031 },
'South America': { name: 'South America', value: 4938.25202180719859 } 'South America': { name: 'South America', value: 4938.25202180719859 }
}
} }
}; };

27
libs/ui/src/lib/premium-indicator/premium-indicator.component.stories.ts
View File

@ -1,29 +1,28 @@
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { RouterTestingModule } from '@angular/router/testing'; import { RouterTestingModule } from '@angular/router/testing';
import { Meta, Story, moduleMetadata } from '@storybook/angular'; import { moduleMetadata } from '@storybook/angular';
import type { Meta, StoryObj } from '@storybook/angular';
import { PremiumIndicatorComponent } from './premium-indicator.component'; import { GfPremiumIndicatorComponent } from './premium-indicator.component';
export default { export default {
title: 'Premium Indicator', title: 'Premium Indicator',
component: PremiumIndicatorComponent, component: GfPremiumIndicatorComponent,
decorators: [ decorators: [
moduleMetadata({ moduleMetadata({
imports: [CommonModule, RouterTestingModule] imports: [CommonModule, RouterTestingModule]
}) })
] ]
} as Meta<PremiumIndicatorComponent>; } as Meta<GfPremiumIndicatorComponent>;
const Template: Story<PremiumIndicatorComponent> = ( type Story = StoryObj<GfPremiumIndicatorComponent>;
args: PremiumIndicatorComponent
) => ({
props: args
});
export const Default = Template.bind({}); export const Default: Story = {
Default.args = {}; args: {}
};
export const WithoutLink = Template.bind({}); export const WithoutLink = {
WithoutLink.args = { args: {
enableLink: false enableLink: false
}
}; };

59
libs/ui/src/lib/trend-indicator/trend-indicator.component.stories.ts
View File

@ -1,50 +1,53 @@
import { Meta, Story, moduleMetadata } from '@storybook/angular'; import { moduleMetadata } from '@storybook/angular';
import type { Meta, StoryObj } from '@storybook/angular';
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader'; import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
import { TrendIndicatorComponent } from './trend-indicator.component'; import { GfTrendIndicatorComponent } from './trend-indicator.component';
export default { export default {
title: 'Trend Indicator', title: 'Trend Indicator',
component: TrendIndicatorComponent, component: GfTrendIndicatorComponent,
decorators: [ decorators: [
moduleMetadata({ moduleMetadata({
imports: [NgxSkeletonLoaderModule] imports: [NgxSkeletonLoaderModule]
}) })
] ]
} as Meta<TrendIndicatorComponent>; } as Meta<GfTrendIndicatorComponent>;
const Template: Story<TrendIndicatorComponent> = ( type Story = StoryObj<GfTrendIndicatorComponent>;
args: TrendIndicatorComponent
) => ({
props: args
});
export const Loading = Template.bind({}); export const Loading: Story = {
Loading.args = { args: {
isLoading: true isLoading: true
}
}; };
export const Default = Template.bind({}); export const Default: Story = {
Default.args = {}; args: {}
};
export const Delayed = Template.bind({}); export const Delayed: Story = {
Delayed.args = { args: {
marketState: 'delayed', dateRange: '1d',
range: '1d' marketState: 'delayed'
}
}; };
export const Down = Template.bind({}); export const Down: Story = {
Down.args = { args: {
value: -1 value: -1
}
}; };
export const Up = Template.bind({}); export const Up: Story = {
Up.args = { args: {
value: 1 value: 1
}
}; };
export const MarketClosed = Template.bind({}); export const MarketClosed: Story = {
MarketClosed.args = { args: {
marketState: 'closed', dateRange: '1d',
range: '1d' marketState: 'closed'
}
}; };

98
libs/ui/src/lib/value/value.component.stories.ts
View File

@ -1,71 +1,77 @@
import { Meta, Story, moduleMetadata } from '@storybook/angular'; import { moduleMetadata } from '@storybook/angular';
import type { Meta, StoryObj } from '@storybook/angular';
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader'; import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
import { ValueComponent } from './value.component'; import { GfValueComponent } from './value.component';
export default { export default {
title: 'Value', title: 'Value',
component: ValueComponent, component: GfValueComponent,
decorators: [ decorators: [
moduleMetadata({ moduleMetadata({
imports: [NgxSkeletonLoaderModule] imports: [NgxSkeletonLoaderModule]
}) })
] ]
} as Meta<ValueComponent>; } as Meta<GfValueComponent>;
const Template: Story<ValueComponent> = (args: ValueComponent) => ({ type Story = StoryObj<GfValueComponent>;
props: args
});
export const Loading = Template.bind({}); export const Loading: Story = {
Loading.args = { args: {
value: undefined value: undefined
}
}; };
export const Currency = Template.bind({}); export const Currency: Story = {
Currency.args = { args: {
isCurrency: true, isCurrency: true,
locale: 'en-US', locale: 'en-US',
unit: 'USD', unit: 'USD',
value: 7 value: 7
}
}; };
export const Label = Template.bind({}); export const Label: Story = {
Label.args = { args: {
locale: 'en-US', locale: 'en-US',
value: 7.25 value: 7.25
}
}; };
export const PerformancePositive = Template.bind({}); export const PerformancePositive: Story = {
PerformancePositive.args = { args: {
locale: 'en-US', colorizeSign: true,
colorizeSign: true, isPercent: true,
isPercent: true, locale: 'en-US',
value: 0.0136810853673890378 value: 0.0136810853673890378
},
name: 'Performance (positive)'
}; };
PerformancePositive.storyName = 'Performance (positive)';
export const PerformanceNegative = Template.bind({}); export const PerformanceNegative: Story = {
PerformanceNegative.args = { args: {
locale: 'en-US', colorizeSign: true,
colorizeSign: true, isPercent: true,
isPercent: true, locale: 'en-US',
value: -0.0136810853673890378 value: -0.0136810853673890378
},
name: 'Performance (negative)'
}; };
PerformanceNegative.storyName = 'Performance (negative)';
export const PerformanceCloseToZero = Template.bind({}); export const PerformanceCloseToZero: Story = {
PerformanceCloseToZero.args = { args: {
locale: 'en-US', colorizeSign: true,
colorizeSign: true, isPercent: true,
isPercent: true, locale: 'en-US',
value: -2.388915360475e-8 value: -2.388915360475e-8
},
name: 'Performance (negative zero)'
}; };
PerformanceCloseToZero.storyName = 'Performance (negative zero)';
export const Precision = Template.bind({}); export const Precision: Story = {
Precision.args = { args: {
locale: 'en-US', locale: 'en-US',
precision: 3, precision: 3,
value: 7.2534802394809285309 value: 7.2534802394809285309
}
}; };

Write Preview
Loading…
Cancel
Save