[Datepicker]: icons can exit input box container if width is squashed

[artur-langl]

Problem

when the datepicker component's width is squashed, causes the icons on the right to exit it's input box bounds

Solution

override min-width to 0 on input.tedi-date-picker__input and div.tedi-date-picker__input-buttons

Examples and information

[artur-langl]

fixing this myself

[artur-langl]

repro case for posterity (may require some fiddling with viewport size)

export const WithLowWidth: StoryObj<DatePickerComponent> = {
  render: () => {
    return {
      template: `
        <div style="display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));">
          <tedi-date-picker
            inputPlaceholder="Select a date..."
          />
          <tedi-date-picker
            inputPlaceholder="Select a date..."
          />
          <tedi-date-picker
            inputPlaceholder="Select a date..."
          />
          <tedi-date-picker
            inputPlaceholder="Select a date..."
          />
        </div>

      `,
    };
  },
};