Merge pull request #1253 from kufu/update-smarthr-ui-55.0.0

smarthr-ui の更新v54.1.0→v55.0.0

content/articles/products/components/stepper.mdx

@@ -0,0 +1,16 @@
+---
+title: 'Stepper'
+description: ''
+---
+
+import { ComponentPropsTable } from '@Components/ComponentPropsTable'
+import { ComponentStory } from '@Components/ComponentStory'
+
+
+<ComponentStory name="Stepper" />
+
+## Props
+
+<ComponentPropsTable name="Stepper" />
+
+

content/articles/products/components/time-picker .mdx

@@ -0,0 +1,16 @@
+---
+title: 'TimePicker '
+description: ''
+---
+
+import { ComponentPropsTable } from '@Components/ComponentPropsTable'
+import { ComponentStory } from '@Components/ComponentStory'
+
+
+<ComponentStory name="TimePicker" />
+
+## Props
+
+<ComponentPropsTable name="TimePicker" />
+
+

package.json

@@ -61,7 +61,7 @@
  "react-instantsearch-dom": "^6.40.4",
  "react-live": "^4.1.5",
  "react-string-replace": "^1.1.1",
- "smarthr-ui": "^54.1.0",
+ "smarthr-ui": "^55.0.0",
  "styled-components": "^5.3.11"
  },
  "devDependencies": {

static/smarthr-ui.css

@@ -225,6 +225,10 @@ a {
  left: -100%
 }
 
+.-shr-top-0\.25 {
+ top: -4px
+}
+
 .-shr-top-px {
  top: -1px
 }
@@ -297,6 +301,10 @@ a {
  left: 8px
 }
 
+.shr-left-1\.5 {
+ left: 24px
+}
+
 .shr-left-1\/2 {
  left: 50%
 }
@@ -529,6 +537,10 @@ a {
  margin-inline-start: 8px
 }
 
+.shr-ms-1 {
+ margin-inline-start: 16px
+}
+
 .shr-ms-\[initial\] {
  margin-inline-start: initial
 }
@@ -645,10 +657,18 @@ a {
  height: 1.75rem
 }
 
+.shr-h-\[2em\] {
+ height: 2em
+}
+
 .shr-h-\[calc\(1em_\*_theme\(lineHeight\.normal\)\)\] {
  height: calc(1em * 1.5)
 }
 
+.shr-h-\[theme\(borderWidth\.2\)\] {
+ height: 2px
+}
+
 .shr-h-\[theme\(fontSize\.2xs\)\] {
  height: 0.6666666666666666rem
 }
@@ -738,6 +758,10 @@ a {
  width: 200%
 }
 
+.shr-w-\[2em\] {
+ width: 2em
+}
+
 .shr-w-\[calc\(theme\(fontSize\.base\)\*2\)\] {
  width: calc(1rem * 2)
 }
@@ -1237,10 +1261,6 @@ a {
  cursor: revert
 }
 
-.shr-cursor-auto {
- cursor: auto
-}
-
 .shr-cursor-move {
  cursor: move
 }
@@ -1941,6 +1961,11 @@ a {
  border-color: rgb(214 211 208 / 0.5)
 }
 
+.shr-border-grey {
+ --tw-border-opacity: 1;
+ border-color: rgb(112 109 101 / var(--tw-border-opacity))
+}
+
 .shr-border-grey-20 {
  --tw-border-opacity: 1;
  border-color: rgb(214 211 208 / var(--tw-border-opacity))
@@ -2030,6 +2055,11 @@ a {
  background-color: rgb(245 244 243 / var(--tw-bg-opacity))
 }
 
+.shr-bg-border {
+ --tw-bg-opacity: 1;
+ background-color: rgb(214 211 208 / var(--tw-bg-opacity))
+}
+
 .shr-bg-brand {
  --tw-bg-opacity: 1;
  background-color: rgb(0 196 204 / var(--tw-bg-opacity))
@@ -2352,6 +2382,10 @@ a {
  padding-bottom: 16px
 }
 
+.shr-pb-1\.5 {
+ padding-bottom: 24px
+}
+
 .shr-pe-1 {
  padding-inline-end: 16px
 }
@@ -2360,6 +2394,10 @@ a {
  padding-inline-end: 32px
 }
 
+.shr-ps-0 {
+ padding-inline-start: 0
+}
+
 .shr-ps-0\.5 {
  padding-inline-start: 8px
 }
@@ -2384,6 +2422,10 @@ a {
  padding-top: 4px
 }
 
+.shr-pt-0\.5 {
+ padding-top: 8px
+}
+
 .shr-pt-1 {
  padding-top: 16px
 }
@@ -2553,6 +2595,12 @@ a {
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
 }
 
+.shr-shadow-\[0_0_0_theme\(borderWidth\.2\)_theme\(colors\.white\)\] {
+ --tw-shadow: 0 0 0 2px #fff;
+ --tw-shadow-colored: 0 0 0 var(--tw-shadow-color);
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
+}
+
 .shr-shadow-layer-0 {
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
@@ -2829,6 +2877,11 @@ a {
  position: absolute
 }
 
+.before\:shr-relative::before {
+ content: var(--tw-content);
+ position: relative
+}
+
 .before\:shr-inset-x-0::before {
  content: var(--tw-content);
  left: 0;
@@ -2912,6 +2965,12 @@ a {
  z-index: 1
 }
 
+.before\:shr-mx-1::before {
+ content: var(--tw-content);
+ margin-left: 16px;
+ margin-right: 16px
+}
+
 .before\:shr-box-border::before {
  content: var(--tw-content);
  box-sizing: border-box
@@ -2973,6 +3032,11 @@ a {
  width: calc(1em * 1.5)
 }
 
+.before\:shr-w-\[theme\(borderWidth\.2\)\]::before {
+ content: var(--tw-content);
+ width: 2px
+}
+
 .before\:-shr-translate-x-\[5px\]::before {
  content: var(--tw-content);
  --tw-translate-x: -5px;
@@ -3039,6 +3103,12 @@ a {
  background-color: rgb(214 211 208 / var(--tw-bg-opacity))
 }
 
+.before\:shr-bg-border::before {
+ content: var(--tw-content);
+ --tw-bg-opacity: 1;
+ background-color: rgb(214 211 208 / var(--tw-bg-opacity))
+}
+
 .before\:shr-bg-main::before {
  content: var(--tw-content);
  --tw-bg-opacity: 1;
@@ -3600,6 +3670,19 @@ a {
  color: rgb(193 189 183 / var(--tw-text-opacity))
 }
 
+.shr-group\/stepItem:first-child .group-first\/stepItem\:shr-bg-transparent {
+ background-color: transparent
+}
+
+.shr-group\/stepItem:last-child .group-last\/stepItem\:shr-bg-transparent {
+ background-color: transparent
+}
+
+.shr-group\/stepItem:last-child .group-last\/stepItem\:before\:shr-bg-transparent::before {
+ content: var(--tw-content);
+ background-color: transparent
+}
+
 .shr-group:hover .group-hover\:shr-bg-base-grey {
  --tw-bg-opacity: 1;
  background-color: rgb(245 244 243 / var(--tw-bg-opacity))
@@ -4116,10 +4199,46 @@ a {
  border-color: ButtonBorder
  }
 
+ .forced-colors\:shr-border-\[Mark\] {
+ border-color: Mark
+ }
+
+ .forced-colors\:shr-bg-\[ButtonBorder\] {
+ background-color: ButtonBorder
+ }
+
+ .forced-colors\:shr-bg-\[CanvasText\] {
+ background-color: CanvasText
+ }
+
+ .forced-colors\:shr-bg-\[Canvas\] {
+ background-color: Canvas
+ }
+
+ .forced-colors\:shr-bg-\[Highlight\] {
+ background-color: Highlight
+ }
+
+ .forced-colors\:shr-bg-\[Mark\] {
+ background-color: Mark
+ }
+
  .forced-colors\:shr-fill-\[CanvasText\] {
  fill: CanvasText
  }
 
+ .forced-colors\:shr-fill-\[Canvas\] {
+ fill: Canvas
+ }
+
+ .forced-colors\:shr-fill-\[GrayText\] {
+ fill: GrayText
+ }
+
+ .forced-colors\:shr-fill-\[Highlight\] {
+ fill: Highlight
+ }
+
  .forced-colors\:shr-underline {
  text-decoration-line: underline
  }
@@ -4128,12 +4247,28 @@ a {
  opacity: 1
  }
 
+ .forced-colors\:shr-shadow-\[0_0_0_theme\(borderWidth\.2\)_Canvas\] {
+ --tw-shadow: 0 0 0 2px Canvas;
+ --tw-shadow-colored: 0 0 0 var(--tw-shadow-color);
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
+ }
+
  .forced-colors\:shr-shadow-none {
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
  }
 
+ .forced-colors\:before\:shr-bg-\[ButtonBorder\]::before {
+ content: var(--tw-content);
+ background-color: ButtonBorder
+ }
+
+ .forced-colors\:before\:shr-bg-\[Highlight\]::before {
+ content: var(--tw-content);
+ background-color: Highlight
+ }
+
  .forced-colors\:has-\[\:disabled\]\:shr-border-\[GrayText\]:has(:disabled) {
  border-color: GrayText
  }
@@ -4243,10 +4378,6 @@ a {
  margin-top: 128px
 }
 
-.\[\&\&\&\]\:shr-cursor-pointer.\[\&\&\&\]\:shr-cursor-pointer.\[\&\&\&\]\:shr-cursor-pointer {
- cursor: pointer
-}
-
 .\[\&\&\&\]\:shr-overflow-y-visible.\[\&\&\&\]\:shr-overflow-y-visible.\[\&\&\&\]\:shr-overflow-y-visible {
  overflow-y: visible
 }
@@ -4598,10 +4729,6 @@ a {
  display: block
 }
 
-.\[\&\]\:shr-items-center {
- align-items: center
-}
-
 .\[\&\]\:shr-justify-start {
  justify-content: flex-start
 }

yarn.lock

@@ -13466,10 +13466,10 @@ smarthr-normalize-css@^1.1.0:
  dependencies:
  styled-reset "^4.4.2"
 
-smarthr-ui@^54.1.0:
- version "54.1.0"
- resolved "https://registry.yarnpkg.com/smarthr-ui/-/smarthr-ui-54.1.0.tgz#182611cc286388dc17045094d181c439645d8d2d"
- integrity sha512-pJ+RyQSPCuraRJTiE8J+WVehKvUtCqL1lcIw9fkc/u28BwuO7CG3Nx3/TcZBRBH+JhTmwlicOUfupoWxQo7Quw==
+smarthr-ui@^55.0.0:
+ version "55.0.0"
+ resolved "https://registry.yarnpkg.com/smarthr-ui/-/smarthr-ui-55.0.0.tgz#f38ed6fc13f2ba26d90e5d770a2e575529b27dbd"
+ integrity sha512-w2PYA2nVtPQyIG2bheOn8LvI38ZL2ysfKckedWo9HP7HUI2dr9ShI1/vo+g1cmrHk26vP12EvmylvBoScmS8cg==
  dependencies:
  "@smarthr/wareki" "^1.2.0"
  css-loader "^7.1.2"