From 6101e9b12d70360b70e83a6d8dc21ae0524779e3 Mon Sep 17 00:00:00 2001 From: Srinivas Padidapelli Date: Tue, 27 Feb 2024 15:39:56 +0530 Subject: [PATCH 01/11] chore(datagrid): update stories for datagrid --- .../datagrid-action-overflow.stories.ts | 73 ++++++------ .../datagrid/datagrid-column.stories.ts | 109 +++++++++--------- .../datagrid/datagrid-detail.stories.ts | 65 ++++++----- .../datagrid-expandable-row.stories.ts | 88 +++++++------- .../datagrid/datagrid-page-size.stories.ts | 59 +++++----- .../datagrid/datagrid-pagination.stories.ts | 83 ++++++------- .../datagrid/datagrid-placeholder.stories.ts | 51 ++++---- .../stories/datagrid/datagrid-row.stories.ts | 33 +++--- .../stories/datagrid/datagrid.stories.ts | 101 ++++++++-------- .../modal-stacked-on-detail.stories.ts | 37 +++--- .../nested-detail-in-detail.stories.ts | 36 +++--- .../nested-popover-in-detail.stories.ts | 41 +++---- 12 files changed, 410 insertions(+), 366 deletions(-) diff --git a/.storybook/stories/datagrid/datagrid-action-overflow.stories.ts b/.storybook/stories/datagrid/datagrid-action-overflow.stories.ts index 8346dcdff3..90f19db2b0 100644 --- a/.storybook/stories/datagrid/datagrid-action-overflow.stories.ts +++ b/.storybook/stories/datagrid/datagrid-action-overflow.stories.ts @@ -6,13 +6,45 @@ import { ClrConditionalModule, ClrDatagridActionOverflow, ClrDatagridModule, commonStringsDefault } from '@clr/angular'; import { action } from '@storybook/addon-actions'; -import { Parameters } from '@storybook/addons'; -import { Story } from '@storybook/angular'; +import { moduleMetadata, Story, StoryObj } from '@storybook/angular'; import { elements } from '../../helpers/elements.data'; -import { setupStorybook } from '../../helpers/setup-storybook.helpers'; -const defaultStory: Story = args => ({ +export default { + title: 'Datagrid/Action Overflow', + component: ClrDatagridActionOverflow, + decorators: [ + moduleMetadata({ + imports: [ClrDatagridModule, ClrConditionalModule], + }), + ], + argTypes: { + // inputs + clrDgActionOverflowOpen: { defaultValue: false }, + clrDgActionOverflowButtonLabel: { defaultValue: commonStringsDefault.rowActions }, + // outputs + clrDgActionOverflowOpenChange: { control: { disable: true } }, + // methods + closeOverflowContent: { control: { disable: true }, table: { disable: true } }, + // story helpers + elements: { control: { disable: true }, table: { disable: true } }, + }, + args: { + // outputs + clrDgActionOverflowOpenChange: action('clrDgActionOverflowOpenChange'), + // story helpers + elements, + highlight: true, + singleSelectable: false, + multiSelectable: false, + expandable: false, + compact: false, + hidableColumns: false, + height: 0, + }, +}; + +const ActionOverflowTemplate: Story = args => ({ template: `