Merged in feat/SW-338-filter-sort-ui (pull request #896)

Feat/SW-338 design filters and sorting on select hotel * feat(SW-338): design hotel sort dropdown * Translations * feat(SW-338): style filters * Bold * Import type * Translations * Rename and add translation * Rename translation Approved-by: Bianca Widstam
2024-11-15 07:18:30 +00:00
parent a6a0b0cf15
commit 18d40120b9
20 changed files with 159 additions and 71 deletions
--- a/components/TempDesignSystem/Select/index.tsx
+++ b/components/TempDesignSystem/Select/index.tsx
@@ -36,6 +36,7 @@ export default function Select({
  value,
  maxHeight,
  showRadioButton = false,
+  discreet = false,
 }: SelectProps) {
  const [rootDiv, setRootDiv] = useState<SelectPortalContainer>(undefined)

@@ -53,7 +54,7 @@ export default function Select({
    <div className={styles.container} ref={setRef}>
      <ReactAriaSelect
        aria-label={ariaLabel}
-        className={styles.select}
+        className={`${styles.select} ${discreet && styles.discreet}`}
        defaultSelectedKey={defaultSelectedKey}
        name={name}
        onSelectionChange={handleOnSelect}
@@ -63,12 +64,15 @@ export default function Select({
        <Body asChild fontOnly>
          <Button className={styles.input} data-testid={name}>
            <span className={styles.inputContentWrapper} tabIndex={tabIndex}>
-              <Label required={required} size="small">
+              <Label required={required} size={discreet ? "discreet" : "small"}>
                {label}
+                {discreet && `:`}
              </Label>
              <SelectValue />
            </span>
-            <SelectChevron />
+            <SelectChevron
+              {...(discreet ? { color: "baseButtonTextOnFillNormal" } : {})}
+            />
          </Button>
        </Body>
        <Body asChild fontOnly>