@primereact/styles 11.0.0-alpha.5 → 11.0.0-alpha.6
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.
- package/carousel/Carousel.style.d.ts +15 -0
- package/carousel/index.d.ts +1 -0
- package/carousel/index.mjs +85 -0
- package/carousel/index.mjs.map +1 -0
- package/inputnumber/InputNumber.style.d.ts +15 -0
- package/inputnumber/index.d.ts +1 -0
- package/inputnumber/index.mjs +2 -0
- package/inputnumber/index.mjs.map +1 -0
- package/package.json +3 -3
- package/toast/Toast.style.d.ts +15 -0
- package/toast/index.d.ts +1 -0
- package/toast/index.mjs +4 -0
- package/toast/index.mjs.map +1 -0
- package/tooltip/index.mjs +3 -3
- package/tooltip/index.mjs.map +1 -1
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { CarouselInstance } from '@primereact/types/shared/carousel';
|
|
2
|
+
export declare const styles: {
|
|
3
|
+
name: string | undefined;
|
|
4
|
+
css: import("@primeuix/styled").StyleType | undefined;
|
|
5
|
+
style: import("@primeuix/styled").StyleType | undefined;
|
|
6
|
+
classes: import("@primereact/types/styles").ClassesType<CarouselInstance> | undefined;
|
|
7
|
+
inlineStyles: import("@primereact/types/styles").InlineStylesType<CarouselInstance>;
|
|
8
|
+
baseStyles: {
|
|
9
|
+
name: string;
|
|
10
|
+
css: string;
|
|
11
|
+
style: import("@primeuix/styled").StyleType;
|
|
12
|
+
classes: {};
|
|
13
|
+
inlineStyles: {};
|
|
14
|
+
};
|
|
15
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './Carousel.style';
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
import{createStyles as t}from"@primereact/styles/utils";var r=`
|
|
2
|
+
.p-carousel{
|
|
3
|
+
position:relative;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
.p-carousel-viewport{
|
|
7
|
+
overflow: hidden;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.p-carousel-content{
|
|
11
|
+
display: flex;
|
|
12
|
+
transform: translate3d(var(--p-swipe-amount-x), var(--p-swipe-amount-y), 0);
|
|
13
|
+
touch-action: pan-y pinch-zoom;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
.p-carousel-content-horizontal{
|
|
17
|
+
flex-direction: row;
|
|
18
|
+
margin-left: calc(var(--p-spacing) * -1);
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
.p-carousel-content-vertical{
|
|
22
|
+
flex-direction: column;
|
|
23
|
+
margin-top: calc(var(--p-spacing) * -1);
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
.p-carousel-item{
|
|
27
|
+
flex: 0 0 var(--p-slide-size);
|
|
28
|
+
min-width: 0;
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
.p-carousel-content-horizontal .p-carousel-item{
|
|
32
|
+
padding-left: var(--p-spacing);
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
.p-carousel-content-vertical .p-carousel-item{
|
|
36
|
+
padding-top: var(--p-spacing);
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.p-carousel-indicator-list {
|
|
40
|
+
display: flex;
|
|
41
|
+
flex-direction: row;
|
|
42
|
+
justify-content: center;
|
|
43
|
+
flex-wrap: wrap;
|
|
44
|
+
padding: dt('carousel.indicator.list.padding');
|
|
45
|
+
gap: dt('carousel.indicator.list.gap');
|
|
46
|
+
margin: 0;
|
|
47
|
+
list-style: none;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.p-carousel-indicator-button {
|
|
51
|
+
display: flex;
|
|
52
|
+
align-items: center;
|
|
53
|
+
justify-content: center;
|
|
54
|
+
background: dt('carousel.indicator.background');
|
|
55
|
+
width: dt('carousel.indicator.width');
|
|
56
|
+
height: dt('carousel.indicator.height');
|
|
57
|
+
border: 0 none;
|
|
58
|
+
transition:
|
|
59
|
+
background dt('carousel.transition.duration'),
|
|
60
|
+
color dt('carousel.transition.duration'),
|
|
61
|
+
outline-color dt('carousel.transition.duration'),
|
|
62
|
+
box-shadow dt('carousel.transition.duration');
|
|
63
|
+
outline-color: transparent;
|
|
64
|
+
border-radius: dt('carousel.indicator.border.radius');
|
|
65
|
+
padding: 0;
|
|
66
|
+
margin: 0;
|
|
67
|
+
user-select: none;
|
|
68
|
+
cursor: pointer;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
.p-carousel-indicator-button:focus-visible {
|
|
72
|
+
box-shadow: dt('carousel.indicator.focus.ring.shadow');
|
|
73
|
+
outline: dt('carousel.indicator.focus.ring.width') dt('carousel.indicator.focus.ring.style') dt('carousel.indicator.focus.ring.color');
|
|
74
|
+
outline-offset: dt('carousel.indicator.focus.ring.offset');
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
.p-carousel-indicator-button:hover {
|
|
78
|
+
background: dt('carousel.indicator.hover.background');
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
.p-carousel-indicator-active.p-carousel-indicator-button {
|
|
82
|
+
background: dt('carousel.indicator.active.background');
|
|
83
|
+
}
|
|
84
|
+
`,e=t({name:"carousel",style:r,classes:{root:"p-carousel p-component",viewport:"p-carousel-viewport",content:({context:o})=>["p-carousel-content",o.orientation==="vertical"?"p-carousel-content-vertical":"p-carousel-content-horizontal"],item:"p-carousel-item",indicators:"p-carousel-indicator-list",indicator:({context:o})=>["p-carousel-indicator-button",o.active?"p-carousel-indicator-active":""],prev:({context:o})=>[{"p-disabled":o.disabled}],next:({context:o})=>[{"p-disabled":o.disabled}]}});export{e as styles};
|
|
85
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/carousel/Carousel.style.ts"],"sourcesContent":["import { createStyles } from '@primereact/styles/utils';\nimport type { CarouselInstance } from '@primereact/types/shared/carousel';\n\nconst theme = `\n.p-carousel{\nposition:relative;\n}\n\n.p-carousel-viewport{\n overflow: hidden;\n}\n\n.p-carousel-content{\n display: flex;\n transform: translate3d(var(--p-swipe-amount-x), var(--p-swipe-amount-y), 0);\n touch-action: pan-y pinch-zoom;\n}\n\n.p-carousel-content-horizontal{\n flex-direction: row;\n margin-left: calc(var(--p-spacing) * -1);\n}\n\n.p-carousel-content-vertical{\n flex-direction: column;\n margin-top: calc(var(--p-spacing) * -1);\n}\n \n.p-carousel-item{\n flex: 0 0 var(--p-slide-size);\n min-width: 0;\n}\n\n.p-carousel-content-horizontal .p-carousel-item{\npadding-left: var(--p-spacing);\n}\n\n.p-carousel-content-vertical .p-carousel-item{\npadding-top: var(--p-spacing);\n}\n\n.p-carousel-indicator-list {\n display: flex;\n flex-direction: row;\n justify-content: center;\n flex-wrap: wrap;\n padding: dt('carousel.indicator.list.padding');\n gap: dt('carousel.indicator.list.gap');\n margin: 0;\n list-style: none;\n}\n\n.p-carousel-indicator-button {\n display: flex;\n align-items: center;\n justify-content: center;\n background: dt('carousel.indicator.background');\n width: dt('carousel.indicator.width');\n height: dt('carousel.indicator.height');\n border: 0 none;\n transition:\n background dt('carousel.transition.duration'),\n color dt('carousel.transition.duration'),\n outline-color dt('carousel.transition.duration'),\n box-shadow dt('carousel.transition.duration');\n outline-color: transparent;\n border-radius: dt('carousel.indicator.border.radius');\n padding: 0;\n margin: 0;\n user-select: none;\n cursor: pointer;\n}\n\n.p-carousel-indicator-button:focus-visible {\n box-shadow: dt('carousel.indicator.focus.ring.shadow');\n outline: dt('carousel.indicator.focus.ring.width') dt('carousel.indicator.focus.ring.style') dt('carousel.indicator.focus.ring.color');\n outline-offset: dt('carousel.indicator.focus.ring.offset');\n}\n\n.p-carousel-indicator-button:hover {\n background: dt('carousel.indicator.hover.background');\n}\n\n.p-carousel-indicator-active.p-carousel-indicator-button {\n background: dt('carousel.indicator.active.background');\n}\n`;\n\nexport const styles = createStyles<CarouselInstance>({\n name: 'carousel',\n style: theme,\n classes: {\n root: 'p-carousel p-component',\n viewport: 'p-carousel-viewport',\n content: ({ context }) => ['p-carousel-content', context.orientation === 'vertical' ? 'p-carousel-content-vertical' : 'p-carousel-content-horizontal'],\n item: 'p-carousel-item',\n indicators: 'p-carousel-indicator-list',\n indicator: ({ context }) => ['p-carousel-indicator-button', context.active ? 'p-carousel-indicator-active' : ''],\n prev: ({ context }) => [\n {\n 'p-disabled': context.disabled\n }\n ],\n next: ({ context }) => [\n {\n 'p-disabled': context.disabled\n }\n ]\n }\n});\n"],"mappings":"AAAA,OAAS,gBAAAA,MAAoB,2BAG7B,IAAMC,EAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAqFDC,EAASF,EAA+B,CACjD,KAAM,WACN,MAAOC,EACP,QAAS,CACL,KAAM,yBACN,SAAU,sBACV,QAAS,CAAC,CAAE,QAAAE,CAAQ,IAAM,CAAC,qBAAsBA,EAAQ,cAAgB,WAAa,8BAAgC,+BAA+B,EACrJ,KAAM,kBACN,WAAY,4BACZ,UAAW,CAAC,CAAE,QAAAA,CAAQ,IAAM,CAAC,8BAA+BA,EAAQ,OAAS,8BAAgC,EAAE,EAC/G,KAAM,CAAC,CAAE,QAAAA,CAAQ,IAAM,CACnB,CACI,aAAcA,EAAQ,QAC1B,CACJ,EACA,KAAM,CAAC,CAAE,QAAAA,CAAQ,IAAM,CACnB,CACI,aAAcA,EAAQ,QAC1B,CACJ,CACJ,CACJ,CAAC","names":["createStyles","theme","styles","context"]}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { InputNumberInstance } from '@primereact/types/shared/inputnumber';
|
|
2
|
+
export declare const styles: {
|
|
3
|
+
name: string | undefined;
|
|
4
|
+
css: import("@primeuix/styled").StyleType | undefined;
|
|
5
|
+
style: import("@primeuix/styled").StyleType | undefined;
|
|
6
|
+
classes: import("@primereact/types/styles").ClassesType<InputNumberInstance> | undefined;
|
|
7
|
+
inlineStyles: import("@primereact/types/styles").InlineStylesType<InputNumberInstance>;
|
|
8
|
+
baseStyles: {
|
|
9
|
+
name: string;
|
|
10
|
+
css: string;
|
|
11
|
+
style: import("@primeuix/styled").StyleType;
|
|
12
|
+
classes: {};
|
|
13
|
+
inlineStyles: {};
|
|
14
|
+
};
|
|
15
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './InputNumber.style';
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{createStyles as n}from"@primereact/styles/utils";import{style as p}from"@primeuix/styles/inputnumber";var i=n({name:"inputnumber",style:p,classes:{root:({instance:t,props:e})=>["p-inputnumber p-component p-inputwrapper",{"p-invalid":e.invalid,"p-inputwrapper-filled":e.value!=null||e.defaultValue!=null||e.allowEmpty===!1,"p-inputwrapper-focus":t.focused,"p-inputnumber-fluid":e.fluid}],text:"p-inputnumber-input"}});export{i as styles};
|
|
2
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/inputnumber/InputNumber.style.ts"],"sourcesContent":["import { createStyles } from '@primereact/styles/utils';\nimport type { InputNumberInstance } from '@primereact/types/shared/inputnumber';\nimport { style } from '@primeuix/styles/inputnumber';\n\nexport const styles = createStyles<InputNumberInstance>({\n name: 'inputnumber',\n style,\n classes: {\n root: ({ instance, props }) => [\n 'p-inputnumber p-component p-inputwrapper',\n {\n 'p-invalid': props.invalid,\n 'p-inputwrapper-filled': props.value != null || props.defaultValue != null || props.allowEmpty === false,\n 'p-inputwrapper-focus': instance.focused,\n 'p-inputnumber-fluid': props.fluid\n }\n ],\n text: 'p-inputnumber-input'\n }\n});\n"],"mappings":"AAAA,OAAS,gBAAAA,MAAoB,2BAE7B,OAAS,SAAAC,MAAa,+BAEf,IAAMC,EAASF,EAAkC,CACpD,KAAM,cACN,MAAAC,EACA,QAAS,CACL,KAAM,CAAC,CAAE,SAAAE,EAAU,MAAAC,CAAM,IAAM,CAC3B,2CACA,CACI,YAAaA,EAAM,QACnB,wBAAyBA,EAAM,OAAS,MAAQA,EAAM,cAAgB,MAAQA,EAAM,aAAe,GACnG,uBAAwBD,EAAS,QACjC,sBAAuBC,EAAM,KACjC,CACJ,EACA,KAAM,qBACV,CACJ,CAAC","names":["createStyles","style","styles","instance","props"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@primereact/styles",
|
|
3
|
-
"version": "11.0.0-alpha.
|
|
3
|
+
"version": "11.0.0-alpha.6",
|
|
4
4
|
"author": "PrimeTek Informatics",
|
|
5
5
|
"description": "",
|
|
6
6
|
"homepage": "https://primereact.org/",
|
|
@@ -32,8 +32,8 @@
|
|
|
32
32
|
"access": "public"
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
|
-
"@primeuix/styled": "^0.7.
|
|
35
|
+
"@primeuix/styled": "^0.7.4",
|
|
36
36
|
"@primeuix/utils": "^0.6.1",
|
|
37
|
-
"@primeuix/styles": "^1.2.
|
|
37
|
+
"@primeuix/styles": "^1.2.5"
|
|
38
38
|
}
|
|
39
39
|
}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { ToastInstance } from '@primereact/types/shared/toast';
|
|
2
|
+
export declare const styles: {
|
|
3
|
+
name: string | undefined;
|
|
4
|
+
css: import("@primeuix/styled").StyleType | undefined;
|
|
5
|
+
style: import("@primeuix/styled").StyleType | undefined;
|
|
6
|
+
classes: import("@primereact/types/styles").ClassesType<ToastInstance> | undefined;
|
|
7
|
+
inlineStyles: import("@primereact/types/styles").InlineStylesType<ToastInstance>;
|
|
8
|
+
baseStyles: {
|
|
9
|
+
name: string;
|
|
10
|
+
css: string;
|
|
11
|
+
style: import("@primeuix/styled").StyleType;
|
|
12
|
+
classes: {};
|
|
13
|
+
inlineStyles: {};
|
|
14
|
+
};
|
|
15
|
+
};
|
package/toast/index.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './Toast.style';
|
package/toast/index.mjs
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/toast/Toast.style.ts"],"sourcesContent":["import { createStyles } from '@primereact/styles/utils';\nimport type { ToastInstance } from '@primereact/types/shared/toast';\n\nconst style = `\n \n`;\n\nexport const styles = createStyles<ToastInstance>({\n name: 'toast',\n style,\n classes: {}\n});\n"],"mappings":"AAAA,OAAS,gBAAAA,MAAoB,2BAG7B,IAAMC,EAAQ;AAAA;AAAA,EAIDC,EAASF,EAA4B,CAC9C,KAAM,QACN,MAAAC,EACA,QAAS,CAAC,CACd,CAAC","names":["createStyles","style","styles"]}
|
package/tooltip/index.mjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import{createStyles as t}from"@primereact/styles/utils";var o=`
|
|
2
2
|
.p-tooltip2 {
|
|
3
|
-
transform: scale(0.95)
|
|
4
|
-
opacity: 0
|
|
3
|
+
/*transform: scale(0.95);*/
|
|
4
|
+
/*opacity: 0;*/
|
|
5
5
|
transform-origin: var(--placer-transform-origin);
|
|
6
6
|
max-width: dt('tooltip.max.width');
|
|
7
7
|
background: dt('tooltip.background');
|
|
@@ -32,7 +32,7 @@ import{createStyles as t}from"@primereact/styles/utils";var o=`
|
|
|
32
32
|
.p-tooltip2-arrow[data-side='left'] {
|
|
33
33
|
transform: translateX(-50%) rotate(-135deg);
|
|
34
34
|
}
|
|
35
|
-
|
|
35
|
+
|
|
36
36
|
.p-tooltip2-arrow[data-side='top'] {
|
|
37
37
|
transform: translateY(-50%) rotate(-45deg);
|
|
38
38
|
}
|
package/tooltip/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/tooltip/Tooltip.style.ts"],"sourcesContent":["import { createStyles } from '@primereact/styles/utils';\nimport type { TooltipInstance } from '@primereact/types/shared/tooltip';\n\nconst style = `\n .p-tooltip2 {\n transform: scale(0.95)
|
|
1
|
+
{"version":3,"sources":["../../src/tooltip/Tooltip.style.ts"],"sourcesContent":["import { createStyles } from '@primereact/styles/utils';\nimport type { TooltipInstance } from '@primereact/types/shared/tooltip';\n\nconst style = `\n .p-tooltip2 {\n /*transform: scale(0.95);*/\n /*opacity: 0;*/\n transform-origin: var(--placer-transform-origin);\n max-width: dt('tooltip.max.width');\n background: dt('tooltip.background');\n color: dt('tooltip.color');\n padding: dt('tooltip.padding');\n box-shadow: dt('tooltip.shadow');\n border-radius: dt('tooltip.border.radius');\n }\n\n .p-tooltip2-text {\n white-space: pre-line;\n word-break: break-word;\n }\n\n .p-tooltip2-arrow {\n display: block;\n clip-path: polygon(0 100%, 0 0, 100% 100%);\n border-bottom-left-radius: 2px;\n width: 0.5rem;\n height: 0.5rem;\n background: dt('tooltip.background');\n }\n\n .p-tooltip2-arrow[data-side='right'] {\n transform: translateX(50%) rotate(45deg);\n }\n\n .p-tooltip2-arrow[data-side='left'] {\n transform: translateX(-50%) rotate(-135deg);\n }\n\n .p-tooltip2-arrow[data-side='top'] {\n transform: translateY(-50%) rotate(-45deg);\n }\n\n .p-tooltip2-arrow[data-side='bottom'] {\n transform: translateY(50%) rotate(135deg);\n }\n\n .p-placer-content-enter-from,\n .p-placer-content-leave-to {\n opacity: 0;\n transform: scale(0.9);\n }\n\n .p-placer-content-enter-to,\n .p-placer-content-leave-from {\n opacity: 1;\n transform: scale(1);\n }\n\n .p-placer-content-leave-active,\n .p-placer-content-enter-active {\n transition:\n opacity 250ms cubic-bezier(0.16, 1, 0.3, 1),\n transform 250ms cubic-bezier(0.16, 1, 0.3, 1);\n }\n\n`;\n\nexport const styles = createStyles<TooltipInstance>({\n name: 'tooltip',\n style,\n classes: {\n root: () => {\n return ['p-tooltip2 p-component'];\n },\n arrow: 'p-tooltip2-arrow',\n text: 'p-tooltip2-text'\n }\n});\n"],"mappings":"AAAA,OAAS,gBAAAA,MAAoB,2BAG7B,IAAMC,EAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAgEDC,EAASF,EAA8B,CAChD,KAAM,UACN,MAAAC,EACA,QAAS,CACL,KAAM,IACK,CAAC,wBAAwB,EAEpC,MAAO,mBACP,KAAM,iBACV,CACJ,CAAC","names":["createStyles","style","styles"]}
|