Components v4 fixed/changes from studio

projects/fusion-ui/components/calendar/v4/calendar-v4.component.scss

@@ -110,10 +110,12 @@
           span {
             position: relative;
           }
-
+          &:empty{
+            cursor: default;
+          }
 
           // region regular day hover
-          &:not(.selected):not(.disabled):not(.hover-current):hover {
+          &:not(.selected):not(.disabled):not(.hover-current):not(:empty):hover {
             &:before {
               @include calendar-circle(var(--fu-day-hover-bg-color), 50%);
             }

projects/fusion-ui/components/chip-filter/v4/chip-filter-button/chip-filter-button.component.stories.ts

@@ -72,6 +72,22 @@ const baseTemplateMultiselect = `
     </fusion-chip-filter-button>
 `;
 
+const datePeriodTemplate = `
+    <fusion-chip-filter-button [showCaretIcon]="showCaretIcon" [size]="size" [weight]="weight" [configuration]="configuration">
+        <div class="filter-element">
+            <fusion-dropdown style="--dropdown-overlay-min-width: 250px"
+                 [placeholderPrefix]="placeholderPrefix"
+                 [placeholder]="placeholder"
+                 [formControl]="formControl"
+                 [options]="options"
+                 [optionsTitle]="optionsTitle"
+                 [search]="search"
+                 >
+            </fusion-dropdown>
+        </div>
+    </fusion-chip-filter-button>
+`;
+
 export default {
     title: 'V4/Components/Dropdown/Triggers/ButtonFilter',
     component: ChipFilterButtonComponent,
@@ -380,7 +396,7 @@ export const DatePeriodPicker: Story = {
             formControl: new FormControl([MOCK_OPTIONS_PERIOD[1]]),
             configuration: {id: 1, mode: 'static', close: true, leftIcon: {icon: 'ph/calendar-blank'}}
         },
-        template: baseTemplate
+        template: datePeriodTemplate
     }),
     decorators: [componentWrapperDecorator(story => `<div style="height: 200px;">${story}</div>`)]
 };

projects/fusion-ui/components/daterange/v4/daterange-v4.component.stories.ts

@@ -112,7 +112,7 @@ new FormControl({
     }
 };
 
-export const SelectedToday: Story = {
+export const Today: Story = {
     render: args => ({
         props: {
             ...args,
@@ -124,7 +124,7 @@ export const SelectedToday: Story = {
         template: BASE_TEMPLATE
     })
 };
-SelectedToday.parameters = {
+Today.parameters = {
     docs: {
         description: {
             story: dedent`***formControl:***                     
@@ -138,7 +138,7 @@ new FormControl({
     }
 };
 
-export const SelectedLast14Days: Story = {
+export const Last14Days: Story = {
     render: args => ({
         props: {
             ...args,
@@ -150,6 +150,7 @@ export const SelectedLast14Days: Story = {
         template: BASE_TEMPLATE
     })
 };
+Last14Days.storyName = 'Last 14 days';
 
 export const WithoutPresets: Story = {
     render: args => ({
@@ -167,6 +168,7 @@ WithoutPresets.parameters = {
         }
     }
 };
+WithoutPresets.storyName = 'Without presets';
 
 export const LimitedRange: Story = {
     render: args => ({
@@ -190,6 +192,7 @@ LimitedRange.parameters = {
         }
     }
 };
+LimitedRange.storyName = 'Limited range';
 
 export const NotAllowFutureDateSelected: Story = {
     render: args => ({
@@ -207,6 +210,7 @@ NotAllowFutureDateSelected.parameters = {
         }
     }
 };
+NotAllowFutureDateSelected.storyName = 'Not future date';
 
 export const WithTimeSelect: Story = {
     render: args => ({
@@ -245,3 +249,4 @@ WithTimeSelect.parameters = {
         }
     }
 };
+WithTimeSelect.storyName = 'Selected time';