@remember-web/primitive 0.3.0 → 0.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.cjs.js","sources":["../../../../src/Floating/Popover/styles.ts"],"sourcesContent":["import { PopoverContent, PopoverContentProps } from '@radix-ui/react-popover';\nimport { bg100, contents000 } from '@remember-web/mixin';\nimport { CSSProperties } from 'react';\nimport styled, { css, keyframes } from 'styled-components';\n\nexport const showFadeIn = keyframes`\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n`;\nexport const showFadeOut = keyframes`\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n`;\n\nexport const StyledPopoverContentWrapper = styled.div<{$zIndex?: CSSProperties['zIndex']}>`\n [data-radix-popper-content-wrapper]{\n ${({$zIndex}) => $zIndex && css` z-index: ${$zIndex} !important; `}\n }\n
|
|
1
|
+
{"version":3,"file":"styles.cjs.js","sources":["../../../../src/Floating/Popover/styles.ts"],"sourcesContent":["import { PopoverContent, PopoverContentProps } from '@radix-ui/react-popover';\nimport { bg100, contents000 } from '@remember-web/mixin';\nimport type { CSSProperties } from 'react';\nimport styled, { css, keyframes } from 'styled-components';\n\nexport const showFadeIn = keyframes`\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n`;\nexport const showFadeOut = keyframes`\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n`;\n\nexport const StyledPopoverContentWrapper = styled.div<{\n $zIndex?: CSSProperties['zIndex'];\n}>`\n [data-radix-popper-content-wrapper]{\n ${({ $zIndex }) => $zIndex && css` z-index: ${$zIndex} !important; `}\n }\n`;\n\nexport const StyledPopoverContent = styled(PopoverContent)`\n contain: paint;\n width: fit-content;\n margin: 0;\n padding: 0;\n border-radius: 4px;\n\n box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.1);\n color: ${contents000};\n background-color: ${bg100};\n white-space: pre-line;\n\n height: 100%;\n will-change: box-shadow;\n\n &:focus {\n outline: none;\n }\n &[data-state='open'] {\n animation: ${showFadeIn} 0.12s cubic-bezier(0.35, 0, 0.25, 1) both;\n }\n &:not([data-state='open']) {\n animation: ${showFadeOut} 0.16s cubic-bezier(0.35, 0, 0.25, 1) both;\n }\n`;\n\nStyledPopoverContent.defaultProps = {\n avoidCollisions: true,\n align: 'start',\n side: 'bottom',\n sideOffset: 4,\n};\n"],"names":["showFadeIn","keyframes","_templateObject","_taggedTemplateLiteral","showFadeOut","_templateObject2","StyledPopoverContentWrapper","styled","div","_templateObject3","_ref","$zIndex","css","_templateObject4","StyledPopoverContent","PopoverContent","_templateObject5","contents000","bg100","defaultProps","avoidCollisions","align","side","sideOffset"],"mappings":";;;;;;;;;;;;;AAKO,IAAMA,UAAU,GAAGC,gBAAS,CAAAC,eAAA,KAAAA,eAAA,GAAAC,uCAAA,CAOlC,CAAA,kFAAA,CAAA,CAAA,CAAA,EAAA;AACM,IAAMC,WAAW,GAAGH,gBAAS,CAAAI,gBAAA,KAAAA,gBAAA,GAAAF,uCAAA,CAOnC,CAAA,kFAAA,CAAA,CAAA,CAAA,EAAA;AAEYG,IAAAA,2BAA2B,GAAGC,uBAAM,CAACC,GAAG,CAAAC,gBAAA,KAAAA,gBAAA,GAAAN,uCAAA,CAAA,CAAA,gDAAA,EAAA,SAAA,CAAA,CAAA,CAAA,EAI/C,UAAAO,IAAA,EAAA;AAAA,EAAA,IAAGC,OAAO,GAAAD,IAAA,CAAPC,OAAO,CAAA;EAAA,OAAOA,OAAO,IAAIC,UAAG,CAAAC,gBAAA,KAAAA,gBAAA,GAAAV,uCAAA,CAAaQ,CAAAA,YAAAA,EAAAA,eAAAA,CAAAA,CAAAA,CAAAA,EAAAA,OAAO,CAAe,CAAA;AAAA,CAEvE,EAAA;AAEM,IAAMG,oBAAoB,GAAGP,uBAAM,CAACQ,2BAAc,CAAC,CAAAC,gBAAA,KAAAA,gBAAA,GAAAb,uCAAA,2fAQ/Cc,iBAAW,EACAC,WAAK,EAUVlB,UAAU,EAGVI,WAAW,EAE3B;AAEDU,oBAAoB,CAACK,YAAY,GAAG;AAClCC,EAAAA,eAAe,EAAE,IAAI;AACrBC,EAAAA,KAAK,EAAE,OAAO;AACdC,EAAAA,IAAI,EAAE,QAAQ;AACdC,EAAAA,UAAU,EAAE,CAAA;AACd,CAAC;;;;;;;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { PopoverContentProps } from '@radix-ui/react-popover';
|
|
2
|
-
import { CSSProperties } from 'react';
|
|
2
|
+
import type { CSSProperties } from 'react';
|
|
3
3
|
export declare const showFadeIn: import("styled-components/dist/models/Keyframes").default;
|
|
4
4
|
export declare const showFadeOut: import("styled-components/dist/models/Keyframes").default;
|
|
5
5
|
export declare const StyledPopoverContentWrapper: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/Floating/Popover/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAE9E,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/Floating/Popover/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAE9E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAG3C,eAAO,MAAM,UAAU,2DAOtB,CAAC;AACF,eAAO,MAAM,WAAW,2DAOvB,CAAC;AAEF,eAAO,MAAM,2BAA2B;cAC5B,aAAa,CAAC,QAAQ,CAAC;GAKlC,CAAC;AAEF,eAAO,MAAM,oBAAoB;;gLAwBhC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.esm.js","sources":["../../../../src/Floating/Popover/styles.ts"],"sourcesContent":["import { PopoverContent, PopoverContentProps } from '@radix-ui/react-popover';\nimport { bg100, contents000 } from '@remember-web/mixin';\nimport { CSSProperties } from 'react';\nimport styled, { css, keyframes } from 'styled-components';\n\nexport const showFadeIn = keyframes`\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n`;\nexport const showFadeOut = keyframes`\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n`;\n\nexport const StyledPopoverContentWrapper = styled.div<{$zIndex?: CSSProperties['zIndex']}>`\n [data-radix-popper-content-wrapper]{\n ${({$zIndex}) => $zIndex && css` z-index: ${$zIndex} !important; `}\n }\n
|
|
1
|
+
{"version":3,"file":"styles.esm.js","sources":["../../../../src/Floating/Popover/styles.ts"],"sourcesContent":["import { PopoverContent, PopoverContentProps } from '@radix-ui/react-popover';\nimport { bg100, contents000 } from '@remember-web/mixin';\nimport type { CSSProperties } from 'react';\nimport styled, { css, keyframes } from 'styled-components';\n\nexport const showFadeIn = keyframes`\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n`;\nexport const showFadeOut = keyframes`\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n`;\n\nexport const StyledPopoverContentWrapper = styled.div<{\n $zIndex?: CSSProperties['zIndex'];\n}>`\n [data-radix-popper-content-wrapper]{\n ${({ $zIndex }) => $zIndex && css` z-index: ${$zIndex} !important; `}\n }\n`;\n\nexport const StyledPopoverContent = styled(PopoverContent)`\n contain: paint;\n width: fit-content;\n margin: 0;\n padding: 0;\n border-radius: 4px;\n\n box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.1);\n color: ${contents000};\n background-color: ${bg100};\n white-space: pre-line;\n\n height: 100%;\n will-change: box-shadow;\n\n &:focus {\n outline: none;\n }\n &[data-state='open'] {\n animation: ${showFadeIn} 0.12s cubic-bezier(0.35, 0, 0.25, 1) both;\n }\n &:not([data-state='open']) {\n animation: ${showFadeOut} 0.16s cubic-bezier(0.35, 0, 0.25, 1) both;\n }\n`;\n\nStyledPopoverContent.defaultProps = {\n avoidCollisions: true,\n align: 'start',\n side: 'bottom',\n sideOffset: 4,\n};\n"],"names":["showFadeIn","keyframes","_templateObject","_taggedTemplateLiteral","showFadeOut","_templateObject2","StyledPopoverContentWrapper","styled","div","_templateObject3","_ref","$zIndex","css","_templateObject4","StyledPopoverContent","PopoverContent","_templateObject5","contents000","bg100","defaultProps","avoidCollisions","align","side","sideOffset"],"mappings":";;;;;;AAKO,IAAMA,UAAU,GAAGC,SAAS,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,CAOlC,CAAA,kFAAA,CAAA,CAAA,CAAA,EAAA;AACM,IAAMC,WAAW,GAAGH,SAAS,CAAAI,gBAAA,KAAAA,gBAAA,GAAAF,sBAAA,CAOnC,CAAA,kFAAA,CAAA,CAAA,CAAA,EAAA;AAEYG,IAAAA,2BAA2B,GAAGC,MAAM,CAACC,GAAG,CAAAC,gBAAA,KAAAA,gBAAA,GAAAN,sBAAA,CAAA,CAAA,gDAAA,EAAA,SAAA,CAAA,CAAA,CAAA,EAI/C,UAAAO,IAAA,EAAA;AAAA,EAAA,IAAGC,OAAO,GAAAD,IAAA,CAAPC,OAAO,CAAA;EAAA,OAAOA,OAAO,IAAIC,GAAG,CAAAC,gBAAA,KAAAA,gBAAA,GAAAV,sBAAA,CAAaQ,CAAAA,YAAAA,EAAAA,eAAAA,CAAAA,CAAAA,CAAAA,EAAAA,OAAO,CAAe,CAAA;AAAA,CAEvE,EAAA;AAEM,IAAMG,oBAAoB,GAAGP,MAAM,CAACQ,cAAc,CAAC,CAAAC,gBAAA,KAAAA,gBAAA,GAAAb,sBAAA,2fAQ/Cc,WAAW,EACAC,KAAK,EAUVlB,UAAU,EAGVI,WAAW,EAE3B;AAEDU,oBAAoB,CAACK,YAAY,GAAG;AAClCC,EAAAA,eAAe,EAAE,IAAI;AACrBC,EAAAA,KAAK,EAAE,OAAO;AACdC,EAAAA,IAAI,EAAE,QAAQ;AACdC,EAAAA,UAAU,EAAE,CAAA;AACd,CAAC;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@remember-web/primitive",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.1",
|
|
4
4
|
"description": "Remember Web Primitive Components",
|
|
5
5
|
"homepage": "https://dramancompany.github.io/remember-web-packages/",
|
|
6
6
|
"author": "Remember",
|
|
@@ -47,6 +47,7 @@
|
|
|
47
47
|
},
|
|
48
48
|
"devDependencies": {
|
|
49
49
|
"@babel/core": "^7.24.4",
|
|
50
|
+
"@babel/plugin-transform-optional-chaining": "^7.25.9",
|
|
50
51
|
"@babel/plugin-transform-runtime": "^7.24.3",
|
|
51
52
|
"@babel/preset-env": "^7.24.4",
|
|
52
53
|
"@babel/preset-react": "^7.24.1",
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { PopoverContent, PopoverContentProps } from '@radix-ui/react-popover';
|
|
2
2
|
import { bg100, contents000 } from '@remember-web/mixin';
|
|
3
|
-
import { CSSProperties } from 'react';
|
|
3
|
+
import type { CSSProperties } from 'react';
|
|
4
4
|
import styled, { css, keyframes } from 'styled-components';
|
|
5
5
|
|
|
6
6
|
export const showFadeIn = keyframes`
|
|
@@ -20,11 +20,13 @@ export const showFadeOut = keyframes`
|
|
|
20
20
|
}
|
|
21
21
|
`;
|
|
22
22
|
|
|
23
|
-
export const StyledPopoverContentWrapper = styled.div<{
|
|
23
|
+
export const StyledPopoverContentWrapper = styled.div<{
|
|
24
|
+
$zIndex?: CSSProperties['zIndex'];
|
|
25
|
+
}>`
|
|
24
26
|
[data-radix-popper-content-wrapper]{
|
|
25
|
-
${({$zIndex}) => $zIndex && css` z-index: ${$zIndex} !important; `}
|
|
27
|
+
${({ $zIndex }) => $zIndex && css` z-index: ${$zIndex} !important; `}
|
|
26
28
|
}
|
|
27
|
-
|
|
29
|
+
`;
|
|
28
30
|
|
|
29
31
|
export const StyledPopoverContent = styled(PopoverContent)`
|
|
30
32
|
contain: paint;
|