@mapples/ui 1.0.6 → 1.0.7

package/dist/components/media/Svg/Svg.d.ts

@@ -0,0 +1,44 @@
+import { StyledProp, StyledProps, WithStyledProps } from '@mapples/style';
+import { View, ViewProps } from 'react-native';
+import { SvgProps as RnsSvgProps } from 'react-native-svg';
+/**
+ * Props for the Svg component.
+ *
+ * @public
+ */
+export type SvgProps = WithStyledProps<ViewProps> & {
+    /** Styling configuration for the container and SVG */
+    styled?: StyledProps<ViewProps> & {
+        /** SVG-specific styling (width, height, color) */
+        styleSvg?: StyledProp<RnsSvgProps>;
+    };
+    /** SVG markup string (e.g. from Figma vector group conversion) */
+    content?: string;
+};
+/**
+ * Renders inline SVG from a string (e.g. from @mapplesorg/figmafile GROUP→Svg conversion).
+ * Uses a data URI so react-native-svg's SvgUri can display it.
+ *
+ * @example
+ * ```tsx
+ * <Svg
+ *   content='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><rect x="0" y="0" width="100" height="100" fill="#333"/></svg>'
+ *   styled={{ style: { width: 100, height: 100 }, styleSvg: { width: 100, height: 100 } }}
+ * />
+ * ```
+ *
+ * @public
+ */
+declare const Svg: import("react").ForwardRefExoticComponent<{
+    styled?: StyledProps<Partial<ViewProps>> | undefined;
+} & ViewProps & {
+    /** Styling configuration for the container and SVG */
+    styled?: StyledProps<ViewProps> & {
+        /** SVG-specific styling (width, height, color) */
+        styleSvg?: StyledProp<RnsSvgProps>;
+    };
+    /** SVG markup string (e.g. from Figma vector group conversion) */
+    content?: string;
+} & import("react").RefAttributes<View>>;
+export default Svg;
+//# sourceMappingURL=Svg.d.ts.map

package/dist/components/media/Svg/Svg.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Svg.d.ts","sourceRoot":"","sources":["../../../../src/components/media/Svg/Svg.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,UAAU,EACV,WAAW,EAGX,eAAe,EAChB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,IAAI,EAAE,SAAS,EAAa,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,QAAQ,IAAI,WAAW,EAAU,MAAM,kBAAkB,CAAC;AAInE;;;;GAIG;AACH,MAAM,MAAM,QAAQ,GAAG,eAAe,CAAC,SAAS,CAAC,GAAG;IAClD,sDAAsD;IACtD,MAAM,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,GAAG;QAChC,kDAAkD;QAClD,QAAQ,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,CAAC;KACpC,CAAC;IACF,kEAAkE;IAClE,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF;;;;;;;;;;;;;GAaG;AACH,QAAA,MAAM,GAAG;;;IAvBP,sDAAsD;aAC7C,WAAW,CAAC,SAAS,CAAC,GAAG;QAChC,kDAAkD;QAClD,QAAQ,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,CAAC;KACpC;IACD,kEAAkE;cACxD,MAAM;wCAuChB,CAAC;AAcH,eAAe,GAAG,CAAC"}

package/dist/components/media/Svg/Svg.js

@@ -0,0 +1,41 @@
+import { forwardRef } from 'react';
+import { styled, StyledView, Styler, } from '@mapples/style';
+import { SvgUri } from 'react-native-svg';
+const StyledSvgUri = styled(SvgUri);
+/**
+ * Renders inline SVG from a string (e.g. from @mapplesorg/figmafile GROUP→Svg conversion).
+ * Uses a data URI so react-native-svg's SvgUri can display it.
+ *
+ * @example
+ * ```tsx
+ * <Svg
+ *   content='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><rect x="0" y="0" width="100" height="100" fill="#333"/></svg>'
+ *   styled={{ style: { width: 100, height: 100 }, styleSvg: { width: 100, height: 100 } }}
+ * />
+ * ```
+ *
+ * @public
+ */
+const Svg = forwardRef(({ styled, content, ...props }, ref) => {
+    const { styleSvg, style, ...styledProps } = styled || {};
+    const uri = content && content.trim().length > 0
+        ? `data:image/svg+xml;charset=utf-8,${encodeURIComponent(content.trim())}`
+        : undefined;
+    const svgStyle = styleSvg ?? style;
+    return (<StyledView ref={ref} styled={{ style, ...styledProps }} {...props}>
+      {uri ? (<StyledSvgUri uri={uri} styled={{ style: svgStyle }}/>) : (<StyledView styled={{ style: styler.placeholder }}/>)}
+    </StyledView>);
+});
+Svg.displayName = 'Svg';
+const styler = Styler.create({
+    placeholder: {
+        width: '100%',
+        height: '100%',
+        minHeight: 48,
+        backgroundColor: '#f0f0f0',
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+});
+export default Svg;
+//# sourceMappingURL=Svg.js.map

package/dist/components/media/Svg/Svg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Svg.js","sourceRoot":"","sources":["../../../../src/components/media/Svg/Svg.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,EACL,MAAM,EAGN,UAAU,EACV,MAAM,GAEP,MAAM,gBAAgB,CAAC;AAExB,OAAO,EAA2B,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAEnE,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC;AAiBpC;;;;;;;;;;;;;GAaG;AACH,MAAM,GAAG,GAAG,UAAU,CAAiB,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC5E,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,WAAW,EAAE,GAAG,MAAM,IAAI,EAAE,CAAC;IAEzD,MAAM,GAAG,GACP,OAAO,IAAI,OAAO,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC;QAClC,CAAC,CAAC,oCAAoC,kBAAkB,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC,EAAE;QAC1E,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,QAAQ,GAAG,QAAQ,IAAI,KAAK,CAAC;IAEnC,OAAO,CACL,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,EAAE,GAAG,WAAW,EAAE,CAAC,CAAC,IAAI,KAAK,CAAC,CACjE;MAAA,CAAC,GAAG,CAAC,CAAC,CAAC,CACL,CAAC,YAAY,CACX,GAAG,CAAC,CAAC,GAAG,CAAC,CACT,MAAM,CAAC,CAAC,EAAE,KAAK,EAAE,QAAiC,EAAE,CAAC,EACrD,CACH,CAAC,CAAC,CAAC,CACF,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,WAAW,EAAE,CAAC,EAAG,CACtD,CACH;IAAA,EAAE,UAAU,CAAC,CACd,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,GAAG,CAAC,WAAW,GAAG,KAAK,CAAC;AAExB,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC;IAC3B,WAAW,EAAE;QACX,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,MAAM;QACd,SAAS,EAAE,EAAE;QACb,eAAe,EAAE,SAAS;QAC1B,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;KACzB;CACF,CAAC,CAAC;AAEH,eAAe,GAAG,CAAC"}

package/dist/components/media/Svg/index.d.ts

@@ -0,0 +1,4 @@
+export { default } from './Svg';
+export type { SvgProps } from './Svg';
+export * from './schematics';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/media/Svg/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/media/Svg/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAChC,YAAY,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEtC,cAAc,cAAc,CAAC"}

package/dist/components/media/Svg/index.js

@@ -0,0 +1,3 @@
+export { default } from './Svg';
+export * from './schematics';
+//# sourceMappingURL=index.js.map

package/dist/components/media/Svg/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/media/Svg/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAGhC,cAAc,cAAc,CAAC"}

package/dist/components/media/Svg/schematics.d.ts

@@ -0,0 +1,3 @@
+import { RegisteredComponent } from '@mapples/types';
+export declare const SvgSchematic: RegisteredComponent;
+//# sourceMappingURL=schematics.d.ts.map

package/dist/components/media/Svg/schematics.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"schematics.d.ts","sourceRoot":"","sources":["../../../../src/components/media/Svg/schematics.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAIrD,eAAO,MAAM,YAAY,EAAE,mBAG1B,CAAC"}

package/dist/components/media/Svg/schematics.js

@@ -0,0 +1,6 @@
+import Svg from './Svg';
+export const SvgSchematic = {
+    type: 'Svg',
+    Component: Svg,
+};
+//# sourceMappingURL=schematics.js.map

package/dist/components/media/Svg/schematics.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"schematics.js","sourceRoot":"","sources":["../../../../src/components/media/Svg/schematics.ts"],"names":[],"mappings":"AAEA,OAAO,GAAG,MAAM,OAAO,CAAC;AAExB,MAAM,CAAC,MAAM,YAAY,GAAwB;IAC/C,IAAI,EAAE,KAAK;IACX,SAAS,EAAE,GAAG;CACf,CAAC"}

package/dist/components/media/index.d.ts

@@ -8,5 +8,7 @@ export { default as BarCode } from './BarCode';
 export * from './BarCode';
 export { default as QRCode } from './QRCode';
 export * from './QRCode';
+export { default as Svg } from './Svg';
+export * from './Svg';
 export * from './schematics';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/media/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/media/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,cAAc,SAAS,CAAC;AAExB,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,cAAc,SAAS,CAAC;AAExB,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AACzC,cAAc,QAAQ,CAAC;AAEvB,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,cAAc,WAAW,CAAC;AAE1B,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAC7C,cAAc,UAAU,CAAC;AAEzB,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/media/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,cAAc,SAAS,CAAC;AAExB,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,cAAc,SAAS,CAAC;AAExB,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AACzC,cAAc,QAAQ,CAAC;AAEvB,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,cAAc,WAAW,CAAC;AAE1B,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAC7C,cAAc,UAAU,CAAC;AAEzB,OAAO,EAAE,OAAO,IAAI,GAAG,EAAE,MAAM,OAAO,CAAC;AACvC,cAAc,OAAO,CAAC;AAEtB,cAAc,cAAc,CAAC"}

package/dist/components/media/index.js

@@ -8,5 +8,7 @@ export { default as BarCode } from './BarCode';
 export * from './BarCode';
 export { default as QRCode } from './QRCode';
 export * from './QRCode';
+export { default as Svg } from './Svg';
+export * from './Svg';
 export * from './schematics';
 //# sourceMappingURL=index.js.map

package/dist/components/media/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/media/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,cAAc,SAAS,CAAC;AAExB,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,cAAc,SAAS,CAAC;AAExB,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AACzC,cAAc,QAAQ,CAAC;AAEvB,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,cAAc,WAAW,CAAC;AAE1B,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAC7C,cAAc,UAAU,CAAC;AAEzB,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/media/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,cAAc,SAAS,CAAC;AAExB,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,cAAc,SAAS,CAAC;AAExB,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AACzC,cAAc,QAAQ,CAAC;AAEvB,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,cAAc,WAAW,CAAC;AAE1B,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAC7C,cAAc,UAAU,CAAC;AAEzB,OAAO,EAAE,OAAO,IAAI,GAAG,EAAE,MAAM,OAAO,CAAC;AACvC,cAAc,OAAO,CAAC;AAEtB,cAAc,cAAc,CAAC"}

package/dist/components/media/schematics.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"schematics.d.ts","sourceRoot":"","sources":["../../../src/components/media/schematics.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAQtD,eAAO,MAAM,eAAe,EAAE,oBAM7B,CAAC"}
+{"version":3,"file":"schematics.d.ts","sourceRoot":"","sources":["../../../src/components/media/schematics.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAStD,eAAO,MAAM,eAAe,EAAE,oBAO7B,CAAC"}

package/dist/components/media/schematics.js

@@ -2,6 +2,7 @@ import { BarCodeSchematic } from './BarCode';
 import { IconSchematics } from './Icon';
 import { ImageSchematic } from './Image';
 import { QRCodeSchematic } from './QRCode';
+import { SvgSchematic } from './Svg';
 import { VideoSchematic } from './Video';
 export const MediaSchematics = {
     [VideoSchematic.type]: VideoSchematic,
@@ -9,5 +10,6 @@ export const MediaSchematics = {
     [IconSchematics.type]: IconSchematics,
     [BarCodeSchematic.type]: BarCodeSchematic,
     [QRCodeSchematic.type]: QRCodeSchematic,
+    [SvgSchematic.type]: SvgSchematic,
 };
 //# sourceMappingURL=schematics.js.map

package/dist/components/media/schematics.js.map

@@ -1 +1 @@
-{"version":3,"file":"schematics.js","sourceRoot":"","sources":["../../../src/components/media/schematics.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AACxC,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AACzC,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAC3C,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,MAAM,CAAC,MAAM,eAAe,GAAyB;IACnD,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,cAAc;IACrC,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,cAAc;IACrC,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,cAAc;IACrC,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,gBAAgB;IACzC,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE,eAAe;CACxC,CAAC"}
+{"version":3,"file":"schematics.js","sourceRoot":"","sources":["../../../src/components/media/schematics.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AACxC,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AACzC,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAC3C,OAAO,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,MAAM,CAAC,MAAM,eAAe,GAAyB;IACnD,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,cAAc;IACrC,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,cAAc;IACrC,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,cAAc;IACrC,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,gBAAgB;IACzC,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE,eAAe;IACvC,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,YAAY;CAClC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mapples/ui",
-  "version": "1.0.6",
+  "version": "1.0.7",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "scripts": {