From 3d54a65245867a85785daa2aa92bb2ed8b037738 Mon Sep 17 00:00:00 2001 From: TetsuhiroSato Date: Fri, 9 Aug 2024 13:26:37 +0900 Subject: [PATCH 1/2] update --- package.json | 2 +- static/smarthr-ui.css | 151 ++++++++++++++++++++++++++++++++++++++---- yarn.lock | 8 +-- 3 files changed, 144 insertions(+), 17 deletions(-) diff --git a/package.json b/package.json index ac03df01e..b31aedd20 100644 --- a/package.json +++ b/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": { diff --git a/static/smarthr-ui.css b/static/smarthr-ui.css index 54f88c80e..1117daa8b 100644 --- a/static/smarthr-ui.css +++ b/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 } diff --git a/yarn.lock b/yarn.lock index c7dae800c..0ef2e24bb 100644 --- a/yarn.lock +++ b/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" From eafec42f17052bfbdbf935e01099b2a840321991 Mon Sep 17 00:00:00 2001 From: TetsuhiroSato Date: Fri, 9 Aug 2024 15:20:58 +0900 Subject: [PATCH 2/2] =?UTF-8?q?SmartHRUI=E3=81=A7=E8=BF=BD=E5=8A=A0?= =?UTF-8?q?=E3=81=95=E3=82=8C=E3=81=9F=E3=82=B3=E3=83=B3=E3=83=9D=E3=83=BC?= =?UTF-8?q?=E3=83=8D=E3=83=B3=E3=83=88=E3=81=AE=E3=83=9A=E3=83=BC=E3=82=B8?= =?UTF-8?q?=E3=81=A0=E3=81=91=E3=82=92=E7=94=A8=E6=84=8F=E3=81=97=E3=81=9F?= =?UTF-8?q?=E3=80=82=E4=B8=AD=E8=BA=AB=E3=81=AFwip?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- content/articles/products/components/stepper.mdx | 16 ++++++++++++++++ .../products/components/time-picker .mdx | 16 ++++++++++++++++ 2 files changed, 32 insertions(+) create mode 100644 content/articles/products/components/stepper.mdx create mode 100644 content/articles/products/components/time-picker .mdx diff --git a/content/articles/products/components/stepper.mdx b/content/articles/products/components/stepper.mdx new file mode 100644 index 000000000..f170e8006 --- /dev/null +++ b/content/articles/products/components/stepper.mdx @@ -0,0 +1,16 @@ +--- +title: 'Stepper' +description: '' +--- + +import { ComponentPropsTable } from '@Components/ComponentPropsTable' +import { ComponentStory } from '@Components/ComponentStory' + + + + +## Props + + + + diff --git a/content/articles/products/components/time-picker .mdx b/content/articles/products/components/time-picker .mdx new file mode 100644 index 000000000..3f66f5e2d --- /dev/null +++ b/content/articles/products/components/time-picker .mdx @@ -0,0 +1,16 @@ +--- +title: 'TimePicker ' +description: '' +--- + +import { ComponentPropsTable } from '@Components/ComponentPropsTable' +import { ComponentStory } from '@Components/ComponentStory' + + + + +## Props + + + +