@enact/limestone 1.10.0 → 1.10.2

package/FormCheckboxItem/FormCheckboxItem.module.css

@@ -3,7 +3,7 @@
 }
 .formCheckboxItem:global(.largeText) {
   font-size: var(--primitive-font-size-60);
-  line-height: 1.4em;
+  line-height: 1.34em;
 }
 :global(.enact-locale-km) .formCheckboxItem:global(.largeText) {
   line-height: 1.5em;

package/Heading/Heading.d.ts

@@ -1,7 +1,7 @@
 // Type definitions for limestone/Heading
 
-import { MarqueeDecoratorProps as limestone_Marquee_MarqueeDecoratorProps } from "limestone/Marquee";
-import { SkinnableProps as limestone_Skinnable_SkinnableProps } from "limestone/Skinnable";
+import { MarqueeDecoratorProps as limestone_Marquee_MarqueeDecoratorProps } from "@enact/limestone/Marquee";
+import { SkinnableProps as limestone_Skinnable_SkinnableProps } from "@enact/limestone/Skinnable";
 import * as React from "react";
 
 type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;

package/Heading/Heading.module.css

@@ -93,6 +93,10 @@
 :global(.enact-locale-vi) .heading.subtitle {
   font-size: 1rem;
 }
+.heading.subtitle:global(.largeText) {
+  font-size: 1.375rem;
+  line-height: 1.75rem;
+}
 .heading.large {
   font-family: "Limestone";
   font-weight: var(--primitive-font-weight-semibold);
@@ -136,6 +140,18 @@
   margin-bottom: 0;
   min-height: 0;
 }
+.heading:global(.largeText).large {
+  font-size: var(--primitive-font-size-86);
+}
+.heading:global(.largeText).medium {
+  font-size: var(--primitive-font-size-80);
+}
+.heading:global(.largeText).small {
+  font-size: var(--primitive-font-size-66);
+}
+.heading:global(.largeText).tiny {
+  font-size: var(--primitive-font-size-58);
+}
 .heading:global(.neutral) {
   color: var(--semantic-color-on-background-main);
 }

package/Icon/Icon.d.ts

@@ -1,6 +1,6 @@
 // Type definitions for limestone/Icon
 
-import { SkinnableProps as limestone_Skinnable_SkinnableProps } from "limestone/Skinnable";
+import { SkinnableProps as limestone_Skinnable_SkinnableProps } from "@enact/limestone/Skinnable";
 import { IconProps as ui_Icon_IconProps } from "@enact/ui/Icon";
 import * as React from "react";
 
@@ -366,6 +366,27 @@ filexls
 subtitleru
 f1
 mypageru
+smartmode
+databackup
+deleteviewinginfo
+lgmembers
+manage
+pay
+paymentmethod
+productregistration
+purchased
+rate
+report
+security
+subscriptions
+terminatemyaccount
+update
+usagecare
+voucher
+filter
+ezsetting
+fitness
+auracast2
 };
 ```
  */

package/Icon/Icon.js

@@ -513,6 +513,27 @@ var IconBase = exports.IconBase = (0, _kind["default"])({
  * subtitleru
  * f1
  * mypageru
+ * smartmode
+ * databackup
+ * deleteviewinginfo
+ * lgmembers
+ * manage
+ * pay
+ * paymentmethod
+ * productregistration
+ * purchased
+ * rate
+ * report
+ * security
+ * subscriptions
+ * terminatemyaccount
+ * update
+ * usagecare
+ * voucher
+ * filter
+ * ezsetting
+ * fitness
+ * auracast2
 };
  * ```
  *

package/Icon/Icon.module.css

@@ -24,6 +24,18 @@
 .icon.tiny {
   --icon-size: 1.25rem;
 }
+.icon:global(.largeText).large {
+  --icon-size: 2.1rem;
+}
+.icon:global(.largeText).medium {
+  --icon-size: 1.95rem;
+}
+.icon:global(.largeText).small {
+  --icon-size: 1.8rem;
+}
+.icon:global(.largeText).tiny {
+  --icon-size: 1.5rem;
+}
 .icon.dingbat {
   font-family: "LG Icons";
 }

package/Icon/IconList.js

@@ -633,5 +633,47 @@ var _default = exports["default"] = {
   // subtitleru
   f1: 0x0F01F8,
   // f1
-  mypageru: 0x0F01F7 // mypageru
+  mypageru: 0x0F01F7,
+  // mypageru
+  smartmode: 0x0F01FA,
+  // smartmode
+  databackup: 0x0F01FB,
+  // data_backup
+  deleteviewinginfo: 0x0F01FC,
+  // delete_viewing_info
+  lgmembers: 0x0F01FD,
+  // LG_Members
+  manage: 0x0F01FE,
+  // manage
+  pay: 0x0F01FF,
+  // pay
+  paymentmethod: 0x0F0200,
+  // payment_method
+  productregistration: 0x0F0201,
+  // product_registration
+  purchased: 0x0F0202,
+  // purchased
+  rate: 0x0F0203,
+  // rate
+  report: 0x0F0204,
+  // report
+  security: 0x0F0205,
+  // security
+  subscriptions: 0x0F0206,
+  // subscriptions
+  terminatemyaccount: 0x0F0207,
+  // terminate_my_account
+  update: 0x0F0208,
+  // update
+  usagecare: 0x0F0209,
+  // usage_care
+  voucher: 0x0F020A,
+  // voucher
+  filter: 0x0F020B,
+  // filter
+  ezsetting: 0x0F020C,
+  // ez_setting
+  fitness: 0x0F020D,
+  // Fitness
+  auracast2: 0x0F020E // Auracast
 };

package/IconItem/IconItem.d.ts

@@ -1,8 +1,8 @@
 // Type definitions for limestone/IconItem
 
-import { MarqueeControllerProps as limestone_Marquee_MarqueeControllerProps } from "limestone/Marquee";
+import { MarqueeControllerProps as limestone_Marquee_MarqueeControllerProps } from "@enact/limestone/Marquee";
 import { SpottableProps as spotlight_Spottable_SpottableProps } from "@enact/spotlight/Spottable";
-import { SkinnableProps as limestone_Skinnable_SkinnableProps } from "limestone/Skinnable";
+import { SkinnableProps as limestone_Skinnable_SkinnableProps } from "@enact/limestone/Skinnable";
 import * as React from "react";
 
 type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;

package/IconItem/IconItem.module.css

@@ -34,8 +34,8 @@ Animations properties
   --lime-bounce-motion-easing-function: var(--lime-default-motion-easing-function);
   --lime-focus-in-motion-easing-function: var(--lime-EIO-motion-easing-function);
   --lime-focus-out-motion-easing-function: var(--lime-EO-motion-easing-function);
-  --lime-press-motion-easing-function: var(--lime-EIO-motion-easing-function);
-  --lime-release-motion-easing-function: var(--lime-EO-motion-easing-function);
+  --lime-press-motion-easing-function: var(--lime-EO-motion-easing-function);
+  --lime-release-motion-easing-function: var(--lime-EIO-motion-easing-function);
   /* ---------------------------------------
 	Keyframes names
 	------------------------------------------ */
@@ -76,9 +76,6 @@ Keyframes
   }
 }
 /* ---------------------------------------
-Motion Variables
------------------------------------------- */
-/* ---------------------------------------
 Motion Mixins
 ------------------------------------------ */
 .iconItem {
@@ -139,7 +136,7 @@ Motion Mixins
 }
 :global(.spotlight-input-key) .iconItem:global(.spottable):focus,
 :global(.spotlight-input-mouse) .iconItem:global(.spottable):focus {
-  transform: scale(1.1);
+  transform: scale(1.2);
   transition: transform var(--lime-focus-in-motion-duration) var(--lime-focus-in-motion-easing-function);
 }
 :global(.spotlight-input-key) .iconItem:global(.spottable):focus.labelOnFocus .label,
@@ -153,7 +150,7 @@ Motion Mixins
   visibility: visible;
 }
 :global(.spotlight-input-touch) .iconItem:global(.spottable):active {
-  transform: scale(1.1);
+  transform: scale(1.2);
   transition: transform var(--lime-focus-in-motion-duration) var(--lime-focus-in-motion-easing-function);
 }
 :global(.spotlight-input-touch) .iconItem:global(.spottable):active.labelOnFocus .label,
@@ -167,26 +164,42 @@ Motion Mixins
 :global(.spotlight-input-mouse) .iconItem:not([disabled]):global(.spottable):focus.pressed,
 :global(.spotlight-input-key) .iconItem:not([disabled]):global(.spottable):focus:active,
 :global(.spotlight-input-mouse) .iconItem:not([disabled]):global(.spottable):focus:active {
-  transform: scale(1.05);
+  transform: scale(1.1);
   transition: transform var(--lime-press-motion-duration) var(--lime-press-motion-easing-function);
 }
-:global(.spotlight-input-key) .iconItem:not([disabled]):global(.spottable):focus:not(:pressed),
-:global(.spotlight-input-mouse) .iconItem:not([disabled]):global(.spottable):focus:not(:pressed) {
-  transform: scale(1.1);
+:global(.spotlight-input-key) .iconItem:not([disabled]):global(.spottable):focus:not(.pressed),
+:global(.spotlight-input-mouse) .iconItem:not([disabled]):global(.spottable):focus:not(.pressed) {
+  transform: scale(1.2);
   transition: transform var(--lime-release-motion-duration) var(--lime-release-motion-easing-function);
 }
 :global(.spotlight-input-touch) .iconItem:not([disabled]):global(.spottable):active.pressed,
 :global(.spotlight-input-touch) .iconItem:not([disabled]):global(.spottable):active:active {
-  transform: scale(1.05);
+  transform: scale(1.1);
   transition: transform var(--lime-press-motion-duration) var(--lime-press-motion-easing-function);
 }
-:global(.spotlight-input-touch) .iconItem:not([disabled]):global(.spottable):active:not(:pressed) {
-  transform: scale(1.1);
+:global(.spotlight-input-touch) .iconItem:not([disabled]):global(.spottable):active:not(.pressed) {
+  transform: scale(1.2);
   transition: transform var(--lime-release-motion-duration) var(--lime-release-motion-easing-function);
 }
 :global(.noAnimation) .iconItem {
   transition: none;
 }
+.iconItem:global(.largeText).hasTitle {
+  height: calc( 5.33333rem + 1.45833rem + 24px);
+}
+.iconItem:global(.largeText) .icon {
+  height: 3.04167rem;
+  width: 3.04167rem;
+  line-height: 3.04167rem;
+}
+.iconItem:global(.largeText) .label {
+  font-size: var(--primitive-font-size-50);
+  line-height: 1.33333rem;
+}
+.iconItem:global(.largeText) .title {
+  font-size: var(--primitive-font-size-58);
+  line-height: 1.45833rem;
+}
 .iconItem:global(.neutral).bordered .content {
   border-color: var(--semantic-color-stroke-white);
 }

package/Image/Image.d.ts

@@ -1,6 +1,6 @@
 // Type definitions for limestone/Image
 
-import { SkinnableProps as limestone_Skinnable_SkinnableProps } from "limestone/Skinnable";
+import { SkinnableProps as limestone_Skinnable_SkinnableProps } from "@enact/limestone/Skinnable";
 import { ImageProps as ui_Image_ImageProps } from "@enact/ui/Image";
 import * as React from "react";
 

package/Image/Image.module.css

@@ -1,5 +1,5 @@
 .image {
-  margin: 0 1rem;
   width: 15rem;
   height: 10rem;
+  margin: 0 1rem;
 }

package/ImageItem/ImageItem.d.ts

@@ -1,8 +1,8 @@
 // Type definitions for limestone/ImageItem
 
-import { MarqueeControllerProps as limestone_Marquee_MarqueeControllerProps } from "limestone/Marquee";
+import { MarqueeControllerProps as limestone_Marquee_MarqueeControllerProps } from "@enact/limestone/Marquee";
 import { SpottableProps as spotlight_Spottable_SpottableProps } from "@enact/spotlight/Spottable";
-import { SkinnableProps as limestone_Skinnable_SkinnableProps } from "limestone/Skinnable";
+import { SkinnableProps as limestone_Skinnable_SkinnableProps } from "@enact/limestone/Skinnable";
 import { ImageItemProps as ui_ImageItem_ImageItemProps } from "@enact/ui/ImageItem";
 import * as React from "react";
 

package/ImageItem/ImageItem.js

@@ -12,7 +12,6 @@ var _Layout = require("@enact/ui/Layout");
 var _propTypes2 = _interopRequireDefault(require("prop-types"));
 var _compose = _interopRequireDefault(require("ramda/src/compose"));
 var _$L = _interopRequireDefault(require("../internal/$L"));
-var _Checkbox = require("../Checkbox");
 var _Icon = _interopRequireDefault(require("../Icon"));
 var _Image = _interopRequireDefault(require("../Image"));
 var _AsyncRenderChildren = _interopRequireDefault(require("../internal/AsyncRenderChildren"));
@@ -44,8 +43,6 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
  * @exports ImageItemBase
  * @exports ImageItemDecorator
  */
-var Checkbox = (0, _Skinnable["default"])(_Checkbox.CheckboxBase);
-Checkbox.displayName = 'Checkbox';
 var defaultPlaceholder = 'data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC' + '9zdmciPjxyZWN0IHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHN0cm9rZT0iIzU1NSIgZmlsbD0iI2FhYSIg' + 'ZmlsbC1vcGFjaXR5PSIwLjIiIHN0cm9rZS1vcGFjaXR5PSIwLjgiIHN0cm9rZS13aWR0aD0iNiIgLz48L3N2Zz' + '4NCg==';
 
 /**
@@ -294,22 +291,14 @@ var ImageItemBase = exports.ImageItemBase = (0, _kind["default"])({
     },
     selectionComponent: function selectionComponent(_ref4) {
       var css = _ref4.css,
-        orientation = _ref4.orientation,
-        selected = _ref4.selected,
         SelectionComponent = _ref4.selectionComponent;
       if (SelectionComponent) {
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(SelectionComponent, {});
-      } else if (orientation === 'vertical') {
+      } else {
         return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon["default"], {
           className: css.selectionIcon,
           children: "checkmark"
         });
-      } else {
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(Checkbox, {
-          className: css.selectionIcon,
-          selected: selected,
-          size: "tiny"
-        });
       }
     }
   },
@@ -320,7 +309,6 @@ var ImageItemBase = exports.ImageItemBase = (0, _kind["default"])({
       SelectionComponent = _ref5.selectionComponent,
       showSelection = _ref5.showSelection,
       rest = _objectWithoutProperties(_ref5, _excluded);
-    var isSlotBefore = orientation === 'horizontal' && showSelection;
     delete rest.centered;
     delete rest.imageIconComponent;
     delete rest.imageIconSrc;
@@ -332,12 +320,11 @@ var ImageItemBase = exports.ImageItemBase = (0, _kind["default"])({
       disabled: disabled,
       orientation: orientation,
       imageComponent: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Image["default"], {
-        children: orientation === 'vertical' && showSelection ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        children: showSelection ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
           className: css.selectionContainer,
           children: SelectionComponent
         }) : null
-      }),
-      slotBefore: isSlotBefore && SelectionComponent
+      })
     }));
   }
 });