@team_yumi/ramen 0.4.0-next.20231122-6c23a89-c587da26d90e05e962417adff5551535 → 0.4.0-next.20231123-b5f5bca-2ffdba989b40213ee2c85fa43e56dd4f

package/components/core/xbox/root.d.ts

@@ -47,6 +47,8 @@ export interface IProps {
      */
     touchable?: boolean;
     flexWrap?: boolean;
+    backgroundThone?: (typeof Collections.IBackgroundThone)[number];
+    borderRadius?: (typeof Collections.IRounded)[number];
 }
 declare const XBox: React.FC<IProps>;
 export default XBox;

package/components/core/xcard/root.d.ts

@@ -11,6 +11,8 @@ export interface IProps {
     children?: React.ReactNode;
     disabled?: boolean;
     state?: (typeof Collections.ICardState)[number];
+    borderColor?: (typeof Collections.IBorderColor)[number];
+    borderSize?: (typeof Collections.IBorderSize)[number];
 }
 declare const XCard: React.FC<IProps>;
 export default XCard;

package/css/size.css

@@ -127,11 +127,15 @@
   --ximage-border-radius-xl: calc(6 * var(--grid));
   --ximage-border-radius-xxl: calc(10 * var(--grid));
 
+  --xcard-border-s: calc(0.5 * var(--grid));
+  --xcard-border-m: calc(0.625 * var(--grid));
+
   /**
   * @tokens-end
   */
   --xswitch-border-radius: calc(125 * var(--grid));
   --xswitch-opacity-disabled: 0.5;
+
 }
 
 

package/index.css

@@ -395,6 +395,63 @@
   display: none;
 }
 
+
+
+.root-module_background_thone-darkest__i0opu {
+  background-color: var(--color-neutral-dark);
+}
+
+.root-module_background_thone-medium__ejgph {
+  background-color: var(--color-neutral-medium);
+}
+
+.root-module_background_thone-dim__K4Lpo {
+  background-color: var(--color-neutral-dim);
+}
+
+.root-module_background_thone-lightest__OR6x6 {
+  background-color: var(--color-neutral-lightest);
+}
+
+.root-module_background_thone-light__jm4XX {
+  background-color: var(--color-neutral-light);
+}
+
+.root-module_background_thone-dark__-b8s0 {
+  background-color: var(--color-neutral-dark);
+}
+
+.root-module_border_radius-xxs__fG-b3{
+  border-radius: var(--xbox-border-small);
+}
+
+.root-module_border_radius-xs__6rvkQ{
+  border-radius: var(--xbox-rounding-default);
+}
+
+.root-module_border_radius-s__HnVwV{
+  border-radius: var(--xbox-rounding-s);
+}
+
+.root-module_border_radius-m__Cz-lB{
+  border-radius: var(--xbox-rounding-m);
+}
+
+.root-module_border_radius-l__PB9Hh{
+  border-radius: var(--xbox-rounding-l);
+}
+
+.root-module_border_radius-xl__rGaRy{
+  border-radius: var(--xbox-rounding-xl);
+}
+
+.root-module_border_radius-full__HuBVW{
+  border-radius: var(--xbox-rounding-circle);
+}
+
+
+
+
 .root-module_xtext__IcpGn {
   font-style: normal;
   font-family: var(--xtext-font);
@@ -491,7 +548,7 @@
 }
 
 .root-module_color_thone-darkest__N4Y2j {
-  color: var(--color-neutral-dark);
+  color: var(--color-neutral-darkest);
 }
 
 .root-module_color_thone-medium__c9n9Q {
@@ -506,6 +563,14 @@
   color: var(--color-neutral-lightest);
 }
 
+.root-module_color_thone-dark__AvNli {
+  color: var(--color-neutral-dark);
+}
+
+.root-module_color_thone-light__-WCRG {
+  color: var(--color-neutral-light);
+}
+
 .root-module_x-icon__YwX20 {
   display: inline-block;
   box-sizing: content-box;
@@ -2453,6 +2518,76 @@
   background: var(--color-neutral-dim);
   color: var(--color-neutral-lightest);
 }
+
+
+
+/* colors */
+.root-module_xcard--border_color-gray__e7u5J  {
+  border-color: var(--color-neutral-light);
+}
+
+.root-module_xcard--border_color-black__PXliS {
+  border-color: var(--color-neutral-darkest);
+}
+
+/* color green */
+.root-module_xcard--border_color-green__TYfzS {
+  border-color: var(--xcard-border-color-green);
+}
+
+/* color sky blue */
+.root-module_xcard--border_color-sky-blue__7wJbp  {
+  border-color: var(--xcard-border-color-sky-blue);
+}
+
+/* color orange */
+.root-module_xcard--border_color-orange__EaFXm  {
+  border-color: var(--xcard-border-color-orange);
+}
+
+/* color red */
+.root-module_xcard--border_color-red__2m7pq {
+  border-color: var(--xcard-border-color-red);
+}
+
+/* color purple */
+.root-module_xcard--border_color-purple__0b6UK {
+  border-color: var(--xcard-border-color-purple);
+}
+
+/* color pink */
+.root-module_xcard--border_color-pink__6DgQ1 {
+  border-color: var(--xcard-border-color-pink);
+}
+
+/* color green check */
+.root-module_xcard--border_color-green-check__mubdu {
+  border-color: var(--xcard-border-color-green-check);
+}
+
+/* color red refuse */
+.root-module_xcard--border_color-red-refuse__58lPg  {
+  border-color: var(--xcard-border-color-red-refuse);
+}
+
+/* color yellow */
+.root-module_xcard--border_color-yellow__VmDVk  {
+  border-color: var(--xcard-border-color-yellow);
+}
+
+/* color yellow */
+.root-module_xcard--border_color-turquoise__09D0Q  {
+  border-color: var(--xcard-border-color-turquoise);
+}
+
+.root-module_xcard--border_size-s__4nvom  {
+  border-width: var(--xcard-border-s);
+}
+
+.root-module_xcard--border_size-m__xRDVk  {
+  border-width: var(--xcard-border-m);
+}
+
 .root-module_xsymbol__gr72p {
   display: inline-block;
   max-height: var(--xicon-size-xl);