@fluentui-copilot/react-morse-code 0.0.10 → 0.0.12
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/CHANGELOG.json +16 -1
- package/CHANGELOG.md +11 -2
- package/lib/components/MorseCode.types.js +1 -2
- package/lib/components/hooks/useAddModule.js +14 -12
- package/lib/components/hooks/useFallbackRef.js +18 -17
- package/lib/components/large/MorseCode.js +5 -6
- package/lib/components/large/MorseCode.styles.raw.js +21 -0
- package/lib/components/large/MorseCode.styles.raw.js.map +1 -0
- package/lib/components/large/MorseCodeFallback.js +7 -11
- package/lib/components/large/MorseCodeHoudini.js +7 -13
- package/lib/components/large/MorseCodeHoudini.styles.raw.js +22 -0
- package/lib/components/large/MorseCodeHoudini.styles.raw.js.map +1 -0
- package/lib/components/shared/renderMorseCode.js +8 -9
- package/lib/components/small/MorseCodeSmall.js +5 -6
- package/lib/components/small/MorseCodeSmall.styles.raw.js +21 -0
- package/lib/components/small/MorseCodeSmall.styles.raw.js.map +1 -0
- package/lib/components/small/MorseCodeSmallFallback.js +7 -11
- package/lib/components/small/MorseCodeSmallHoudini.js +7 -13
- package/lib/components/small/MorseCodeSmallHoudini.styles.raw.js +23 -0
- package/lib/components/small/MorseCodeSmallHoudini.styles.raw.js.map +1 -0
- package/lib/index.js +0 -1
- package/lib-commonjs/components/MorseCode.types.js +0 -1
- package/lib-commonjs/components/hooks/useAddModule.js +1 -1
- package/lib-commonjs/components/hooks/useAddModule.js.map +1 -1
- package/lib-commonjs/components/hooks/useFallbackRef.js +1 -1
- package/lib-commonjs/components/hooks/useFallbackRef.js.map +1 -1
- package/lib-commonjs/components/large/MorseCode.js +1 -1
- package/lib-commonjs/components/large/MorseCode.js.map +1 -1
- package/lib-commonjs/components/large/MorseCode.styles.raw.js +31 -0
- package/lib-commonjs/components/large/MorseCode.styles.raw.js.map +1 -0
- package/lib-commonjs/components/large/MorseCodeFallback.js +1 -1
- package/lib-commonjs/components/large/MorseCodeFallback.js.map +1 -1
- package/lib-commonjs/components/large/MorseCodeHoudini.js +1 -1
- package/lib-commonjs/components/large/MorseCodeHoudini.js.map +1 -1
- package/lib-commonjs/components/large/MorseCodeHoudini.styles.raw.js +32 -0
- package/lib-commonjs/components/large/MorseCodeHoudini.styles.raw.js.map +1 -0
- package/lib-commonjs/components/shared/renderMorseCode.js +1 -1
- package/lib-commonjs/components/shared/renderMorseCode.js.map +1 -1
- package/lib-commonjs/components/small/MorseCodeSmall.js +1 -1
- package/lib-commonjs/components/small/MorseCodeSmall.js.map +1 -1
- package/lib-commonjs/components/small/MorseCodeSmall.styles.raw.js +31 -0
- package/lib-commonjs/components/small/MorseCodeSmall.styles.raw.js.map +1 -0
- package/lib-commonjs/components/small/MorseCodeSmallFallback.js +1 -1
- package/lib-commonjs/components/small/MorseCodeSmallFallback.js.map +1 -1
- package/lib-commonjs/components/small/MorseCodeSmallHoudini.js +1 -1
- package/lib-commonjs/components/small/MorseCodeSmallHoudini.js.map +1 -1
- package/lib-commonjs/components/small/MorseCodeSmallHoudini.styles.raw.js +33 -0
- package/lib-commonjs/components/small/MorseCodeSmallHoudini.styles.raw.js.map +1 -0
- package/lib-commonjs/index.js +0 -1
- package/package.json +2 -2
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,22 @@
|
|
|
2
2
|
"name": "@fluentui-copilot/react-morse-code",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "Thu,
|
|
5
|
+
"date": "Thu, 17 Jul 2025 17:49:25 GMT",
|
|
6
|
+
"tag": "@fluentui-copilot/react-morse-code_v0.0.11",
|
|
7
|
+
"version": "0.0.11",
|
|
8
|
+
"comments": {
|
|
9
|
+
"patch": [
|
|
10
|
+
{
|
|
11
|
+
"author": "hochelmartin@gmail.com",
|
|
12
|
+
"package": "@fluentui-copilot/react-morse-code",
|
|
13
|
+
"commit": "fef5160c07333e8d9996952a305b34e357604919",
|
|
14
|
+
"comment": "feat: enable griffel raw styles"
|
|
15
|
+
}
|
|
16
|
+
]
|
|
17
|
+
}
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
"date": "Thu, 10 Jul 2025 17:18:10 GMT",
|
|
6
21
|
"tag": "@fluentui-copilot/react-morse-code_v0.0.10",
|
|
7
22
|
"version": "0.0.10",
|
|
8
23
|
"comments": {
|
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,21 @@
|
|
|
1
1
|
# Change Log - @fluentui-copilot/react-morse-code
|
|
2
2
|
|
|
3
|
-
This log was last generated on Thu,
|
|
3
|
+
This log was last generated on Thu, 17 Jul 2025 17:49:25 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [0.0.11](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-morse-code_v0.0.11)
|
|
8
|
+
|
|
9
|
+
Thu, 17 Jul 2025 17:49:25 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-morse-code_v0.0.10..@fluentui-copilot/react-morse-code_v0.0.11)
|
|
11
|
+
|
|
12
|
+
### Patches
|
|
13
|
+
|
|
14
|
+
- feat: enable griffel raw styles ([PR #3227](https://github.com/microsoft/fluentai/pull/3227) by hochelmartin@gmail.com)
|
|
15
|
+
|
|
7
16
|
## [0.0.10](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-morse-code_v0.0.10)
|
|
8
17
|
|
|
9
|
-
Thu, 10 Jul 2025 17:
|
|
18
|
+
Thu, 10 Jul 2025 17:18:10 GMT
|
|
10
19
|
[Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-morse-code_v0.0.9..@fluentui-copilot/react-morse-code_v0.0.10)
|
|
11
20
|
|
|
12
21
|
### Patches
|
|
@@ -1,2 +1 @@
|
|
|
1
|
-
export {};
|
|
2
|
-
//# sourceMappingURL=MorseCode.types.js.map
|
|
1
|
+
export { };
|
|
@@ -1,16 +1,18 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { addModule } from '@fluentui-contrib/houdini-utils';
|
|
3
3
|
const initializedModules = {};
|
|
4
|
-
export const useAddModule = (baseUrl, fileName)
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
4
|
+
export const useAddModule = (baseUrl, fileName)=>{
|
|
5
|
+
React.useEffect(()=>{
|
|
6
|
+
const path = `${baseUrl}${fileName}`;
|
|
7
|
+
if (!initializedModules[path]) {
|
|
8
|
+
addModule(baseUrl, fileName).then(()=>{
|
|
9
|
+
initializedModules[path] = true;
|
|
10
|
+
}).catch((_err)=>{
|
|
11
|
+
initializedModules[path] = false;
|
|
12
|
+
});
|
|
13
|
+
}
|
|
14
|
+
}, [
|
|
15
|
+
baseUrl,
|
|
16
|
+
fileName
|
|
17
|
+
]);
|
|
15
18
|
};
|
|
16
|
-
//# sourceMappingURL=useAddModule.js.map
|
|
@@ -1,20 +1,21 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
3
|
-
const ON_COMPLETE_NOOP = ()
|
|
4
|
-
export const useFallbackRef = anim
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
3
|
+
const ON_COMPLETE_NOOP = ()=>{};
|
|
4
|
+
export const useFallbackRef = (anim)=>{
|
|
5
|
+
const targetRef = React.useCallback((node)=>{
|
|
6
|
+
let animControls;
|
|
7
|
+
if (node) {
|
|
8
|
+
animControls = anim(node);
|
|
9
|
+
animControls.play(ON_COMPLETE_NOOP);
|
|
10
|
+
} else {
|
|
11
|
+
if (animControls) {
|
|
12
|
+
animControls.stop();
|
|
13
|
+
animControls.cleanup();
|
|
14
|
+
animControls = undefined;
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
}, [
|
|
18
|
+
anim
|
|
19
|
+
]);
|
|
20
|
+
return targetRef;
|
|
19
21
|
};
|
|
20
|
-
//# sourceMappingURL=useFallbackRef.js.map
|
|
@@ -3,10 +3,9 @@ import { hasHoudini } from '@fluentui-contrib/houdini-utils';
|
|
|
3
3
|
import { MorseCodeFallback } from './MorseCodeFallback';
|
|
4
4
|
import { MorseCodeHoudini } from './MorseCodeHoudini';
|
|
5
5
|
const houdiniAvailable = hasHoudini();
|
|
6
|
-
export const MorseCode = props
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
6
|
+
export const MorseCode = (props)=>{
|
|
7
|
+
if (houdiniAvailable) {
|
|
8
|
+
return /*#__PURE__*/ React.createElement(MorseCodeHoudini, props);
|
|
9
|
+
}
|
|
10
|
+
return /*#__PURE__*/ React.createElement(MorseCodeFallback, props);
|
|
11
11
|
};
|
|
12
|
-
//# sourceMappingURL=MorseCode.js.map
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { makeStyles } from '@fluentui/react-components';
|
|
2
|
+
import { morseCodeTokens } from '@fluentui-copilot/morse-code';
|
|
3
|
+
export const useMorseCodeStyles = makeStyles({
|
|
4
|
+
base: {
|
|
5
|
+
'@supports (aspect-ratio: 20 / 1)': {
|
|
6
|
+
aspectRatio: morseCodeTokens.morseCodeAspectRatio
|
|
7
|
+
},
|
|
8
|
+
'@supports not (aspect-ratio: 20 / 1)': {
|
|
9
|
+
paddingTop: morseCodeTokens.morseCodeAspectRatioFallbackPaddingTop
|
|
10
|
+
},
|
|
11
|
+
minHeight: '5px',
|
|
12
|
+
forcedColorAdjust: 'none',
|
|
13
|
+
'--fai-morse-code-color-stop-1': morseCodeTokens.morseCodeColorStop1,
|
|
14
|
+
'--fai-morse-code-color-stop-2': morseCodeTokens.morseCodeColorStop2,
|
|
15
|
+
'--fai-morse-code-color-stop-3': morseCodeTokens.morseCodeColorStop3
|
|
16
|
+
},
|
|
17
|
+
wrapper: {
|
|
18
|
+
width: '100%',
|
|
19
|
+
height: '100%'
|
|
20
|
+
}
|
|
21
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["MorseCode.styles.ts"],"sourcesContent":["import { makeStyles } from '@fluentui/react-components';\nimport { morseCodeTokens } from '@fluentui-copilot/morse-code';\n\nexport const useMorseCodeStyles = makeStyles({\n base: {\n '@supports (aspect-ratio: 20 / 1)': {\n aspectRatio: morseCodeTokens.morseCodeAspectRatio,\n },\n '@supports not (aspect-ratio: 20 / 1)': {\n paddingTop: morseCodeTokens.morseCodeAspectRatioFallbackPaddingTop,\n },\n minHeight: '5px',\n forcedColorAdjust: 'none',\n '--fai-morse-code-color-stop-1': morseCodeTokens.morseCodeColorStop1,\n '--fai-morse-code-color-stop-2': morseCodeTokens.morseCodeColorStop2,\n '--fai-morse-code-color-stop-3': morseCodeTokens.morseCodeColorStop3,\n },\n wrapper: {\n width: '100%',\n height: '100%',\n },\n});\n"],"names":["makeStyles","morseCodeTokens","useMorseCodeStyles","base","aspectRatio","morseCodeAspectRatio","paddingTop","morseCodeAspectRatioFallbackPaddingTop","minHeight","forcedColorAdjust","morseCodeColorStop1","morseCodeColorStop2","morseCodeColorStop3","wrapper","width","height"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,UAAU,QAAQ,6BAA6B;AACxD,SAASC,eAAe,QAAQ,+BAA+B;AAE/D,OAAO,MAAMC,qBAAqBF,WAAW;IAC3CG,MAAM;QACJ,qCAAqC;YACnCC,aAAaH,gBAAgBI,oBAAoB;QACnD;QACA,yCAAyC;YACvCC,YAAYL,gBAAgBM,sCAAsC;QACpE;QACAC,WAAW;QACXC,mBAAmB;QACnB,iCAAiCR,gBAAgBS,mBAAmB;QACpE,iCAAiCT,gBAAgBU,mBAAmB;QACpE,iCAAiCV,gBAAgBW,mBAAmB;IACtE;IACAC,SAAS;QACPC,OAAO;QACPC,QAAQ;IACV;AACF,GAAG"}
|
|
@@ -3,15 +3,11 @@ import { morseCode } from '@fluentui-copilot/morse-code';
|
|
|
3
3
|
import { useMorseCodeStyles } from './MorseCode.styles';
|
|
4
4
|
import { useFallbackRef } from '../hooks/useFallbackRef';
|
|
5
5
|
import { renderMorseCode } from '../shared/renderMorseCode';
|
|
6
|
-
export const MorseCodeFallback = props
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
className
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
const wrapperClassName = mergeClasses(morseCodeStyles.wrapper, className);
|
|
14
|
-
const morseCodeClassName = mergeClasses('fai-MorseCode', 'fai-MorseCodeFallback', morseCodeStyles.base);
|
|
15
|
-
return renderMorseCode(wrapperClassName, restProps, morseCodeClassName, targetRef);
|
|
6
|
+
export const MorseCodeFallback = (props)=>{
|
|
7
|
+
const morseCodeStyles = useMorseCodeStyles();
|
|
8
|
+
const targetRef = useFallbackRef(morseCode);
|
|
9
|
+
const { className, ...restProps } = props;
|
|
10
|
+
const wrapperClassName = mergeClasses(morseCodeStyles.wrapper, className);
|
|
11
|
+
const morseCodeClassName = mergeClasses('fai-MorseCode', 'fai-MorseCodeFallback', morseCodeStyles.base);
|
|
12
|
+
return renderMorseCode(wrapperClassName, restProps, morseCodeClassName, targetRef);
|
|
16
13
|
};
|
|
17
|
-
//# sourceMappingURL=MorseCodeFallback.js.map
|
|
@@ -5,17 +5,11 @@ import { initializeMorseCodeCustomProperties, DEFAULT_BASE_URL, DEFAULT_FILE_URL
|
|
|
5
5
|
import { renderMorseCode } from '../shared/renderMorseCode';
|
|
6
6
|
import { useMorseCodeAnimationClassName } from './MorseCodeHoudini.styles';
|
|
7
7
|
initializeMorseCodeCustomProperties();
|
|
8
|
-
export const MorseCodeHoudini = ({
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
const morseCodeStyles = useMorseCodeStyles();
|
|
16
|
-
const animationClassName = useMorseCodeAnimationClassName();
|
|
17
|
-
const wrapperClassName = mergeClasses(morseCodeStyles.wrapper, className);
|
|
18
|
-
const morseCodeClassName = mergeClasses('fai-MorseCode', 'fai-MorseCodeHoudini', morseCodeStyles.base, animationClassName);
|
|
19
|
-
return renderMorseCode(wrapperClassName, restProps, morseCodeClassName);
|
|
8
|
+
export const MorseCodeHoudini = ({ baseUrl = DEFAULT_BASE_URL, fileName = DEFAULT_FILE_URL, className, ...restProps })=>{
|
|
9
|
+
useAddModule(baseUrl, fileName);
|
|
10
|
+
const morseCodeStyles = useMorseCodeStyles();
|
|
11
|
+
const animationClassName = useMorseCodeAnimationClassName();
|
|
12
|
+
const wrapperClassName = mergeClasses(morseCodeStyles.wrapper, className);
|
|
13
|
+
const morseCodeClassName = mergeClasses('fai-MorseCode', 'fai-MorseCodeHoudini', morseCodeStyles.base, animationClassName);
|
|
14
|
+
return renderMorseCode(wrapperClassName, restProps, morseCodeClassName);
|
|
20
15
|
};
|
|
21
|
-
//# sourceMappingURL=MorseCodeHoudini.js.map
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { makeResetStyles } from '@fluentui/react-components';
|
|
2
|
+
import { morseCodeAnimationTokens, morseCodeTokens } from '@fluentui-copilot/morse-code';
|
|
3
|
+
const sharedStyles = {
|
|
4
|
+
backgroundImage: morseCodeTokens.backgroundImage,
|
|
5
|
+
animationIterationCount: morseCodeTokens.morseCodeAnimationIterationCount,
|
|
6
|
+
animationDuration: morseCodeTokens.morseCodeAnimationDuration,
|
|
7
|
+
animationTimingFunction: morseCodeTokens.morseCodeAnimationTimingFunction
|
|
8
|
+
};
|
|
9
|
+
export const useMorseCodeAnimationClassName = makeResetStyles({
|
|
10
|
+
...sharedStyles,
|
|
11
|
+
animationName: [
|
|
12
|
+
morseCodeAnimationTokens.colorAnimation,
|
|
13
|
+
morseCodeAnimationTokens.dotsAndDashes
|
|
14
|
+
],
|
|
15
|
+
'@media (forced-colors: active)': {
|
|
16
|
+
...sharedStyles,
|
|
17
|
+
animationName: [
|
|
18
|
+
morseCodeAnimationTokens.colorHCAnimation,
|
|
19
|
+
morseCodeAnimationTokens.dotsAndDashes
|
|
20
|
+
]
|
|
21
|
+
}
|
|
22
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["MorseCodeHoudini.styles.ts"],"sourcesContent":["import { makeResetStyles } from '@fluentui/react-components';\nimport { morseCodeAnimationTokens, morseCodeTokens } from '@fluentui-copilot/morse-code';\n\nconst sharedStyles = {\n backgroundImage: morseCodeTokens.backgroundImage,\n animationIterationCount: morseCodeTokens.morseCodeAnimationIterationCount,\n animationDuration: morseCodeTokens.morseCodeAnimationDuration,\n animationTimingFunction: morseCodeTokens.morseCodeAnimationTimingFunction,\n};\n\nexport const useMorseCodeAnimationClassName = makeResetStyles({\n ...sharedStyles,\n animationName: [morseCodeAnimationTokens.colorAnimation, morseCodeAnimationTokens.dotsAndDashes],\n\n '@media (forced-colors: active)': {\n ...sharedStyles,\n animationName: [morseCodeAnimationTokens.colorHCAnimation, morseCodeAnimationTokens.dotsAndDashes],\n },\n});\n"],"names":["makeResetStyles","morseCodeAnimationTokens","morseCodeTokens","sharedStyles","backgroundImage","animationIterationCount","morseCodeAnimationIterationCount","animationDuration","morseCodeAnimationDuration","animationTimingFunction","morseCodeAnimationTimingFunction","useMorseCodeAnimationClassName","animationName","colorAnimation","dotsAndDashes","colorHCAnimation"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,eAAe,QAAQ,6BAA6B;AAC7D,SAASC,wBAAwB,EAAEC,eAAe,QAAQ,+BAA+B;AAEzF,MAAMC,eAAe;IACnBC,iBAAiBF,gBAAgBE,eAAe;IAChDC,yBAAyBH,gBAAgBI,gCAAgC;IACzEC,mBAAmBL,gBAAgBM,0BAA0B;IAC7DC,yBAAyBP,gBAAgBQ,gCAAgC;AAC3E;AAEA,OAAO,MAAMC,iCAAiCX,gBAAgB;IAC5D,GAAGG,YAAY;IACfS,eAAe;QAACX,yBAAyBY,cAAc;QAAEZ,yBAAyBa,aAAa;KAAC;IAEhG,kCAAkC;QAChC,GAAGX,YAAY;QACfS,eAAe;YAACX,yBAAyBc,gBAAgB;YAAEd,yBAAyBa,aAAa;SAAC;IACpG;AACF,GAAG"}
|
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
export const renderMorseCode = (wrapperClassName, wrapperProps, morseCodeClassName, targetRef)
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
2
|
+
export const renderMorseCode = (wrapperClassName, wrapperProps, morseCodeClassName, targetRef)=>{
|
|
3
|
+
return /*#__PURE__*/ React.createElement("div", {
|
|
4
|
+
className: wrapperClassName,
|
|
5
|
+
...wrapperProps
|
|
6
|
+
}, /*#__PURE__*/ React.createElement("div", {
|
|
7
|
+
ref: targetRef,
|
|
8
|
+
className: morseCodeClassName
|
|
9
|
+
}));
|
|
10
10
|
};
|
|
11
|
-
//# sourceMappingURL=renderMorseCode.js.map
|
|
@@ -3,10 +3,9 @@ import { hasHoudini } from '@fluentui-contrib/houdini-utils';
|
|
|
3
3
|
import { MorseCodeSmallFallback } from './MorseCodeSmallFallback';
|
|
4
4
|
import { MorseCodeSmallHoudini } from './MorseCodeSmallHoudini';
|
|
5
5
|
const houdiniAvailable = hasHoudini();
|
|
6
|
-
export const MorseCodeSmall = props
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
6
|
+
export const MorseCodeSmall = (props)=>{
|
|
7
|
+
if (houdiniAvailable) {
|
|
8
|
+
return /*#__PURE__*/ React.createElement(MorseCodeSmallHoudini, props);
|
|
9
|
+
}
|
|
10
|
+
return /*#__PURE__*/ React.createElement(MorseCodeSmallFallback, props);
|
|
11
11
|
};
|
|
12
|
-
//# sourceMappingURL=MorseCodeSmall.js.map
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { makeStyles } from '@fluentui/react-components';
|
|
2
|
+
import { morseCodeSmallTokens } from '@fluentui-copilot/morse-code';
|
|
3
|
+
export const useMorseCodeSmallStyles = makeStyles({
|
|
4
|
+
base: {
|
|
5
|
+
'@supports (aspect-ratio: 10 / 1)': {
|
|
6
|
+
aspectRatio: morseCodeSmallTokens.morseCodeAspectRatio
|
|
7
|
+
},
|
|
8
|
+
'@supports not (aspect-ratio: 10 / 1)': {
|
|
9
|
+
paddingTop: morseCodeSmallTokens.morseCodeAspectRatioFallbackPaddingTop
|
|
10
|
+
},
|
|
11
|
+
minHeight: '5px',
|
|
12
|
+
forcedColorAdjust: 'none',
|
|
13
|
+
'--fai-morse-code-color-stop-1': morseCodeSmallTokens.morseCodeColorStop1,
|
|
14
|
+
'--fai-morse-code-color-stop-2': morseCodeSmallTokens.morseCodeColorStop2,
|
|
15
|
+
'--fai-morse-code-color-stop-3': morseCodeSmallTokens.morseCodeColorStop3
|
|
16
|
+
},
|
|
17
|
+
wrapper: {
|
|
18
|
+
width: '100%',
|
|
19
|
+
height: '100%'
|
|
20
|
+
}
|
|
21
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["MorseCodeSmall.styles.ts"],"sourcesContent":["import { makeStyles } from '@fluentui/react-components';\nimport { morseCodeSmallTokens } from '@fluentui-copilot/morse-code';\n\nexport const useMorseCodeSmallStyles = makeStyles({\n base: {\n '@supports (aspect-ratio: 10 / 1)': {\n aspectRatio: morseCodeSmallTokens.morseCodeAspectRatio,\n },\n '@supports not (aspect-ratio: 10 / 1)': {\n paddingTop: morseCodeSmallTokens.morseCodeAspectRatioFallbackPaddingTop,\n },\n minHeight: '5px',\n forcedColorAdjust: 'none',\n '--fai-morse-code-color-stop-1': morseCodeSmallTokens.morseCodeColorStop1,\n '--fai-morse-code-color-stop-2': morseCodeSmallTokens.morseCodeColorStop2,\n '--fai-morse-code-color-stop-3': morseCodeSmallTokens.morseCodeColorStop3,\n },\n wrapper: {\n width: '100%',\n height: '100%',\n },\n});\n"],"names":["makeStyles","morseCodeSmallTokens","useMorseCodeSmallStyles","base","aspectRatio","morseCodeAspectRatio","paddingTop","morseCodeAspectRatioFallbackPaddingTop","minHeight","forcedColorAdjust","morseCodeColorStop1","morseCodeColorStop2","morseCodeColorStop3","wrapper","width","height"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,UAAU,QAAQ,6BAA6B;AACxD,SAASC,oBAAoB,QAAQ,+BAA+B;AAEpE,OAAO,MAAMC,0BAA0BF,WAAW;IAChDG,MAAM;QACJ,qCAAqC;YACnCC,aAAaH,qBAAqBI,oBAAoB;QACxD;QACA,yCAAyC;YACvCC,YAAYL,qBAAqBM,sCAAsC;QACzE;QACAC,WAAW;QACXC,mBAAmB;QACnB,iCAAiCR,qBAAqBS,mBAAmB;QACzE,iCAAiCT,qBAAqBU,mBAAmB;QACzE,iCAAiCV,qBAAqBW,mBAAmB;IAC3E;IACAC,SAAS;QACPC,OAAO;QACPC,QAAQ;IACV;AACF,GAAG"}
|
|
@@ -3,15 +3,11 @@ import { morseCodeSmall } from '@fluentui-copilot/morse-code';
|
|
|
3
3
|
import { useMorseCodeSmallStyles } from './MorseCodeSmall.styles';
|
|
4
4
|
import { useFallbackRef } from '../hooks/useFallbackRef';
|
|
5
5
|
import { renderMorseCode } from '../shared/renderMorseCode';
|
|
6
|
-
export const MorseCodeSmallFallback = props
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
className
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
const wrapperClassName = mergeClasses(morseCodeStyles.wrapper, className);
|
|
14
|
-
const morseCodeClassName = mergeClasses('fai-MorseCodeSmall', 'fai-MorseCodeSmallFallback', morseCodeStyles.base);
|
|
15
|
-
return renderMorseCode(wrapperClassName, restProps, morseCodeClassName, targetRef);
|
|
6
|
+
export const MorseCodeSmallFallback = (props)=>{
|
|
7
|
+
const morseCodeStyles = useMorseCodeSmallStyles();
|
|
8
|
+
const targetRef = useFallbackRef(morseCodeSmall);
|
|
9
|
+
const { className, ...restProps } = props;
|
|
10
|
+
const wrapperClassName = mergeClasses(morseCodeStyles.wrapper, className);
|
|
11
|
+
const morseCodeClassName = mergeClasses('fai-MorseCodeSmall', 'fai-MorseCodeSmallFallback', morseCodeStyles.base);
|
|
12
|
+
return renderMorseCode(wrapperClassName, restProps, morseCodeClassName, targetRef);
|
|
16
13
|
};
|
|
17
|
-
//# sourceMappingURL=MorseCodeSmallFallback.js.map
|
|
@@ -5,17 +5,11 @@ import { initializeMorseCodeSmallCustomProperties, DEFAULT_BASE_URL, DEFAULT_SMA
|
|
|
5
5
|
import { renderMorseCode } from '../shared/renderMorseCode';
|
|
6
6
|
import { useMorseCodeAnimationClassName } from './MorseCodeSmallHoudini.styles';
|
|
7
7
|
initializeMorseCodeSmallCustomProperties();
|
|
8
|
-
export const MorseCodeSmallHoudini = ({
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
const morseCodeSmallStyles = useMorseCodeSmallStyles();
|
|
16
|
-
const animationClassName = useMorseCodeAnimationClassName();
|
|
17
|
-
const wrapperClassName = mergeClasses(morseCodeSmallStyles.wrapper, className);
|
|
18
|
-
const morseCodeClassName = mergeClasses('fai-MorseCodeSmall', 'fai-MorseCodeSmallHoudini', morseCodeSmallStyles.base, animationClassName);
|
|
19
|
-
return renderMorseCode(wrapperClassName, restProps, morseCodeClassName);
|
|
8
|
+
export const MorseCodeSmallHoudini = ({ baseUrl = DEFAULT_BASE_URL, fileName = DEFAULT_SMALL_FILE_URL, className, ...restProps })=>{
|
|
9
|
+
useAddModule(baseUrl, fileName);
|
|
10
|
+
const morseCodeSmallStyles = useMorseCodeSmallStyles();
|
|
11
|
+
const animationClassName = useMorseCodeAnimationClassName();
|
|
12
|
+
const wrapperClassName = mergeClasses(morseCodeSmallStyles.wrapper, className);
|
|
13
|
+
const morseCodeClassName = mergeClasses('fai-MorseCodeSmall', 'fai-MorseCodeSmallHoudini', morseCodeSmallStyles.base, animationClassName);
|
|
14
|
+
return renderMorseCode(wrapperClassName, restProps, morseCodeClassName);
|
|
20
15
|
};
|
|
21
|
-
//# sourceMappingURL=MorseCodeSmallHoudini.js.map
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { makeResetStyles } from '@fluentui/react-components';
|
|
2
|
+
import { initializeMorseCodeSmallCustomProperties, morseCodeSmallAnimationTokens, morseCodeSmallTokens } from '@fluentui-copilot/morse-code';
|
|
3
|
+
initializeMorseCodeSmallCustomProperties();
|
|
4
|
+
const sharedStyles = {
|
|
5
|
+
backgroundImage: morseCodeSmallTokens.backgroundImage,
|
|
6
|
+
animationIterationCount: morseCodeSmallTokens.morseCodeAnimationIterationCount,
|
|
7
|
+
animationDuration: morseCodeSmallTokens.morseCodeAnimationDuration,
|
|
8
|
+
animationTimingFunction: morseCodeSmallTokens.morseCodeAnimationTimingFunction
|
|
9
|
+
};
|
|
10
|
+
export const useMorseCodeAnimationClassName = makeResetStyles({
|
|
11
|
+
...sharedStyles,
|
|
12
|
+
animationName: [
|
|
13
|
+
morseCodeSmallAnimationTokens.colorAnimation,
|
|
14
|
+
morseCodeSmallAnimationTokens.dotsAndDashes
|
|
15
|
+
],
|
|
16
|
+
'@media (forced-colors: active)': {
|
|
17
|
+
...sharedStyles,
|
|
18
|
+
animationName: [
|
|
19
|
+
morseCodeSmallAnimationTokens.colorHCAnimation,
|
|
20
|
+
morseCodeSmallAnimationTokens.dotsAndDashes
|
|
21
|
+
]
|
|
22
|
+
}
|
|
23
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["MorseCodeSmallHoudini.styles.ts"],"sourcesContent":["import { makeResetStyles } from '@fluentui/react-components';\n\nimport {\n initializeMorseCodeSmallCustomProperties,\n morseCodeSmallAnimationTokens,\n morseCodeSmallTokens,\n} from '@fluentui-copilot/morse-code';\n\ninitializeMorseCodeSmallCustomProperties();\n\nconst sharedStyles = {\n backgroundImage: morseCodeSmallTokens.backgroundImage,\n animationIterationCount: morseCodeSmallTokens.morseCodeAnimationIterationCount,\n animationDuration: morseCodeSmallTokens.morseCodeAnimationDuration,\n animationTimingFunction: morseCodeSmallTokens.morseCodeAnimationTimingFunction,\n};\n\nexport const useMorseCodeAnimationClassName = makeResetStyles({\n ...sharedStyles,\n animationName: [morseCodeSmallAnimationTokens.colorAnimation, morseCodeSmallAnimationTokens.dotsAndDashes],\n\n '@media (forced-colors: active)': {\n ...sharedStyles,\n animationName: [morseCodeSmallAnimationTokens.colorHCAnimation, morseCodeSmallAnimationTokens.dotsAndDashes],\n },\n});\n"],"names":["makeResetStyles","initializeMorseCodeSmallCustomProperties","morseCodeSmallAnimationTokens","morseCodeSmallTokens","sharedStyles","backgroundImage","animationIterationCount","morseCodeAnimationIterationCount","animationDuration","morseCodeAnimationDuration","animationTimingFunction","morseCodeAnimationTimingFunction","useMorseCodeAnimationClassName","animationName","colorAnimation","dotsAndDashes","colorHCAnimation"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,eAAe,QAAQ,6BAA6B;AAE7D,SACEC,wCAAwC,EACxCC,6BAA6B,EAC7BC,oBAAoB,QACf,+BAA+B;AAEtCF;AAEA,MAAMG,eAAe;IACnBC,iBAAiBF,qBAAqBE,eAAe;IACrDC,yBAAyBH,qBAAqBI,gCAAgC;IAC9EC,mBAAmBL,qBAAqBM,0BAA0B;IAClEC,yBAAyBP,qBAAqBQ,gCAAgC;AAChF;AAEA,OAAO,MAAMC,iCAAiCZ,gBAAgB;IAC5D,GAAGI,YAAY;IACfS,eAAe;QAACX,8BAA8BY,cAAc;QAAEZ,8BAA8Ba,aAAa;KAAC;IAE1G,kCAAkC;QAChC,GAAGX,YAAY;QACfS,eAAe;YAACX,8BAA8Bc,gBAAgB;YAAEd,8BAA8Ba,aAAa;SAAC;IAC9G;AACF,GAAG"}
|
package/lib/index.js
CHANGED
|
@@ -4,4 +4,3 @@ export { MorseCodeHoudini } from './components/large/MorseCodeHoudini';
|
|
|
4
4
|
export { MorseCodeSmall } from './components/small/MorseCodeSmall';
|
|
5
5
|
export { MorseCodeSmallFallback } from './components/small/MorseCodeSmallFallback';
|
|
6
6
|
export { MorseCodeSmallHoudini } from './components/small/MorseCodeSmallHoudini';
|
|
7
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useAddModule.ts"],"sourcesContent":["import * as React from 'react';\nimport { addModule } from '@fluentui-contrib/houdini-utils';\n\nconst initializedModules = {} as Record<string, boolean>;\n\nexport const useAddModule = (baseUrl: string, fileName: string): void => {\n React.useEffect(() => {\n const path = `${baseUrl}${fileName}`;\n if (!initializedModules[path]) {\n addModule(baseUrl, fileName)\n .then(() => {\n initializedModules[path] = true;\n })\n .catch(_err => {\n initializedModules[path] = false;\n });\n }\n }, [baseUrl, fileName]);\n};\n"],"names":["useAddModule","initializedModules","baseUrl","fileName","React","useEffect","path","addModule","catch"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAKaA;;;eAAAA;;;;iEALU;8BACG;AAE1B,MAAMC,qBAAqB,CAAC;AAErB,MAAMD,eAAe,CAACE,SAAiBC;
|
|
1
|
+
{"version":3,"sources":["useAddModule.ts"],"sourcesContent":["import * as React from 'react';\nimport { addModule } from '@fluentui-contrib/houdini-utils';\n\nconst initializedModules = {} as Record<string, boolean>;\n\nexport const useAddModule = (baseUrl: string, fileName: string): void => {\n React.useEffect(() => {\n const path = `${baseUrl}${fileName}`;\n if (!initializedModules[path]) {\n addModule(baseUrl, fileName)\n .then(() => {\n initializedModules[path] = true;\n })\n .catch(_err => {\n initializedModules[path] = false;\n });\n }\n }, [baseUrl, fileName]);\n};\n"],"names":["useAddModule","initializedModules","baseUrl","fileName","React","useEffect","path","addModule","then","catch","_err"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAKaA;;;eAAAA;;;;iEALU;8BACG;AAE1B,MAAMC,qBAAqB,CAAC;AAErB,MAAMD,eAAe,CAACE,SAAiBC;IAC5CC,OAAMC,SAAS,CAAC;QACd,MAAMC,OAAO,CAAC,EAAEJ,QAAQ,EAAEC,SAAS,CAAC;QACpC,IAAI,CAACF,kBAAkB,CAACK,KAAK,EAAE;YAC7BC,IAAAA,uBAAAA,EAAUL,SAASC,UAChBK,IAAI,CAAC;gBACJP,kBAAkB,CAACK,KAAK,GAAG;YAC7B,GACCG,KAAK,CAACC,CAAAA;gBACLT,kBAAkB,CAACK,KAAK,GAAG;YAC7B;QACJ;IACF,GAAG;QAACJ;QAASC;KAAS;AACxB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useFallbackRef.ts"],"sourcesContent":["import * as React from 'react';\nimport type { fallbackPaintAnimation } from '@fluentui-contrib/houdini-utils';\n// eslint-disable-next-line @typescript-eslint/no-empty-function\nconst ON_COMPLETE_NOOP = () => {};\n\nexport type FallbackAnim = (target: HTMLElement) => ReturnType<typeof fallbackPaintAnimation>;\n\nexport const useFallbackRef = (anim: FallbackAnim) => {\n const targetRef = React.useCallback(\n (node: HTMLElement | null) => {\n let animControls: ReturnType<typeof fallbackPaintAnimation> | undefined;\n\n if (node) {\n animControls = anim(node);\n animControls.play(ON_COMPLETE_NOOP);\n } else {\n if (animControls) {\n animControls.stop();\n animControls.cleanup();\n animControls = undefined;\n }\n }\n },\n [anim],\n );\n\n return targetRef;\n};\n"],"names":["useFallbackRef","ON_COMPLETE_NOOP","anim","targetRef","React","useCallback","animControls","
|
|
1
|
+
{"version":3,"sources":["useFallbackRef.ts"],"sourcesContent":["import * as React from 'react';\nimport type { fallbackPaintAnimation } from '@fluentui-contrib/houdini-utils';\n// eslint-disable-next-line @typescript-eslint/no-empty-function\nconst ON_COMPLETE_NOOP = () => {};\n\nexport type FallbackAnim = (target: HTMLElement) => ReturnType<typeof fallbackPaintAnimation>;\n\nexport const useFallbackRef = (anim: FallbackAnim) => {\n const targetRef = React.useCallback(\n (node: HTMLElement | null) => {\n let animControls: ReturnType<typeof fallbackPaintAnimation> | undefined;\n\n if (node) {\n animControls = anim(node);\n animControls.play(ON_COMPLETE_NOOP);\n } else {\n if (animControls) {\n animControls.stop();\n animControls.cleanup();\n animControls = undefined;\n }\n }\n },\n [anim],\n );\n\n return targetRef;\n};\n"],"names":["useFallbackRef","ON_COMPLETE_NOOP","anim","targetRef","React","useCallback","node","animControls","play","stop","cleanup","undefined"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAOaA;;;eAAAA;;;;iEAPU;AAEvB,gEAAgE;AAChE,MAAMC,mBAAmB,KAAO;AAIzB,MAAMD,iBAAiB,CAACE;IAC7B,MAAMC,YAAYC,OAAMC,WAAW,CACjC,CAACC;QACC,IAAIC;QAEJ,IAAID,MAAM;YACRC,eAAeL,KAAKI;YACpBC,aAAaC,IAAI,CAACP;QACpB,OAAO;YACL,IAAIM,cAAc;gBAChBA,aAAaE,IAAI;gBACjBF,aAAaG,OAAO;gBACpBH,eAAeI;YACjB;QACF;IACF,GACA;QAACT;KAAK;IAGR,OAAOC;AACT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["MorseCode.tsx"],"sourcesContent":["import * as React from 'react';\nimport { hasHoudini } from '@fluentui-contrib/houdini-utils';\nimport { MorseCodeFallback } from './MorseCodeFallback';\nimport { MorseCodeHoudini } from './MorseCodeHoudini';\n\nimport type { MorseCodeProps } from '../MorseCode.types';\n\nconst houdiniAvailable = hasHoudini();\n\nexport const MorseCode: React.FC<MorseCodeProps> = props => {\n if (houdiniAvailable) {\n return <MorseCodeHoudini {...props} />;\n }\n\n return <MorseCodeFallback {...props} />;\n};\n"],"names":["MorseCode","houdiniAvailable","hasHoudini","props","React","createElement","MorseCodeHoudini","MorseCodeFallback"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;8BACI;mCACO;kCACD;AAIjC,MAAMC,mBAAmBC,IAAAA,wBAAAA;AAElB,MAAMF,YAAsCG,CAAAA;
|
|
1
|
+
{"version":3,"sources":["MorseCode.tsx"],"sourcesContent":["import * as React from 'react';\nimport { hasHoudini } from '@fluentui-contrib/houdini-utils';\nimport { MorseCodeFallback } from './MorseCodeFallback';\nimport { MorseCodeHoudini } from './MorseCodeHoudini';\n\nimport type { MorseCodeProps } from '../MorseCode.types';\n\nconst houdiniAvailable = hasHoudini();\n\nexport const MorseCode: React.FC<MorseCodeProps> = props => {\n if (houdiniAvailable) {\n return <MorseCodeHoudini {...props} />;\n }\n\n return <MorseCodeFallback {...props} />;\n};\n"],"names":["MorseCode","houdiniAvailable","hasHoudini","props","React","createElement","MorseCodeHoudini","MorseCodeFallback"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;8BACI;mCACO;kCACD;AAIjC,MAAMC,mBAAmBC,IAAAA,wBAAAA;AAElB,MAAMF,YAAsCG,CAAAA;IACjD,IAAIF,kBAAkB;QACpB,OAAA,WAAA,GAAOG,OAAAC,aAAA,CAACC,kCAAAA,EAAqBH;IAC/B;IAEA,OAAA,WAAA,GAAOC,OAAAC,aAAA,CAACE,oCAAAA,EAAsBJ;AAChC"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "useMorseCodeStyles", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return useMorseCodeStyles;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _reactcomponents = require("@fluentui/react-components");
|
|
12
|
+
const _morsecode = require("@fluentui-copilot/morse-code");
|
|
13
|
+
const useMorseCodeStyles = (0, _reactcomponents.makeStyles)({
|
|
14
|
+
base: {
|
|
15
|
+
'@supports (aspect-ratio: 20 / 1)': {
|
|
16
|
+
aspectRatio: _morsecode.morseCodeTokens.morseCodeAspectRatio
|
|
17
|
+
},
|
|
18
|
+
'@supports not (aspect-ratio: 20 / 1)': {
|
|
19
|
+
paddingTop: _morsecode.morseCodeTokens.morseCodeAspectRatioFallbackPaddingTop
|
|
20
|
+
},
|
|
21
|
+
minHeight: '5px',
|
|
22
|
+
forcedColorAdjust: 'none',
|
|
23
|
+
'--fai-morse-code-color-stop-1': _morsecode.morseCodeTokens.morseCodeColorStop1,
|
|
24
|
+
'--fai-morse-code-color-stop-2': _morsecode.morseCodeTokens.morseCodeColorStop2,
|
|
25
|
+
'--fai-morse-code-color-stop-3': _morsecode.morseCodeTokens.morseCodeColorStop3
|
|
26
|
+
},
|
|
27
|
+
wrapper: {
|
|
28
|
+
width: '100%',
|
|
29
|
+
height: '100%'
|
|
30
|
+
}
|
|
31
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["MorseCode.styles.ts"],"sourcesContent":["import { makeStyles } from '@fluentui/react-components';\nimport { morseCodeTokens } from '@fluentui-copilot/morse-code';\n\nexport const useMorseCodeStyles = makeStyles({\n base: {\n '@supports (aspect-ratio: 20 / 1)': {\n aspectRatio: morseCodeTokens.morseCodeAspectRatio,\n },\n '@supports not (aspect-ratio: 20 / 1)': {\n paddingTop: morseCodeTokens.morseCodeAspectRatioFallbackPaddingTop,\n },\n minHeight: '5px',\n forcedColorAdjust: 'none',\n '--fai-morse-code-color-stop-1': morseCodeTokens.morseCodeColorStop1,\n '--fai-morse-code-color-stop-2': morseCodeTokens.morseCodeColorStop2,\n '--fai-morse-code-color-stop-3': morseCodeTokens.morseCodeColorStop3,\n },\n wrapper: {\n width: '100%',\n height: '100%',\n },\n});\n"],"names":["useMorseCodeStyles","makeStyles","base","aspectRatio","morseCodeTokens","morseCodeAspectRatio","paddingTop","morseCodeAspectRatioFallbackPaddingTop","minHeight","forcedColorAdjust","morseCodeColorStop1","morseCodeColorStop2","morseCodeColorStop3","wrapper","width","height"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAGaA;;;eAAAA;;;iCAHc;2BACK;AAEzB,MAAMA,qBAAqBC,IAAAA,2BAAAA,EAAW;IAC3CC,MAAM;QACJ,qCAAqC;YACnCC,aAAaC,0BAAAA,CAAgBC,oBAAoB;QACnD;QACA,yCAAyC;YACvCC,YAAYF,0BAAAA,CAAgBG,sCAAsC;QACpE;QACAC,WAAW;QACXC,mBAAmB;QACnB,iCAAiCL,0BAAAA,CAAgBM,mBAAmB;QACpE,iCAAiCN,0BAAAA,CAAgBO,mBAAmB;QACpE,iCAAiCP,0BAAAA,CAAgBQ,mBAAmB;IACtE;IACAC,SAAS;QACPC,OAAO;QACPC,QAAQ;IACV;AACF"}
|
|
@@ -20,4 +20,4 @@ const MorseCodeFallback = (props)=>{
|
|
|
20
20
|
const wrapperClassName = (0, _reactcomponents.mergeClasses)(morseCodeStyles.wrapper, className);
|
|
21
21
|
const morseCodeClassName = (0, _reactcomponents.mergeClasses)('fai-MorseCode', 'fai-MorseCodeFallback', morseCodeStyles.base);
|
|
22
22
|
return (0, _renderMorseCode.renderMorseCode)(wrapperClassName, restProps, morseCodeClassName, targetRef);
|
|
23
|
-
};
|
|
23
|
+
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["MorseCodeFallback.tsx"],"sourcesContent":["import { mergeClasses } from '@fluentui/react-components';\nimport { morseCode } from '@fluentui-copilot/morse-code';\nimport { useMorseCodeStyles } from './MorseCode.styles';\n\nimport type { MorseCodeProps } from '../MorseCode.types';\nimport { useFallbackRef } from '../hooks/useFallbackRef';\nimport { renderMorseCode } from '../shared/renderMorseCode';\n\nexport const MorseCodeFallback: React.FC<MorseCodeProps> = props => {\n const morseCodeStyles = useMorseCodeStyles();\n\n const targetRef = useFallbackRef(morseCode);\n\n const { className, ...restProps } = props;\n const wrapperClassName = mergeClasses(morseCodeStyles.wrapper, className);\n const morseCodeClassName = mergeClasses('fai-MorseCode', 'fai-MorseCodeFallback', morseCodeStyles.base);\n\n return renderMorseCode(wrapperClassName, restProps, morseCodeClassName, targetRef);\n};\n"],"names":["MorseCodeFallback","props","morseCodeStyles","useMorseCodeStyles","targetRef","useFallbackRef","morseCode","className","
|
|
1
|
+
{"version":3,"sources":["MorseCodeFallback.tsx"],"sourcesContent":["import { mergeClasses } from '@fluentui/react-components';\nimport { morseCode } from '@fluentui-copilot/morse-code';\nimport { useMorseCodeStyles } from './MorseCode.styles';\n\nimport type { MorseCodeProps } from '../MorseCode.types';\nimport { useFallbackRef } from '../hooks/useFallbackRef';\nimport { renderMorseCode } from '../shared/renderMorseCode';\n\nexport const MorseCodeFallback: React.FC<MorseCodeProps> = props => {\n const morseCodeStyles = useMorseCodeStyles();\n\n const targetRef = useFallbackRef(morseCode);\n\n const { className, ...restProps } = props;\n const wrapperClassName = mergeClasses(morseCodeStyles.wrapper, className);\n const morseCodeClassName = mergeClasses('fai-MorseCode', 'fai-MorseCodeFallback', morseCodeStyles.base);\n\n return renderMorseCode(wrapperClassName, restProps, morseCodeClassName, targetRef);\n};\n"],"names":["MorseCodeFallback","props","morseCodeStyles","useMorseCodeStyles","targetRef","useFallbackRef","morseCode","className","restProps","wrapperClassName","mergeClasses","wrapper","morseCodeClassName","base","renderMorseCode"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAQaA;;;eAAAA;;;iCARgB;2BACH;iCACS;gCAGJ;iCACC;AAEzB,MAAMA,oBAA8CC,CAAAA;IACzD,MAAMC,kBAAkBC,IAAAA,mCAAAA;IAExB,MAAMC,YAAYC,IAAAA,8BAAAA,EAAeC,oBAAAA;IAEjC,MAAM,EAAEC,SAAS,EAAE,GAAGC,WAAW,GAAGP;IACpC,MAAMQ,mBAAmBC,IAAAA,6BAAAA,EAAaR,gBAAgBS,OAAO,EAAEJ;IAC/D,MAAMK,qBAAqBF,IAAAA,6BAAAA,EAAa,iBAAiB,yBAAyBR,gBAAgBW,IAAI;IAEtG,OAAOC,IAAAA,gCAAAA,EAAgBL,kBAAkBD,WAAWI,oBAAoBR;AAC1E"}
|
|
@@ -22,4 +22,4 @@ const MorseCodeHoudini = ({ baseUrl = _morsecode.DEFAULT_BASE_URL, fileName = _m
|
|
|
22
22
|
const wrapperClassName = (0, _reactcomponents.mergeClasses)(morseCodeStyles.wrapper, className);
|
|
23
23
|
const morseCodeClassName = (0, _reactcomponents.mergeClasses)('fai-MorseCode', 'fai-MorseCodeHoudini', morseCodeStyles.base, animationClassName);
|
|
24
24
|
return (0, _renderMorseCode.renderMorseCode)(wrapperClassName, restProps, morseCodeClassName);
|
|
25
|
-
};
|
|
25
|
+
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["MorseCodeHoudini.tsx"],"sourcesContent":["import { mergeClasses } from '@fluentui/react-components';\nimport { useAddModule } from '../hooks/useAddModule';\nimport { useMorseCodeStyles } from './MorseCode.styles';\n\nimport { initializeMorseCodeCustomProperties, DEFAULT_BASE_URL, DEFAULT_FILE_URL } from '@fluentui-copilot/morse-code';\n\nimport type { MorseCodeProps } from '../MorseCode.types';\nimport { renderMorseCode } from '../shared/renderMorseCode';\nimport { useMorseCodeAnimationClassName } from './MorseCodeHoudini.styles';\n\ninitializeMorseCodeCustomProperties();\n\nexport const MorseCodeHoudini: React.FC<MorseCodeProps> = ({\n baseUrl = DEFAULT_BASE_URL,\n fileName = DEFAULT_FILE_URL,\n className,\n ...restProps\n}) => {\n useAddModule(baseUrl, fileName);\n\n const morseCodeStyles = useMorseCodeStyles();\n const animationClassName = useMorseCodeAnimationClassName();\n const wrapperClassName = mergeClasses(morseCodeStyles.wrapper, className);\n const morseCodeClassName = mergeClasses(\n 'fai-MorseCode',\n 'fai-MorseCodeHoudini',\n morseCodeStyles.base,\n animationClassName,\n );\n\n return renderMorseCode(wrapperClassName, restProps, morseCodeClassName);\n};\n"],"names":["MorseCodeHoudini","initializeMorseCodeCustomProperties","
|
|
1
|
+
{"version":3,"sources":["MorseCodeHoudini.tsx"],"sourcesContent":["import { mergeClasses } from '@fluentui/react-components';\nimport { useAddModule } from '../hooks/useAddModule';\nimport { useMorseCodeStyles } from './MorseCode.styles';\n\nimport { initializeMorseCodeCustomProperties, DEFAULT_BASE_URL, DEFAULT_FILE_URL } from '@fluentui-copilot/morse-code';\n\nimport type { MorseCodeProps } from '../MorseCode.types';\nimport { renderMorseCode } from '../shared/renderMorseCode';\nimport { useMorseCodeAnimationClassName } from './MorseCodeHoudini.styles';\n\ninitializeMorseCodeCustomProperties();\n\nexport const MorseCodeHoudini: React.FC<MorseCodeProps> = ({\n baseUrl = DEFAULT_BASE_URL,\n fileName = DEFAULT_FILE_URL,\n className,\n ...restProps\n}) => {\n useAddModule(baseUrl, fileName);\n\n const morseCodeStyles = useMorseCodeStyles();\n const animationClassName = useMorseCodeAnimationClassName();\n const wrapperClassName = mergeClasses(morseCodeStyles.wrapper, className);\n const morseCodeClassName = mergeClasses(\n 'fai-MorseCode',\n 'fai-MorseCodeHoudini',\n morseCodeStyles.base,\n animationClassName,\n );\n\n return renderMorseCode(wrapperClassName, restProps, morseCodeClassName);\n};\n"],"names":["MorseCodeHoudini","initializeMorseCodeCustomProperties","baseUrl","DEFAULT_BASE_URL","fileName","DEFAULT_FILE_URL","className","restProps","useAddModule","morseCodeStyles","useMorseCodeStyles","animationClassName","useMorseCodeAnimationClassName","wrapperClassName","mergeClasses","wrapper","morseCodeClassName","base","renderMorseCode"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAYaA;;;eAAAA;;;iCAZgB;8BACA;iCACM;2BAEqD;iCAGxD;wCACe;AAE/CC,IAAAA,8CAAAA;AAEO,MAAMD,mBAA6C,CAAC,EACzDE,UAAUC,2BAAgB,EAC1BC,WAAWC,2BAAgB,EAC3BC,SAAS,EACT,GAAGC,WACJ;IACCC,IAAAA,0BAAAA,EAAaN,SAASE;IAEtB,MAAMK,kBAAkBC,IAAAA,mCAAAA;IACxB,MAAMC,qBAAqBC,IAAAA,sDAAAA;IAC3B,MAAMC,mBAAmBC,IAAAA,6BAAAA,EAAaL,gBAAgBM,OAAO,EAAET;IAC/D,MAAMU,qBAAqBF,IAAAA,6BAAAA,EACzB,iBACA,wBACAL,gBAAgBQ,IAAI,EACpBN;IAGF,OAAOO,IAAAA,gCAAAA,EAAgBL,kBAAkBN,WAAWS;AACtD"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "useMorseCodeAnimationClassName", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return useMorseCodeAnimationClassName;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _reactcomponents = require("@fluentui/react-components");
|
|
12
|
+
const _morsecode = require("@fluentui-copilot/morse-code");
|
|
13
|
+
const sharedStyles = {
|
|
14
|
+
backgroundImage: _morsecode.morseCodeTokens.backgroundImage,
|
|
15
|
+
animationIterationCount: _morsecode.morseCodeTokens.morseCodeAnimationIterationCount,
|
|
16
|
+
animationDuration: _morsecode.morseCodeTokens.morseCodeAnimationDuration,
|
|
17
|
+
animationTimingFunction: _morsecode.morseCodeTokens.morseCodeAnimationTimingFunction
|
|
18
|
+
};
|
|
19
|
+
const useMorseCodeAnimationClassName = (0, _reactcomponents.makeResetStyles)({
|
|
20
|
+
...sharedStyles,
|
|
21
|
+
animationName: [
|
|
22
|
+
_morsecode.morseCodeAnimationTokens.colorAnimation,
|
|
23
|
+
_morsecode.morseCodeAnimationTokens.dotsAndDashes
|
|
24
|
+
],
|
|
25
|
+
'@media (forced-colors: active)': {
|
|
26
|
+
...sharedStyles,
|
|
27
|
+
animationName: [
|
|
28
|
+
_morsecode.morseCodeAnimationTokens.colorHCAnimation,
|
|
29
|
+
_morsecode.morseCodeAnimationTokens.dotsAndDashes
|
|
30
|
+
]
|
|
31
|
+
}
|
|
32
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["MorseCodeHoudini.styles.ts"],"sourcesContent":["import { makeResetStyles } from '@fluentui/react-components';\nimport { morseCodeAnimationTokens, morseCodeTokens } from '@fluentui-copilot/morse-code';\n\nconst sharedStyles = {\n backgroundImage: morseCodeTokens.backgroundImage,\n animationIterationCount: morseCodeTokens.morseCodeAnimationIterationCount,\n animationDuration: morseCodeTokens.morseCodeAnimationDuration,\n animationTimingFunction: morseCodeTokens.morseCodeAnimationTimingFunction,\n};\n\nexport const useMorseCodeAnimationClassName = makeResetStyles({\n ...sharedStyles,\n animationName: [morseCodeAnimationTokens.colorAnimation, morseCodeAnimationTokens.dotsAndDashes],\n\n '@media (forced-colors: active)': {\n ...sharedStyles,\n animationName: [morseCodeAnimationTokens.colorHCAnimation, morseCodeAnimationTokens.dotsAndDashes],\n },\n});\n"],"names":["useMorseCodeAnimationClassName","sharedStyles","backgroundImage","morseCodeTokens","animationIterationCount","morseCodeAnimationIterationCount","animationDuration","morseCodeAnimationDuration","animationTimingFunction","morseCodeAnimationTimingFunction","makeResetStyles","animationName","morseCodeAnimationTokens","colorAnimation","dotsAndDashes","colorHCAnimation"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAUaA;;;eAAAA;;;iCAVmB;2BAC0B;AAE1D,MAAMC,eAAe;IACnBC,iBAAiBC,0BAAAA,CAAgBD,eAAe;IAChDE,yBAAyBD,0BAAAA,CAAgBE,gCAAgC;IACzEC,mBAAmBH,0BAAAA,CAAgBI,0BAA0B;IAC7DC,yBAAyBL,0BAAAA,CAAgBM,gCAAgC;AAC3E;AAEO,MAAMT,iCAAiCU,IAAAA,gCAAAA,EAAgB;IAC5D,GAAGT,YAAY;IACfU,eAAe;QAACC,mCAAAA,CAAyBC,cAAc;QAAED,mCAAAA,CAAyBE,aAAa;KAAC;IAEhG,kCAAkC;QAChC,GAAGb,YAAY;QACfU,eAAe;YAACC,mCAAAA,CAAyBG,gBAAgB;YAAEH,mCAAAA,CAAyBE,aAAa;SAAC;IACpG;AACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["renderMorseCode.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport const renderMorseCode = (\n wrapperClassName: string,\n wrapperProps: React.HTMLAttributes<HTMLDivElement>,\n morseCodeClassName: string,\n targetRef?: (node: HTMLElement | null) => void,\n) => {\n return (\n <div className={wrapperClassName} {...wrapperProps}>\n <div ref={targetRef} className={morseCodeClassName} />\n </div>\n );\n};\n"],"names":["renderMorseCode","wrapperClassName","wrapperProps","morseCodeClassName","targetRef","React","createElement","div","className","ref"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAEaA;;;eAAAA;;;;iEAFU;AAEhB,MAAMA,kBAAkB,CAC7BC,kBACAC,cACAC,oBACAC;
|
|
1
|
+
{"version":3,"sources":["renderMorseCode.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport const renderMorseCode = (\n wrapperClassName: string,\n wrapperProps: React.HTMLAttributes<HTMLDivElement>,\n morseCodeClassName: string,\n targetRef?: (node: HTMLElement | null) => void,\n) => {\n return (\n <div className={wrapperClassName} {...wrapperProps}>\n <div ref={targetRef} className={morseCodeClassName} />\n </div>\n );\n};\n"],"names":["renderMorseCode","wrapperClassName","wrapperProps","morseCodeClassName","targetRef","React","createElement","div","className","ref"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAEaA;;;eAAAA;;;;iEAFU;AAEhB,MAAMA,kBAAkB,CAC7BC,kBACAC,cACAC,oBACAC;IAEA,OAAA,WAAA,GACEC,OAAAC,aAAA,CAACC,OAAAA;QAAIC,WAAWP;QAAmB,GAAGC,YAAY;qBAChDG,OAAAC,aAAA,CAACC,OAAAA;QAAIE,KAAKL;QAAWI,WAAWL;;AAGtC"}
|
|
@@ -19,4 +19,4 @@ const MorseCodeSmall = (props)=>{
|
|
|
19
19
|
return /*#__PURE__*/ _react.createElement(_MorseCodeSmallHoudini.MorseCodeSmallHoudini, props);
|
|
20
20
|
}
|
|
21
21
|
return /*#__PURE__*/ _react.createElement(_MorseCodeSmallFallback.MorseCodeSmallFallback, props);
|
|
22
|
-
};
|
|
22
|
+
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["MorseCodeSmall.tsx"],"sourcesContent":["import * as React from 'react';\nimport { hasHoudini } from '@fluentui-contrib/houdini-utils';\nimport { MorseCodeSmallFallback } from './MorseCodeSmallFallback';\nimport { MorseCodeSmallHoudini } from './MorseCodeSmallHoudini';\n\nimport type { MorseCodeProps } from '../MorseCode.types';\n\nconst houdiniAvailable = hasHoudini();\n\nexport const MorseCodeSmall: React.FC<MorseCodeProps> = props => {\n if (houdiniAvailable) {\n return <MorseCodeSmallHoudini {...props} />;\n }\n\n return <MorseCodeSmallFallback {...props} />;\n};\n"],"names":["MorseCodeSmall","houdiniAvailable","hasHoudini","props","React","createElement","MorseCodeSmallHoudini","MorseCodeSmallFallback"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;8BACI;wCACY;uCACD;AAItC,MAAMC,mBAAmBC,IAAAA,wBAAAA;AAElB,MAAMF,iBAA2CG,CAAAA;
|
|
1
|
+
{"version":3,"sources":["MorseCodeSmall.tsx"],"sourcesContent":["import * as React from 'react';\nimport { hasHoudini } from '@fluentui-contrib/houdini-utils';\nimport { MorseCodeSmallFallback } from './MorseCodeSmallFallback';\nimport { MorseCodeSmallHoudini } from './MorseCodeSmallHoudini';\n\nimport type { MorseCodeProps } from '../MorseCode.types';\n\nconst houdiniAvailable = hasHoudini();\n\nexport const MorseCodeSmall: React.FC<MorseCodeProps> = props => {\n if (houdiniAvailable) {\n return <MorseCodeSmallHoudini {...props} />;\n }\n\n return <MorseCodeSmallFallback {...props} />;\n};\n"],"names":["MorseCodeSmall","houdiniAvailable","hasHoudini","props","React","createElement","MorseCodeSmallHoudini","MorseCodeSmallFallback"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;8BACI;wCACY;uCACD;AAItC,MAAMC,mBAAmBC,IAAAA,wBAAAA;AAElB,MAAMF,iBAA2CG,CAAAA;IACtD,IAAIF,kBAAkB;QACpB,OAAA,WAAA,GAAOG,OAAAC,aAAA,CAACC,4CAAAA,EAA0BH;IACpC;IAEA,OAAA,WAAA,GAAOC,OAAAC,aAAA,CAACE,8CAAAA,EAA2BJ;AACrC"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "useMorseCodeSmallStyles", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return useMorseCodeSmallStyles;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _reactcomponents = require("@fluentui/react-components");
|
|
12
|
+
const _morsecode = require("@fluentui-copilot/morse-code");
|
|
13
|
+
const useMorseCodeSmallStyles = (0, _reactcomponents.makeStyles)({
|
|
14
|
+
base: {
|
|
15
|
+
'@supports (aspect-ratio: 10 / 1)': {
|
|
16
|
+
aspectRatio: _morsecode.morseCodeSmallTokens.morseCodeAspectRatio
|
|
17
|
+
},
|
|
18
|
+
'@supports not (aspect-ratio: 10 / 1)': {
|
|
19
|
+
paddingTop: _morsecode.morseCodeSmallTokens.morseCodeAspectRatioFallbackPaddingTop
|
|
20
|
+
},
|
|
21
|
+
minHeight: '5px',
|
|
22
|
+
forcedColorAdjust: 'none',
|
|
23
|
+
'--fai-morse-code-color-stop-1': _morsecode.morseCodeSmallTokens.morseCodeColorStop1,
|
|
24
|
+
'--fai-morse-code-color-stop-2': _morsecode.morseCodeSmallTokens.morseCodeColorStop2,
|
|
25
|
+
'--fai-morse-code-color-stop-3': _morsecode.morseCodeSmallTokens.morseCodeColorStop3
|
|
26
|
+
},
|
|
27
|
+
wrapper: {
|
|
28
|
+
width: '100%',
|
|
29
|
+
height: '100%'
|
|
30
|
+
}
|
|
31
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["MorseCodeSmall.styles.ts"],"sourcesContent":["import { makeStyles } from '@fluentui/react-components';\nimport { morseCodeSmallTokens } from '@fluentui-copilot/morse-code';\n\nexport const useMorseCodeSmallStyles = makeStyles({\n base: {\n '@supports (aspect-ratio: 10 / 1)': {\n aspectRatio: morseCodeSmallTokens.morseCodeAspectRatio,\n },\n '@supports not (aspect-ratio: 10 / 1)': {\n paddingTop: morseCodeSmallTokens.morseCodeAspectRatioFallbackPaddingTop,\n },\n minHeight: '5px',\n forcedColorAdjust: 'none',\n '--fai-morse-code-color-stop-1': morseCodeSmallTokens.morseCodeColorStop1,\n '--fai-morse-code-color-stop-2': morseCodeSmallTokens.morseCodeColorStop2,\n '--fai-morse-code-color-stop-3': morseCodeSmallTokens.morseCodeColorStop3,\n },\n wrapper: {\n width: '100%',\n height: '100%',\n },\n});\n"],"names":["useMorseCodeSmallStyles","makeStyles","base","aspectRatio","morseCodeSmallTokens","morseCodeAspectRatio","paddingTop","morseCodeAspectRatioFallbackPaddingTop","minHeight","forcedColorAdjust","morseCodeColorStop1","morseCodeColorStop2","morseCodeColorStop3","wrapper","width","height"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAGaA;;;eAAAA;;;iCAHc;2BACU;AAE9B,MAAMA,0BAA0BC,IAAAA,2BAAAA,EAAW;IAChDC,MAAM;QACJ,qCAAqC;YACnCC,aAAaC,+BAAAA,CAAqBC,oBAAoB;QACxD;QACA,yCAAyC;YACvCC,YAAYF,+BAAAA,CAAqBG,sCAAsC;QACzE;QACAC,WAAW;QACXC,mBAAmB;QACnB,iCAAiCL,+BAAAA,CAAqBM,mBAAmB;QACzE,iCAAiCN,+BAAAA,CAAqBO,mBAAmB;QACzE,iCAAiCP,+BAAAA,CAAqBQ,mBAAmB;IAC3E;IACAC,SAAS;QACPC,OAAO;QACPC,QAAQ;IACV;AACF"}
|
|
@@ -20,4 +20,4 @@ const MorseCodeSmallFallback = (props)=>{
|
|
|
20
20
|
const wrapperClassName = (0, _reactcomponents.mergeClasses)(morseCodeStyles.wrapper, className);
|
|
21
21
|
const morseCodeClassName = (0, _reactcomponents.mergeClasses)('fai-MorseCodeSmall', 'fai-MorseCodeSmallFallback', morseCodeStyles.base);
|
|
22
22
|
return (0, _renderMorseCode.renderMorseCode)(wrapperClassName, restProps, morseCodeClassName, targetRef);
|
|
23
|
-
};
|
|
23
|
+
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["MorseCodeSmallFallback.tsx"],"sourcesContent":["import { mergeClasses } from '@fluentui/react-components';\nimport { morseCodeSmall } from '@fluentui-copilot/morse-code';\nimport { useMorseCodeSmallStyles } from './MorseCodeSmall.styles';\n\nimport type { MorseCodeProps } from '../MorseCode.types';\nimport { useFallbackRef } from '../hooks/useFallbackRef';\nimport { renderMorseCode } from '../shared/renderMorseCode';\n\nexport const MorseCodeSmallFallback: React.FC<MorseCodeProps> = props => {\n const morseCodeStyles = useMorseCodeSmallStyles();\n\n const targetRef = useFallbackRef(morseCodeSmall);\n const { className, ...restProps } = props;\n const wrapperClassName = mergeClasses(morseCodeStyles.wrapper, className);\n const morseCodeClassName = mergeClasses('fai-MorseCodeSmall', 'fai-MorseCodeSmallFallback', morseCodeStyles.base);\n\n return renderMorseCode(wrapperClassName, restProps, morseCodeClassName, targetRef);\n};\n"],"names":["MorseCodeSmallFallback","props","morseCodeStyles","useMorseCodeSmallStyles","targetRef","useFallbackRef","morseCodeSmall","className","
|
|
1
|
+
{"version":3,"sources":["MorseCodeSmallFallback.tsx"],"sourcesContent":["import { mergeClasses } from '@fluentui/react-components';\nimport { morseCodeSmall } from '@fluentui-copilot/morse-code';\nimport { useMorseCodeSmallStyles } from './MorseCodeSmall.styles';\n\nimport type { MorseCodeProps } from '../MorseCode.types';\nimport { useFallbackRef } from '../hooks/useFallbackRef';\nimport { renderMorseCode } from '../shared/renderMorseCode';\n\nexport const MorseCodeSmallFallback: React.FC<MorseCodeProps> = props => {\n const morseCodeStyles = useMorseCodeSmallStyles();\n\n const targetRef = useFallbackRef(morseCodeSmall);\n const { className, ...restProps } = props;\n const wrapperClassName = mergeClasses(morseCodeStyles.wrapper, className);\n const morseCodeClassName = mergeClasses('fai-MorseCodeSmall', 'fai-MorseCodeSmallFallback', morseCodeStyles.base);\n\n return renderMorseCode(wrapperClassName, restProps, morseCodeClassName, targetRef);\n};\n"],"names":["MorseCodeSmallFallback","props","morseCodeStyles","useMorseCodeSmallStyles","targetRef","useFallbackRef","morseCodeSmall","className","restProps","wrapperClassName","mergeClasses","wrapper","morseCodeClassName","base","renderMorseCode"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAQaA;;;eAAAA;;;iCARgB;2BACE;sCACS;gCAGT;iCACC;AAEzB,MAAMA,yBAAmDC,CAAAA;IAC9D,MAAMC,kBAAkBC,IAAAA,6CAAAA;IAExB,MAAMC,YAAYC,IAAAA,8BAAAA,EAAeC,yBAAAA;IACjC,MAAM,EAAEC,SAAS,EAAE,GAAGC,WAAW,GAAGP;IACpC,MAAMQ,mBAAmBC,IAAAA,6BAAAA,EAAaR,gBAAgBS,OAAO,EAAEJ;IAC/D,MAAMK,qBAAqBF,IAAAA,6BAAAA,EAAa,sBAAsB,8BAA8BR,gBAAgBW,IAAI;IAEhH,OAAOC,IAAAA,gCAAAA,EAAgBL,kBAAkBD,WAAWI,oBAAoBR;AAC1E"}
|
|
@@ -22,4 +22,4 @@ const MorseCodeSmallHoudini = ({ baseUrl = _morsecode.DEFAULT_BASE_URL, fileName
|
|
|
22
22
|
const wrapperClassName = (0, _reactcomponents.mergeClasses)(morseCodeSmallStyles.wrapper, className);
|
|
23
23
|
const morseCodeClassName = (0, _reactcomponents.mergeClasses)('fai-MorseCodeSmall', 'fai-MorseCodeSmallHoudini', morseCodeSmallStyles.base, animationClassName);
|
|
24
24
|
return (0, _renderMorseCode.renderMorseCode)(wrapperClassName, restProps, morseCodeClassName);
|
|
25
|
-
};
|
|
25
|
+
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["MorseCodeSmallHoudini.tsx"],"sourcesContent":["import { mergeClasses } from '@fluentui/react-components';\nimport { useAddModule } from '../hooks/useAddModule';\nimport { useMorseCodeSmallStyles } from './MorseCodeSmall.styles';\n\nimport {\n initializeMorseCodeSmallCustomProperties,\n DEFAULT_BASE_URL,\n DEFAULT_SMALL_FILE_URL,\n} from '@fluentui-copilot/morse-code';\n\nimport type { MorseCodeProps } from '../MorseCode.types';\nimport { renderMorseCode } from '../shared/renderMorseCode';\nimport { useMorseCodeAnimationClassName } from './MorseCodeSmallHoudini.styles';\n\ninitializeMorseCodeSmallCustomProperties();\n\nexport const MorseCodeSmallHoudini: React.FC<MorseCodeProps> = ({\n baseUrl = DEFAULT_BASE_URL,\n fileName = DEFAULT_SMALL_FILE_URL,\n className,\n ...restProps\n}) => {\n useAddModule(baseUrl, fileName);\n\n const morseCodeSmallStyles = useMorseCodeSmallStyles();\n const animationClassName = useMorseCodeAnimationClassName();\n const wrapperClassName = mergeClasses(morseCodeSmallStyles.wrapper, className);\n const morseCodeClassName = mergeClasses(\n 'fai-MorseCodeSmall',\n 'fai-MorseCodeSmallHoudini',\n morseCodeSmallStyles.base,\n animationClassName,\n );\n\n return renderMorseCode(wrapperClassName, restProps, morseCodeClassName);\n};\n"],"names":["MorseCodeSmallHoudini","initializeMorseCodeSmallCustomProperties","
|
|
1
|
+
{"version":3,"sources":["MorseCodeSmallHoudini.tsx"],"sourcesContent":["import { mergeClasses } from '@fluentui/react-components';\nimport { useAddModule } from '../hooks/useAddModule';\nimport { useMorseCodeSmallStyles } from './MorseCodeSmall.styles';\n\nimport {\n initializeMorseCodeSmallCustomProperties,\n DEFAULT_BASE_URL,\n DEFAULT_SMALL_FILE_URL,\n} from '@fluentui-copilot/morse-code';\n\nimport type { MorseCodeProps } from '../MorseCode.types';\nimport { renderMorseCode } from '../shared/renderMorseCode';\nimport { useMorseCodeAnimationClassName } from './MorseCodeSmallHoudini.styles';\n\ninitializeMorseCodeSmallCustomProperties();\n\nexport const MorseCodeSmallHoudini: React.FC<MorseCodeProps> = ({\n baseUrl = DEFAULT_BASE_URL,\n fileName = DEFAULT_SMALL_FILE_URL,\n className,\n ...restProps\n}) => {\n useAddModule(baseUrl, fileName);\n\n const morseCodeSmallStyles = useMorseCodeSmallStyles();\n const animationClassName = useMorseCodeAnimationClassName();\n const wrapperClassName = mergeClasses(morseCodeSmallStyles.wrapper, className);\n const morseCodeClassName = mergeClasses(\n 'fai-MorseCodeSmall',\n 'fai-MorseCodeSmallHoudini',\n morseCodeSmallStyles.base,\n animationClassName,\n );\n\n return renderMorseCode(wrapperClassName, restProps, morseCodeClassName);\n};\n"],"names":["MorseCodeSmallHoudini","initializeMorseCodeSmallCustomProperties","baseUrl","DEFAULT_BASE_URL","fileName","DEFAULT_SMALL_FILE_URL","className","restProps","useAddModule","morseCodeSmallStyles","useMorseCodeSmallStyles","animationClassName","useMorseCodeAnimationClassName","wrapperClassName","mergeClasses","wrapper","morseCodeClassName","base","renderMorseCode"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAgBaA;;;eAAAA;;;iCAhBgB;8BACA;sCACW;2BAMjC;iCAGyB;6CACe;AAE/CC,IAAAA,mDAAAA;AAEO,MAAMD,wBAAkD,CAAC,EAC9DE,UAAUC,2BAAgB,EAC1BC,WAAWC,iCAAsB,EACjCC,SAAS,EACT,GAAGC,WACJ;IACCC,IAAAA,0BAAAA,EAAaN,SAASE;IAEtB,MAAMK,uBAAuBC,IAAAA,6CAAAA;IAC7B,MAAMC,qBAAqBC,IAAAA,2DAAAA;IAC3B,MAAMC,mBAAmBC,IAAAA,6BAAAA,EAAaL,qBAAqBM,OAAO,EAAET;IACpE,MAAMU,qBAAqBF,IAAAA,6BAAAA,EACzB,sBACA,6BACAL,qBAAqBQ,IAAI,EACzBN;IAGF,OAAOO,IAAAA,gCAAAA,EAAgBL,kBAAkBN,WAAWS;AACtD"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "useMorseCodeAnimationClassName", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return useMorseCodeAnimationClassName;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _reactcomponents = require("@fluentui/react-components");
|
|
12
|
+
const _morsecode = require("@fluentui-copilot/morse-code");
|
|
13
|
+
(0, _morsecode.initializeMorseCodeSmallCustomProperties)();
|
|
14
|
+
const sharedStyles = {
|
|
15
|
+
backgroundImage: _morsecode.morseCodeSmallTokens.backgroundImage,
|
|
16
|
+
animationIterationCount: _morsecode.morseCodeSmallTokens.morseCodeAnimationIterationCount,
|
|
17
|
+
animationDuration: _morsecode.morseCodeSmallTokens.morseCodeAnimationDuration,
|
|
18
|
+
animationTimingFunction: _morsecode.morseCodeSmallTokens.morseCodeAnimationTimingFunction
|
|
19
|
+
};
|
|
20
|
+
const useMorseCodeAnimationClassName = (0, _reactcomponents.makeResetStyles)({
|
|
21
|
+
...sharedStyles,
|
|
22
|
+
animationName: [
|
|
23
|
+
_morsecode.morseCodeSmallAnimationTokens.colorAnimation,
|
|
24
|
+
_morsecode.morseCodeSmallAnimationTokens.dotsAndDashes
|
|
25
|
+
],
|
|
26
|
+
'@media (forced-colors: active)': {
|
|
27
|
+
...sharedStyles,
|
|
28
|
+
animationName: [
|
|
29
|
+
_morsecode.morseCodeSmallAnimationTokens.colorHCAnimation,
|
|
30
|
+
_morsecode.morseCodeSmallAnimationTokens.dotsAndDashes
|
|
31
|
+
]
|
|
32
|
+
}
|
|
33
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["MorseCodeSmallHoudini.styles.ts"],"sourcesContent":["import { makeResetStyles } from '@fluentui/react-components';\n\nimport {\n initializeMorseCodeSmallCustomProperties,\n morseCodeSmallAnimationTokens,\n morseCodeSmallTokens,\n} from '@fluentui-copilot/morse-code';\n\ninitializeMorseCodeSmallCustomProperties();\n\nconst sharedStyles = {\n backgroundImage: morseCodeSmallTokens.backgroundImage,\n animationIterationCount: morseCodeSmallTokens.morseCodeAnimationIterationCount,\n animationDuration: morseCodeSmallTokens.morseCodeAnimationDuration,\n animationTimingFunction: morseCodeSmallTokens.morseCodeAnimationTimingFunction,\n};\n\nexport const useMorseCodeAnimationClassName = makeResetStyles({\n ...sharedStyles,\n animationName: [morseCodeSmallAnimationTokens.colorAnimation, morseCodeSmallAnimationTokens.dotsAndDashes],\n\n '@media (forced-colors: active)': {\n ...sharedStyles,\n animationName: [morseCodeSmallAnimationTokens.colorHCAnimation, morseCodeSmallAnimationTokens.dotsAndDashes],\n },\n});\n"],"names":["useMorseCodeAnimationClassName","initializeMorseCodeSmallCustomProperties","sharedStyles","backgroundImage","morseCodeSmallTokens","animationIterationCount","morseCodeAnimationIterationCount","animationDuration","morseCodeAnimationDuration","animationTimingFunction","morseCodeAnimationTimingFunction","makeResetStyles","animationName","morseCodeSmallAnimationTokens","colorAnimation","dotsAndDashes","colorHCAnimation"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAiBaA;;;eAAAA;;;iCAjBmB;2BAMzB;AAEPC,IAAAA,mDAAAA;AAEA,MAAMC,eAAe;IACnBC,iBAAiBC,+BAAAA,CAAqBD,eAAe;IACrDE,yBAAyBD,+BAAAA,CAAqBE,gCAAgC;IAC9EC,mBAAmBH,+BAAAA,CAAqBI,0BAA0B;IAClEC,yBAAyBL,+BAAAA,CAAqBM,gCAAgC;AAChF;AAEO,MAAMV,iCAAiCW,IAAAA,gCAAAA,EAAgB;IAC5D,GAAGT,YAAY;IACfU,eAAe;QAACC,wCAAAA,CAA8BC,cAAc;QAAED,wCAAAA,CAA8BE,aAAa;KAAC;IAE1G,kCAAkC;QAChC,GAAGb,YAAY;QACfU,eAAe;YAACC,wCAAAA,CAA8BG,gBAAgB;YAAEH,wCAAAA,CAA8BE,aAAa;SAAC;IAC9G;AACF"}
|
package/lib-commonjs/index.js
CHANGED
|
@@ -34,4 +34,3 @@ const _MorseCodeHoudini = require("./components/large/MorseCodeHoudini");
|
|
|
34
34
|
const _MorseCodeSmall = require("./components/small/MorseCodeSmall");
|
|
35
35
|
const _MorseCodeSmallFallback = require("./components/small/MorseCodeSmallFallback");
|
|
36
36
|
const _MorseCodeSmallHoudini = require("./components/small/MorseCodeSmallHoudini");
|
|
37
|
-
//# sourceMappingURL=index.js.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui-copilot/react-morse-code",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.12",
|
|
4
4
|
"description": "A Fluent AI package",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
"license": "MIT",
|
|
14
14
|
"dependencies": {
|
|
15
15
|
"@fluentui-contrib/houdini-utils": "0.3.5",
|
|
16
|
-
"@fluentui-copilot/morse-code": "^0.0.
|
|
16
|
+
"@fluentui-copilot/morse-code": "^0.0.10",
|
|
17
17
|
"@swc/helpers": "^0.5.1"
|
|
18
18
|
},
|
|
19
19
|
"peerDependencies": {
|