emoji-picker-react 4.7.8 → 4.7.9

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,4 +1,5 @@
1
1
  /// <reference types="react" />
2
+ import { Styles } from 'flairup';
2
3
  export declare const stylesheet: {
3
4
  create: <K extends string>(styles: Partial<{ [k in K]: Partial<Partial<CSSStyleDeclaration> & Partial<{
4
5
  '.'?: string | string[] | undefined;
@@ -10,3 +11,19 @@ export declare const stylesheet: {
10
11
  export declare const commonStyles: Record<never, Set<string>>;
11
12
  export declare function PickerStyleTag(): JSX.Element | null;
12
13
  export declare const commonInteractionStyles: Record<never, Set<string>>;
14
+ export declare function darkMode(key: string, value: Styles): {
15
+ '.epr-dark-theme': {
16
+ [x: string]: Partial<Partial<CSSStyleDeclaration> & Partial<{
17
+ '.'?: string | string[] | undefined;
18
+ '--'?: any;
19
+ }>>;
20
+ };
21
+ '.epr-auto-theme': {
22
+ [x: string]: {
23
+ '@media (prefers-color-scheme: dark)': Partial<Partial<CSSStyleDeclaration> & Partial<{
24
+ '.'?: string | string[] | undefined;
25
+ '--'?: any;
26
+ }>>;
27
+ };
28
+ };
29
+ };
@@ -193,6 +193,15 @@ var commonInteractionStyles = /*#__PURE__*/stylesheet.create({
193
193
  }, hidden)
194
194
  }
195
195
  });
196
+ function darkMode(key, value) {
197
+ var _eprDarkTheme, _eprAutoTheme;
198
+ return {
199
+ '.epr-dark-theme': (_eprDarkTheme = {}, _eprDarkTheme[key] = value, _eprDarkTheme),
200
+ '.epr-auto-theme': (_eprAutoTheme = {}, _eprAutoTheme[key] = {
201
+ '@media (prefers-color-scheme: dark)': value
202
+ }, _eprAutoTheme)
203
+ };
204
+ }
196
205
 
197
206
  var DEFAULT_REACTIONS = ['1f44d', '2764-fe0f', '1f603', '1f622', '1f64f', '1f44e', '1f621' // 😡
198
207
  ];
@@ -18081,7 +18090,7 @@ function BtnPlus() {
18081
18090
  }
18082
18091
  });
18083
18092
  }
18084
- var styles$4 = /*#__PURE__*/stylesheet.create({
18093
+ var styles$4 = /*#__PURE__*/stylesheet.create( /*#__PURE__*/_extends({
18085
18094
  plusSign: {
18086
18095
  fontSize: '20px',
18087
18096
  padding: '17px',
@@ -18121,30 +18130,15 @@ var styles$4 = /*#__PURE__*/stylesheet.create({
18121
18130
  backgroundPositionY: '-40px'
18122
18131
  }
18123
18132
  }
18133
+ }
18134
+ }, /*#__PURE__*/darkMode('plusSign', {
18135
+ ':after': {
18136
+ backgroundPositionY: '-40px'
18124
18137
  },
18125
- '.epr-dark-theme': {
18126
- plusSign: {
18127
- ':after': {
18128
- backgroundPositionY: '-40px'
18129
- },
18130
- ':hover:after': {
18131
- backgroundPositionY: '-60px'
18132
- }
18133
- }
18134
- },
18135
- '.epr-auto-theme': {
18136
- plusSign: {
18137
- '@media (prefers-color-scheme: dark)': {
18138
- ':after': {
18139
- backgroundPositionY: '-40px'
18140
- },
18141
- ':hover:after': {
18142
- backgroundPositionY: '-60px'
18143
- }
18144
- }
18145
- }
18138
+ ':hover:after': {
18139
+ backgroundPositionY: '-60px'
18146
18140
  }
18147
- });
18141
+ })));
18148
18142
 
18149
18143
  function Reactions() {
18150
18144
  var _useReactionsModeStat = useReactionsModeState(),
@@ -18850,7 +18844,7 @@ function useVariationPickerTop(VariationPickerRef) {
18850
18844
  return emojiOffsetTop - height;
18851
18845
  }
18852
18846
  }
18853
- var styles$8 = /*#__PURE__*/stylesheet.create({
18847
+ var styles$8 = /*#__PURE__*/stylesheet.create( /*#__PURE__*/_extends({
18854
18848
  variationPicker: {
18855
18849
  '.': ClassNames.variationPicker,
18856
18850
  position: 'absolute',
@@ -18902,20 +18896,10 @@ var styles$8 = /*#__PURE__*/stylesheet.create({
18902
18896
  top: '100%',
18903
18897
  transform: 'translateX(-18px)',
18904
18898
  backgroundImage: "url(" + SVGTriangle + ")"
18905
- },
18906
- '.epr-dark-theme': {
18907
- pointer: {
18908
- backgroundPosition: '-25px 0'
18909
- }
18910
- },
18911
- '.epr-auto-theme': {
18912
- pointer: {
18913
- '@media (prefers-color-scheme: dark)': {
18914
- backgroundPosition: '-25px 0'
18915
- }
18916
- }
18917
18899
  }
18918
- });
18900
+ }, /*#__PURE__*/darkMode('pointer', {
18901
+ backgroundPosition: '-25px 0'
18902
+ })));
18919
18903
 
18920
18904
  function Body() {
18921
18905
  var BodyRef = useBodyRef();
@@ -19659,7 +19643,7 @@ function IcnSearch() {
19659
19643
  className: flairup.cx(styles$h.icnSearch)
19660
19644
  });
19661
19645
  }
19662
- var styles$h = /*#__PURE__*/stylesheet.create({
19646
+ var styles$h = /*#__PURE__*/stylesheet.create( /*#__PURE__*/_extends({
19663
19647
  icnSearch: {
19664
19648
  '.': 'epr-icn-search',
19665
19649
  content: '',
@@ -19673,20 +19657,10 @@ var styles$h = /*#__PURE__*/stylesheet.create({
19673
19657
  backgroundPosition: '0 0',
19674
19658
  backgroundSize: '20px',
19675
19659
  backgroundImage: "url(" + SVGMagnifier + ")"
19676
- },
19677
- '.epr-dark-theme': {
19678
- icnSearch: {
19679
- backgroundPositionY: '-20px'
19680
- }
19681
- },
19682
- '.epr-auto-theme': {
19683
- icnSearch: {
19684
- '@media (prefers-color-scheme: dark)': {
19685
- backgroundPositionY: '-20px'
19686
- }
19687
- }
19688
19660
  }
19689
- });
19661
+ }, /*#__PURE__*/darkMode('icnSearch', {
19662
+ backgroundPositionY: '-20px'
19663
+ })));
19690
19664
 
19691
19665
  function SearchContainer() {
19692
19666
  var searchDisabled = useSearchDisabledConfig();