How to use the @carbon/icons/lib/warning--filled/16 function in @carbon/icons

To help you get started, we’ve selected a few @carbon/icons examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github carbon-design-system / carbon-custom-elements / src / components / number-input / number-input.ts View on Github external
render() {
    const { _handleInput: handleInput } = this;

    const invalidIcon = WarningFilled16({ class: `${prefix}--number__invalid` });

    const wrapperClasses = classMap({
      [`${prefix}--number`]: true,
      [`${prefix}--number--light`]: this.light,
      [`${prefix}--number--mobile`]: this.mobile,
    });

    const labelClasses = classMap({
      [`${prefix}--label`]: true,
      [`${prefix}--label--disabled`]: this.disabled,
    });

    const helperTextClasses = classMap({
      [`${prefix}--form__helper-text`]: true,
      [`${prefix}--form__helper-text--disabled`]: this.disabled,
    });
github carbon-design-system / carbon-custom-elements / src / components / textarea / textarea.ts View on Github external
render() {
    const invalidIcon = WarningFilled16({ class: `${prefix}--text-area__invalid-icon` });

    const textareaClasses = classMap({
      [`${prefix}--text-area`]: true,
      [`${prefix}--text-area--v2`]: true,
      [`${prefix}--text-area--invalid`]: this.invalid,
    });

    const labelClasses = classMap({
      [`${prefix}--label`]: true,
      [`${prefix}--label--disabled`]: this.disabled,
    });

    const helperTextClasses = classMap({
      [`${prefix}--form__helper-text`]: true,
      [`${prefix}--form__helper-text--disabled`]: this.disabled,
    });
github carbon-design-system / carbon-custom-elements / src / components / dropdown / dropdown.ts View on Github external
});
    const iconContainerClasses = classMap({
      [`${prefix}--list-box__menu-icon`]: true,
      [`${prefix}--list-box__menu-icon--open`]: open,
    });
    const toggleLabel = (open ? toggleLabelOpen : toggleLabelClosed) || undefined;
    const hasHelperText = helperText || (slotHelperTextNode && slotHelperTextNode.assignedNodes().length > 0);
    const hasLabelText = labelText || (slotLabelTextNode && slotLabelTextNode.assignedNodes().length > 0);
    const validity = !invalid
      ? undefined
      : html`
          <div class="${`${prefix}--form-requirement`}">${validityMessage}</div>
        `;
    const validityIcon = !invalid
      ? undefined
      : WarningFilled16({ class: `${prefix}--list-box__invalid-icon`, 'aria-label': toggleLabel });
    const menuBody = !open
      ? undefined
      : html`
          <div tabindex="-1" role="listbox" class="${prefix}--list-box__menu" id="menu-body">
            
          </div>
        `;
    return html`
      <label class="${labelClasses}">
        ${labelText}
      </label>
      <div class="${helperClasses}">
        ${helperText}
      </div>
      <div class="${classes}" role="listbox">
        ${validityIcon}</div>
github carbon-design-system / carbon-custom-elements / src / components / input / input.ts View on Github external
render() {
    const { _handleInput: handleInput } = this;

    const invalidIcon = WarningFilled16({ class: `${prefix}--text-input__invalid-icon` });

    const inputClasses = classMap({
      [`${prefix}--text-input`]: true,
      [`${prefix}--text-input--invalid`]: this.invalid,
    });

    const labelClasses = classMap({
      [`${prefix}--label`]: true,
      [`${prefix}--label--disabled`]: this.disabled,
    });

    const helperTextClasses = classMap({
      [`${prefix}--form__helper-text`]: true,
      [`${prefix}--form__helper-text--disabled`]: this.disabled,
    });