<commit_before>import {
  AfterViewInit,
  ChangeDetectionStrategy,
  ChangeDetectorRef,
  Component,
  ElementRef,
  EventEmitter,
  forwardRef,
  Input,
  NgZone,
  OnDestroy,
  OnInit,
  Output,
  Renderer2,
  ViewChild,
  ViewEncapsulation
  } from '@angular/core';
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
import {
  LyCoreStyles as LyCommonStyles,
  LyFocusState,
  LyTheme2,
  mixinDisableRipple,
  ThemeVariables,
  toBoolean,
  ThemeRef,
  lyl,
  StyleRenderer,
  LY_COMMON_STYLES,
  StyleCollection,
  LyClasses,
  StyleTemplate,
  Style,
  WithStyles
  } from '@alyle/ui';
import { Color } from '@alyle/ui/color';
import { Platform } from '@angular/cdk/platform';

const STYLE_PRIORITY = -2;
const DEFAULT_WITH_COLOR = 'accent';
const DEFAULT_DISABLE_RIPPLE = false;

export interface LyCheckboxTheme {
  /** Styles for Checkbox Component. */
  root?: StyleCollection<((classes: LyClasses<typeof STYLES>) => StyleTemplate)>
  | ((classes: LyClasses<typeof STYLES>) => StyleTemplate);
  /** Styles that apply when a color is set. */
  color?: (classes: LyClasses<typeof STYLES>, color: Color) => StyleTemplate;
}

export interface LyCheckboxVariables {
  checkbox?: LyCheckboxTheme;
}

export const STYLES = (theme: ThemeVariables & LyCheckboxVariables, ref: ThemeRef) => {
  const checkbox = ref.selectorsOf(STYLES);
  const { after } = theme;
  return {
    $name: LyCheckbox.и,
    $priority: STYLE_PRIORITY,
    root: ( ) => lyl `{
      display: inline-flex
      -webkit-tap-highlight-color: transparent
      &${checkbox.disabled}:not(${checkbox.checked}) ${checkbox.icon}:before {
        color: ${theme.disabled.default}
      }
      &${checkbox.disabled} {
        pointer-events: none
        ${checkbox.layout} {
          color: ${theme.text.secondary}
        }
      }
      &${checkbox.disabled}${checkbox.checked} ${checkbox.icon}:before {
        border: 0
        background: ${theme.disabled.default}
      }
      &${checkbox.onFocusByKeyboard} ${checkbox.icon}::after {
        box-shadow: 0 0 0 12px
        opacity: .13
        border-radius: 50%
      }
      &:not(${checkbox.checked}) ${checkbox.icon} {
        color: ${theme.text.secondary}
      }
      {
        ...${
          (theme.checkbox
            && theme.checkbox.root
            && (theme.checkbox.root instanceof StyleCollection
              ? theme.checkbox.root.setTransformer(fn => fn(checkbox))
              : theme.checkbox.root(checkbox))
          )
        }
      }
    }`,
    layout: () => lyl `{
      display: inline-flex
      align-items: baseline
      cursor: pointer
      user-select: none
      white-space: nowrap
      ${checkbox.label} {
        user-select: auto
      }
    }`,
    icon: lyl `{
      position: relative
      margin: auto
      margin-${after}: 8px
      width: 16px
      height: 16px
      user-select: none
      &::before, &::after {
        content: ''
        ...${LY_COMMON_STYLES.fill}
        width: 16px
        height: 16px
        margin: auto
        box-sizing: border-box
      }
      &::before {
        border: solid 2px
        border-radius: 2px
      }
      svg {
        position: absolute
        polyline {
          fill: none
          stroke: ${theme.background.primary.default}
          stroke-width: 2
          stroke-linecap: round
          stroke-linejoin: round<commit_msg>fix(): fix checkbox with text align right<commit_after>import {
  AfterViewInit,
  ChangeDetectionStrategy,
  ChangeDetectorRef,
  Component,
  ElementRef,
  EventEmitter,
  forwardRef,
  Input,
  NgZone,
  OnDestroy,
  OnInit,
  Output,
  Renderer2,
  ViewChild,
  ViewEncapsulation
  } from '@angular/core';
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
import {
  LyCoreStyles as LyCommonStyles,
  LyFocusState,
  LyTheme2,
  mixinDisableRipple,
  ThemeVariables,
  toBoolean,
  ThemeRef,
  lyl,
  StyleRenderer,
  LY_COMMON_STYLES,
  StyleCollection,
  LyClasses,
  StyleTemplate,
  Style,
  WithStyles
  } from '@alyle/ui';
import { Color } from '@alyle/ui/color';
import { Platform } from '@angular/cdk/platform';

const STYLE_PRIORITY = -2;
const DEFAULT_WITH_COLOR = 'accent';
const DEFAULT_DISABLE_RIPPLE = false;

export interface LyCheckboxTheme {
  /** Styles for Checkbox Component. */
  root?: StyleCollection<((classes: LyClasses<typeof STYLES>) => StyleTemplate)>
  | ((classes: LyClasses<typeof STYLES>) => StyleTemplate);
  /** Styles that apply when a color is set. */
  color?: (classes: LyClasses<typeof STYLES>, color: Color) => StyleTemplate;
}

export interface LyCheckboxVariables {
  checkbox?: LyCheckboxTheme;
}

export const STYLES = (theme: ThemeVariables & LyCheckboxVariables, ref: ThemeRef) => {
  const checkbox = ref.selectorsOf(STYLES);
  const { after } = theme;
  return {
    $name: LyCheckbox.и,
    $priority: STYLE_PRIORITY,
    root: ( ) => lyl `{
      display: inline-flex
      -webkit-tap-highlight-color: transparent
      &${checkbox.disabled}:not(${checkbox.checked}) ${checkbox.icon}:before {
        color: ${theme.disabled.default}
      }
      &${checkbox.disabled} {
        pointer-events: none
        ${checkbox.layout} {
          color: ${theme.text.secondary}
        }
      }
      &${checkbox.disabled}${checkbox.checked} ${checkbox.icon}:before {
        border: 0
        background: ${theme.disabled.default}
      }
      &${checkbox.onFocusByKeyboard} ${checkbox.icon}::after {
        box-shadow: 0 0 0 12px
        opacity: .13
        border-radius: 50%
      }
      &:not(${checkbox.checked}) ${checkbox.icon} {
        color: ${theme.text.secondary}
      }
      {
        ...${
          (theme.checkbox
            && theme.checkbox.root
            && (theme.checkbox.root instanceof StyleCollection
              ? theme.checkbox.root.setTransformer(fn => fn(checkbox))
              : theme.checkbox.root(checkbox))
          )
        }
      }
    }`,
    layout: () => lyl `{
      display: inline-flex
      align-items: baseline
      cursor: pointer
      user-select: none
      white-space: nowrap
      ${checkbox.label} {
        user-select: auto
      }
    }`,
    icon: lyl `{
      position: relative
      margin: auto
      margin-${after}: 8px
      width: 16px
      height: 16px
      user-select: none
      &::before, &::after {
        content: ''
        ...${LY_COMMON_STYLES.fill}
        width: 16px
        height: 16px
        margin: auto
        box-sizing: border-box
      }
      &::before {
        border: solid 2px
        border-radius: 2px
      }
      svg {
        position: absolute
        left: 0
        polyline {
          fill: none
          stroke: ${theme.background.primary.default}
          stroke-width: 2
          stroke-linecap: round
          stroke-linejoin: round
{'fraction_non_alphanumeric': 0.12155828939660222, 'fraction_numerical': 0.007469244288224956, 'mean_word_length': 2.3992035838725734, 'pattern_counts': {'":': 0, '<': 11, '<?xml version=': 0, '>': 25, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3600317', 'n_tokens_mistral': 2143, 'n_tokens_neox': 2088, 'n_words': 449}