D.School Component Library

Select: Disabled 

<div class="o-select o-select--home is-disabled o-form__item">
      <label for="select">
          Label
      </label>
      <select id="select" name="select" disabled="true">
          <option value="select-one">Select one</option>
          <option value="option-1">Option 1</option>
          <option value="option-2">Option 2</option>
      </select>
      <span class="o-field-note">
          This is a field note.
      </span>
  </div>
 
{% set base_class = select.base_class|default('o-select') %}
{% if select.options %}
  <div class="{{ bem(base_class, select.element, select.modifiers, select.extra) }}{{ select.error ? ' is-error' }}{{ select.attributes.disabled ? ' is-disabled' }} o-form__item" {{ attributes(select.container.attributes) }}>
    {% if select.label %}
      <label for="{{ select.name }}" {{ select.label_hidden ? ' class="is-visually-hidden"' }}>
        {{ select.label }}
        {% if select.attributes.required %}
          <span class="o-asterisk">*</span>
        {% endif %}
      </label>
    {% endif %}
    <select id="{{ select.name }}" name="{{ select.name }}" {{ attributes(select.attributes) }}>
      {% for option in select.options %}
        <option value="{{ option.value|lower|replace({' ':'-'}) }}" {{ attributes(option.attributes)}}>{{ option.text }}</option>
      {% endfor %}
    </select>
    {% include "@field-note" with select %}
    {% include "@notification" with select %}
  </div>
{% endif %}
 
{
  "select": {
    "name": "select",
    "label": "Label",
    "modifiers": [
      "home"
    ],
    "options": [
      {
        "text": "Select one",
        "value": "select-one"
      },
      {
        "text": "Option 1",
        "value": "option-1"
      },
      {
        "text": "Option 2",
        "value": "option-2"
      }
    ],
    "field_note": {
      "text": "This is a field note."
    },
    "attributes": {
      "disabled": true
    }
  }
}

Field label and field notes aren’t yet defined in the design system, but they are included here by default.