diff --git a/adev/shared-docs/components/select/select.component.html b/adev/shared-docs/components/select/select.component.html
index da98bd4a0b38..e370028ccaf5 100644
--- a/adev/shared-docs/components/select/select.component.html
+++ b/adev/shared-docs/components/select/select.component.html
@@ -57,7 +57,7 @@
[(value)]="selectedValues"
[multi]="false"
ngComboboxWidget
- class="example-listbox"
+ class="docs-select-listbox"
focusMode="activedescendant"
tabindex="-1"
selectionMode="explicit"
@@ -74,12 +74,6 @@
class="docs-select-option"
>
{{ option.label }}
- check
}
diff --git a/adev/shared-docs/components/select/select.component.scss b/adev/shared-docs/components/select/select.component.scss
index 90a88ae091f5..88640d24fb6a 100644
--- a/adev/shared-docs/components/select/select.component.scss
+++ b/adev/shared-docs/components/select/select.component.scss
@@ -5,8 +5,12 @@
width: 100%;
display: flex;
flex-direction: column;
+}
+
+.docs-combobox-container {
border: 1px solid var(--border-color);
border-radius: 0.25rem;
+ overflow: hidden;
}
.docs-select-input-container {
@@ -69,6 +73,8 @@
.docs-select-dialog {
position: absolute;
+ box-sizing: border-box;
+ width: 100%;
left: auto;
right: auto;
top: auto;
@@ -76,6 +82,7 @@
padding: 0;
border: 1px solid var(--border-color);
border-radius: 0.25rem;
+ overflow: hidden;
background-color: var(--septenary-contrast);
color: inherit;
@@ -178,16 +185,8 @@
color: var(--vivid-pink);
background-color: color-mix(in srgb, var(--vivid-pink) 5%, transparent);
}
-
- &:not([aria-selected='true']) .docs-select-check-icon {
- display: none;
- }
}
.docs-select-option-label {
flex: 1;
}
-
-.docs-select-check-icon {
- font-size: 0.9rem;
-}
diff --git a/adev/shared-docs/components/select/select.component.ts b/adev/shared-docs/components/select/select.component.ts
index 99b0cf00a6a9..1ab6002fc5ac 100644
--- a/adev/shared-docs/components/select/select.component.ts
+++ b/adev/shared-docs/components/select/select.component.ts
@@ -39,7 +39,6 @@ export class Select implements FormValueControl {
readonly id = input.required({alias: 'selectId'});
readonly name = input.required();
readonly options = input.required();
- readonly disabled = input(false);
readonly listbox = viewChild(Listbox);
readonly combobox = viewChild(Combobox);
@@ -76,7 +75,7 @@ export class Select implements FormValueControl {
const values = this.selectedValues();
if (values.length) {
this.value.set(values[0]);
- //this.popupExpanded.set(false);
+ this.popupExpanded.set(false);
}
}