@taiga-ui/kit 4.7.0 → 4.8.1-canary.0ecc12f

package/styles/components/chip.less

@@ -64,7 +64,7 @@ tui-chip,
 
     &[data-size='xs'] {
         --t-padding: 0 0.375rem;
-        --t-size: 1.25rem;
+        --t-size: var(--tui-height-xs);
 
         border-radius: var(--tui-radius-xs);
 

package/styles/components/like.less

@@ -0,0 +1,69 @@
+@import '@taiga-ui/core/styles/taiga-ui-local';
+
+/**
+ * @name Like
+ * @selector [tuiLike]
+ *
+ * @description
+ * A stylized input type="checkbox"
+ *
+ * @attributes
+ * data-size — size (default: 'm') ('s' | 'm')
+ *
+ * @vars
+ * --t-icon-color - custom color for `:checked` state
+ * --t-unchecked-icon — default state icon
+ * --t-checked-icon — checkmark icon
+ *
+ * @example
+ * <input tuiLike />
+ *
+ * @see-also
+ * Checkbox, Switch, Radio, Appearance
+ */
+[tuiLike] {
+    --t-size: var(--tui-height-m);
+    --t-border-width: 0.75rem;
+
+    inline-size: var(--t-size);
+    block-size: var(--t-size);
+    border: var(--t-border-width) transparent solid;
+    border-radius: 100%;
+    cursor: pointer;
+    margin: 0;
+    flex-shrink: 0;
+
+    &::before,
+    &::after {
+        .fullsize();
+        .transition(~'transform, opacity');
+
+        content: '';
+        background: currentColor;
+        mask: var(--t-unchecked-icon) no-repeat center/contain;
+    }
+
+    &::after {
+        mask-image: var(--t-checked-icon);
+        opacity: 0;
+        color: var(--t-icon-color, inherit);
+        transform: scale(0);
+    }
+
+    &:checked {
+        &::before {
+            opacity: 0;
+        }
+
+        &::after {
+            opacity: 1;
+            transform: scale(1);
+            transition-timing-function: cubic-bezier(0.2, 0.6, 0.5, 1.8), ease-in-out;
+        }
+    }
+
+    &[data-size='s'] {
+        --t-size: var(--tui-height-s);
+        --t-border-width: 0.5rem;
+    }
+}

package/tokens/calendar-date-stream.d.ts

@@ -1,5 +1,4 @@
-import type { Provider } from '@angular/core';
-import { InjectionToken } from '@angular/core';
+import type { InjectionToken, Provider } from '@angular/core';
 import type { TuiValueTransformer } from '@taiga-ui/cdk/classes';
 import type { TuiDay, TuiDayRange } from '@taiga-ui/cdk/date-time';
 import type { Observable } from 'rxjs';

package/tokens/date-inputs-value-transformers.d.ts

@@ -1,19 +1,18 @@
-import { InjectionToken } from '@angular/core';
 import type { TuiValueTransformer } from '@taiga-ui/cdk/classes';
 import type { TuiDay, TuiDayRange, TuiTime } from '@taiga-ui/cdk/date-time';
 /**
  * Control value transformer of TuiDay to custom value format for InputDate* components
  */
-export declare const TUI_DATE_VALUE_TRANSFORMER: InjectionToken<TuiValueTransformer<TuiDay | null, unknown>>;
+export declare const TUI_DATE_VALUE_TRANSFORMER: import("@angular/core").InjectionToken<TuiValueTransformer<TuiDay | null, unknown>>;
 /**
  * Control value transformer for InputDateRange component
  */
-export declare const TUI_DATE_RANGE_VALUE_TRANSFORMER: InjectionToken<TuiValueTransformer<TuiDayRange | null, unknown>>;
+export declare const TUI_DATE_RANGE_VALUE_TRANSFORMER: import("@angular/core").InjectionToken<TuiValueTransformer<TuiDayRange | null, unknown>>;
 /**
  * Control value transformer for InputDateTime component
  */
-export declare const TUI_DATE_TIME_VALUE_TRANSFORMER: InjectionToken<TuiValueTransformer<[TuiDay | null, TuiTime | null], unknown>>;
+export declare const TUI_DATE_TIME_VALUE_TRANSFORMER: import("@angular/core").InjectionToken<TuiValueTransformer<[TuiDay | null, TuiTime | null], unknown>>;
 /**
  * Control value transformer for InputTime component
  */
-export declare const TUI_TIME_VALUE_TRANSFORMER: InjectionToken<TuiValueTransformer<TuiTime | null, unknown>>;
+export declare const TUI_TIME_VALUE_TRANSFORMER: import("@angular/core").InjectionToken<TuiValueTransformer<TuiTime | null, unknown>>;

package/tokens/mobile-calendar.d.ts

@@ -1,7 +1,6 @@
 import type { FactoryProvider, Type } from '@angular/core';
-import { InjectionToken } from '@angular/core';
 /**
  * A component for mobile data picker
  */
-export declare const TUI_MOBILE_CALENDAR: InjectionToken<Type<unknown>>;
+export declare const TUI_MOBILE_CALENDAR: import("@angular/core").InjectionToken<Type<unknown>>;
 export declare const TUI_MOBILE_CALENDAR_PROVIDER: FactoryProvider;